@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');

:root {
    --md-sys-color-primary-rgb: 59, 105, 59;
    --md-sys-color-secondary-container-rgb: 213, 232, 208;
    --md-sys-color-on-surface-rgb: 27, 28, 26;
    --md-sys-color-error-rgb: 186, 26, 26;
    --md-sys-color-error-container-rgb: 255, 218, 214;
    --md-sys-color-surface-rgb: 253, 253, 246;
    --custom-color-app-bar-rgb: 27, 51, 26;
    --md-sys-color-on-error-container-rgb: 65, 0, 2;
    --custom-color-app-bar: #1b331a;
    --custom-color-on-app-bar: #ffffff;
    --md-sys-color-primary: #3b693b;
    --md-sys-color-on-primary: #ffffff;
    --md-sys-color-primary-container: #bdeebb;
    --md-sys-color-on-primary-container: #002106;
    --md-sys-color-secondary: #526350;
    --md-sys-color-on-secondary: #ffffff;
    --md-sys-color-secondary-container: #d5e8d0;
    --md-sys-color-on-secondary-container: #101f11;
    --md-sys-color-error: #ba1a1a;
    --md-sys-color-on-error: #ffffff;
    --md-sys-color-error-container: #ffdad6;
    --md-sys-color-on-error-container: #410002;
    --md-sys-color-surface-dim: #dad9d5;
    --md-sys-color-surface: #fdfdf6;
    --md-sys-color-surface-bright: #fdfdf6;
    --md-sys-color-surface-container-lowest: #ffffff;
    --md-sys-color-surface-container-low: #f7f7f0;
    --md-sys-color-surface-container: #f1f1ea;
    --md-sys-color-surface-container-high: #ebebe4;
    --md-sys-color-surface-container-highest: #e5e5de;
    --md-sys-color-on-surface: #1b1c1a;
    --md-sys-color-on-surface-variant: #454843;
    --md-sys-color-background: #f8f6f2;
    --md-sys-color-on-background: #1b1c1a;
    --md-sys-color-outline: #757873;
    --md-sys-color-outline-variant: #c5c8c1;
    --md-sys-color-scrim: rgba(0, 0, 0, 0.55);
    --custom-color-success: #2e7d32;
    --custom-color-on-success: #ffffff;
    --custom-color-confirmed: #1565c0;
    --custom-color-on-confirmed: #ffffff;
    --custom-color-sending: #757575;
    --custom-color-on-sending: #ffffff;
    --custom-color-assistencia-bg: rgba(var(--md-sys-color-error-container-rgb), 0.3);
    --custom-color-assistencia-border: var(--md-sys-color-error);
    --custom-color-assistencia-icon: var(--md-sys-color-error);
    --m3-shape-corner-extra-small: 4px;
    --m3-shape-corner-small: 8px;
    --m3-shape-corner-medium: 12px;
    --m3-shape-corner-large: 16px;
    --m3-shape-corner-extra-large: 28px;
    --m3-shape-corner-full: 999px;
    --m3-elevation-level0: none;
    --m3-elevation-level1: 0px 1px 3px rgba(0, 0, 0, 0.15), 0px 1px 2px rgba(0, 0, 0, 0.3);
    --m3-elevation-level2: 0px 2px 6px rgba(0, 0, 0, 0.18), 0px 2px 4px rgba(0, 0, 0, 0.25);
    --m3-elevation-level3: 0px 4px 8px rgba(0, 0, 0, 0.18), 0px 2px 4px rgba(0, 0, 0, 0.25);
    --m3-elevation-level4: 0px 6px 10px rgba(0, 0, 0, 0.18), 0px 2px 4px rgba(0, 0, 0, 0.25);
    --m3-elevation-level5: 0px 8px 12px rgba(0, 0, 0, 0.18), 0px 4px 5px rgba(0, 0, 0, 0.25);
    --m3-font-family: 'Roboto', sans-serif;
    --m3-font-weight-regular: 400;
    --m3-font-weight-medium: 500;
    --m3-font-weight-bold: 700;
    --m3-typescale-body-small-font-size: 0.75rem; --m3-typescale-body-small-line-height: 1.125rem;
    --m3-typescale-body-medium-font-size: 0.875rem; --m3-typescale-body-medium-line-height: 1.375rem;
    --m3-typescale-body-large-font-size: 1rem; --m3-typescale-body-large-line-height: 1.5rem;
    --m3-typescale-label-small-font-size: 0.6875rem; --m3-typescale-label-small-line-height: 1rem;
    --m3-typescale-label-medium-font-size: 0.75rem; --m3-typescale-label-medium-line-height: 1rem;
    --m3-typescale-label-large-font-size: 0.875rem; --m3-typescale-label-large-line-height: 1.25rem;
    --m3-typescale-title-medium-font-size: 1rem; --m3-typescale-title-medium-line-height: 1.5rem;
    --m3-typescale-title-large-font-size: 1.375rem; --m3-typescale-title-large-line-height: 1.75rem;
    --m3-typescale-headline-small-font-size: 1.5rem; --m3-typescale-headline-small-line-height: 2rem;
    --m3-typescale-headline-medium-font-size: 1.75rem; --m3-typescale-headline-medium-line-height: 2.25rem;
    --m3-state-layer-opacity-hover: 0.08;
    --m3-state-layer-opacity-focus: 0.12;
    --m3-state-layer-opacity-pressed: 0.12;
    --m3-focus-ring-width: 2px;
    --m3-focus-ring-offset: 2px;
    --m3-button-height: 40px;
    --m3-text-field-height: 56px;
    --m3-padding-small: 8px;
    --m3-padding-medium: 16px;
    --m3-padding-large: 24px;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    font-family: var(--m3-font-family); background-color: var(--md-sys-color-background); color: var(--md-sys-color-on-background);
    font-size: var(--m3-typescale-body-large-font-size); line-height: var(--m3-typescale-body-large-line-height);
    -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; min-height: 100vh;
}
a { color: var(--md-sys-color-primary); text-decoration: none; transition: color 0.2s ease; }
a:hover { text-decoration: underline; color: rgba(var(--md-sys-color-primary-rgb), 0.8); }
*:focus { outline: none; }
*:focus-visible { outline: var(--m3-focus-ring-width) solid var(--md-sys-color-primary); outline-offset: var(--m3-focus-ring-offset); border-radius: var(--m3-shape-corner-small); box-shadow: none; }
.m3-button:focus-visible { outline-color: var(--md-sys-color-primary); outline-offset: var(--m3-focus-ring-offset); }

.m3-progress-indicator__overlay {
    position: fixed;
    inset: 0;
    background-color: rgba(0,0,0,0.3);
    z-index: 10000;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
    pointer-events: none;
}

.m3-progress-indicator__overlay[style*="display: flex"] {
    opacity: 1;
    pointer-events: auto;
}

.m3-progress-indicator__circular {
    width: 48px;
    height: 48px;
    border: 4px solid rgba(var(--md-sys-color-primary-rgb), 0.3);
    border-top-color: var(--md-sys-color-primary);
    border-radius: 50%;
    animation: m3-spinner-spin 1s linear infinite;
}

@keyframes m3-spinner-spin {
    to { transform: rotate(360deg); }
}

.m3-top-app-bar { background-color: var(--custom-color-app-bar); color: var(--custom-color-on-app-bar); padding: 8px 16px; display: flex; align-items: center; justify-content: space-between; height: 64px; box-shadow: var(--m3-elevation-level1); position: sticky; top: 0; z-index: 100; }
.m3-top-app-bar .header-bar { display: flex; align-items: center; justify-content: flex-start; width: 100%; position: relative; gap: 8px; }
.m3-top-app-bar .nav-link { z-index: 1; flex-shrink: 0; }
.m3-top-app-bar__logo { max-height: 40px; object-fit: contain; margin-left: auto; margin-right: 8px; flex-shrink: 0; }
.m3-top-app-bar__action { flex-shrink: 0; z-index: 1; margin-left: 8px; }
.m3-top-app-bar .logout-button, .m3-top-app-bar .nav-link { color: var(--custom-color-on-app-bar); }
.m3-top-app-bar .logout-button::before, .m3-top-app-bar .nav-link::before { background-color: var(--custom-color-on-app-bar); }
.m3-button--icon { padding: 8px; width: 40px; height: 40px; border-radius: 50%; background: none; border: none; cursor: pointer; }
.m3-button--icon i { margin: 0; font-size: 1.25em; }

.m3-container { width: 90%; max-width: 1200px; margin: 32px auto; padding: 0; }

.m3-section-title { text-align: center; margin-top: 32px; margin-bottom: 24px; color: var(--md-sys-color-on-background); font-weight: var(--m3-font-weight-medium); display: flex; align-items: center; justify-content: center; gap: 12px; }
.m3-headline-small { font-size: var(--m3-typescale-headline-small-font-size); line-height: var(--m3-typescale-headline-small-line-height); font-weight: var(--m3-font-weight-regular); }
.m3-headline-medium { font-size: var(--m3-typescale-headline-medium-font-size); line-height: var(--m3-typescale-headline-medium-line-height); font-weight: var(--m3-font-weight-regular); }

.m3-fitter-info { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 24px; justify-content: center; }
.m3-fitter-info .montador-info { display: flex; width: 100%; justify-content: center; }
.m3-fitter-info__card { background-color: var(--md-sys-color-surface-container); color: var(--md-sys-color-on-surface-variant); padding: 16px 20px; border-radius: var(--m3-shape-corner-medium); text-align: left; flex: 1 1 auto; max-width: none; border: 1px solid var(--md-sys-color-outline-variant); box-shadow: var(--m3-elevation-level0); transition: background-color 0.2s, border-color 0.2s, box-shadow 0.2s; display: flex; align-items: center; gap: 16px; }
.m3-fitter-info__card:hover { box-shadow: var(--m3-elevation-level1); }
.m3-fitter-info__icon { font-size: 1.5rem; color: var(--md-sys-color-primary); flex-shrink: 0; }
.m3-fitter-info__card.destaque { background-color: var(--md-sys-color-primary-container); color: var(--md-sys-color-on-primary-container); border-color: rgba(var(--md-sys-color-primary-rgb), 0.5); max-width: 100%; margin-left: auto; margin-right: auto; }
.m3-fitter-info__card.destaque .m3-fitter-info__icon { color: var(--md-sys-color-on-primary-container); }
.m3-fitter-info__label { font-size: var(--m3-typescale-label-medium-font-size); display: block; margin-bottom: 2px; color: var(--md-sys-color-on-surface-variant); }
.m3-fitter-info__name, .m3-fitter-info__total { font-size: var(--m3-typescale-title-medium-font-size); font-weight: var(--m3-font-weight-medium); color: var(--md-sys-color-on-surface); display: block; }
.m3-fitter-info__card.destaque .m3-fitter-info__name { color: var(--md-sys-color-on-primary-container); }
.m3-fitter-info__total strong { font-weight: var(--m3-font-weight-medium); }

.m3-filter { display: flex; max-width: 100%; align-items: flex-end; gap: 16px; margin-bottom: 24px; flex-wrap: wrap; justify-content: center; }
.m3-filter .filtro-mes { display: flex; align-items: stretch; gap: 16px; flex-wrap: wrap; justify-content: center; width: auto; max-width: 100%; }
.m3-filter .m3-text-field { flex: 1 1 65px; max-width: 100%; min-width: 240px; }
.m3-filter .m3-button { flex-shrink: 0; align-self: stretch; }

.m3-total-registros-section { display: flex; justify-content: center; margin-bottom: 24px; }
.m3-total-registros-section .total-registros { flex-grow: 1; max-width: none; min-width: 0; text-align: left; }
.m3-total-registros-section .total-registros div { width: auto; }

.m3-page-title-card-section { margin-bottom: 32px; display: flex; justify-content: center; }
.m3-page-title-card { padding: 16px 24px; text-align: center; border-color: transparent; background-color: var(--md-sys-color-surface-container-low); width: 100%; max-width: none; box-shadow: var(--m3-elevation-level1); }
.m3-page-title-card h2 { color: var(--md-sys-color-primary); margin: 0; }

.m3-text-field { position: relative; display: inline-flex; align-items: stretch; min-width: 240px; flex: 1 1 auto; max-width: 320px; background-color: var(--md-sys-color-surface); border-radius: var(--m3-shape-corner-extra-small); min-height: var(--m3-text-field-height); height: auto; }
.m3-text-field--outlined .m3-text-field__input { border: none; background-color: transparent; color: var(--md-sys-color-on-surface); font-size: var(--m3-typescale-body-large-font-size); line-height: var(--m3-typescale-body-large-line-height); outline: none; width: 100%; z-index: 1; appearance: none; -webkit-appearance: none; -moz-appearance: none; position: relative; cursor: text; align-self: center; box-sizing: border-box; height: var(--m3-text-field-height); padding: 16px; }
.m3-text-field--outlined .m3-text-field__input:has(~ .m3-text-field__icon-leading) { padding-left: 54px; }
.m3-text-field--outlined .m3-text-field__input:not(:has(~ .m3-text-field__icon-leading)) { padding-left: 20px; }
.m3-text-field--outlined input[type="date"].m3-text-field__input:not(:has(~ .m3-text-field__icon-leading)) { padding-right: 40px; }
.m3-text-field--outlined input[type="date"].m3-text-field__input:has(~ .m3-text-field__icon-leading) { padding-right: 40px; }

.m3-text-field .m3-text-field__label { position: absolute; top: 50%; transform: translateY(-50%); font-size: var(--m3-typescale-body-large-font-size); color: var(--md-sys-color-on-surface-variant); pointer-events: none; transition: all 0.2s ease; z-index: 1; background-color: var(--md-sys-color-surface); padding: 0 4px; }
.m3-text-field__input:not(:has(~ .m3-text-field__icon-leading)) + .m3-text-field__label { left: 20px; }
.m3-text-field__input:has(~ .m3-text-field__icon-leading) + .m3-text-field__label { left: 54px; }
.m3-text-field__input:focus + .m3-text-field__label,
.m3-text-field__input:not(:placeholder-shown) + .m3-text-field__label { top: -8px; transform: translateY(0); font-size: var(--m3-typescale-label-medium-font-size); color: var(--md-sys-color-primary); }
.m3-text-field__input:not(:has(~ .m3-text-field__icon-leading)):focus + .m3-text-field__label,
.m3-text-field__input:not(:has(~ .m3-text-field__icon-leading)):not(:placeholder-shown) + .m3-text-field__label { left: 16px; }
.m3-text-field__input:has(~ .m3-text-field__icon-leading):focus + .m3-text-field__label,
.m3-text-field__input:has(~ .m3-text-field__icon-leading):not(:placeholder-shown) + .m3-text-field__label { left: 50px; }

.m3-text-field__outline { position: absolute; inset: 0; border: 1px solid var(--md-sys-color-outline); border-radius: var(--m3-shape-corner-extra-small); pointer-events: none; transition: all 0.2s ease; z-index: 0; }
.m3-text-field__input:focus ~ .m3-text-field__outline { border-width: 2px; border-color: var(--md-sys-color-primary); }
.m3-text-field__icon-leading { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: var(--md-sys-color-on-surface-variant); z-index: 2; pointer-events: none; font-size: 1.25rem; }
.m3-text-field__icon-trailing { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); z-index: 2; color: var(--md-sys-color-on-surface-variant); }
.m3-text-field__input:has(~ .m3-text-field__icon-trailing) { padding-right: 52px; }
.m3-text-field--outlined input[type="month"]::-webkit-calendar-picker-indicator, .m3-text-field--outlined input[type="date"]::-webkit-calendar-picker-indicator { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); opacity: 0.6; cursor: pointer; z-index: 2; filter: grayscale(50%); padding: 8px; }
.m3-text-field--error .m3-text-field__outline { border-color: var(--md-sys-color-error) !important; }
.m3-text-field--error .m3-text-field__label { color: var(--md-sys-color-error) !important; }
.m3-text-field__error { list-style: none; padding: 4px 16px 0 16px; font-size: var(--m3-typescale-label-small-font-size); color: var(--md-sys-color-error); margin: 0; }

.m3-file-input-group { margin-bottom: 24px; }
.m3-file-input-group label { display: block; margin-bottom: 8px; color: var(--md-sys-color-on-surface-variant); font-size: var(--m3-typescale-label-large-font-size); font-weight: var(--m3-font-weight-regular); line-height: var(--m3-typescale-label-large-line-height); }
.m3-file-input-group input[type="file"] { display: block; width: 100%; padding: 8px 12px; border: 1px solid var(--md-sys-color-outline); border-radius: var(--m3-shape-corner-extra-small); background-color: var(--md-sys-color-surface); font-size: var(--m3-typescale-body-medium-font-size); color: var(--md-sys-color-on-surface); line-height: 1.5; cursor: pointer; transition: border-color 0.2s ease; box-sizing: border-box; }
.m3-file-input-group input[type="file"]:hover { border-color: var(--md-sys-color-on-surface-variant); }
.m3-file-input-group .m3-supporting-text { padding: 4px 2px 0; font-size: var(--m3-typescale-label-small-font-size); color: var(--md-sys-color-on-surface-variant); line-height: var(--m3-typescale-label-small-line-height); margin-top: 4px; }
.m3-file-input-group .m3-input-error-list { list-style: none; padding: 4px 2px 0; margin: 0; font-size: var(--m3-typescale-label-small-font-size); color: var(--md-sys-color-error); line-height: var(--m3-typescale-label-small-line-height); }
.m3-file-input-group.has-error input[type="file"] { border-color: var(--md-sys-color-error); }
.m3-file-input-group.has-error label { color: var(--md-sys-color-error); }

.m3-select-group { margin-bottom: 24px; }
.m3-select-group label { display: block; margin-bottom: 8px; color: var(--md-sys-color-on-surface-variant); font-size: var(--m3-typescale-label-large-font-size); font-weight: var(--m3-font-weight-regular); line-height: var(--m3-typescale-label-large-line-height); }
.m3-select-group .m3-select-input { display: block; width: 100%; height: var(--m3-text-field-height); padding: 0 12px; padding-right: 32px; border: 1px solid var(--md-sys-color-outline); border-radius: var(--m3-shape-corner-extra-small); background-color: var(--md-sys-color-surface); font-size: var(--m3-typescale-body-large-font-size); color: var(--md-sys-color-on-surface); line-height: calc(var(--m3-text-field-height) - 2px); cursor: pointer; transition: border-color 0.2s ease; box-sizing: border-box; appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='24px' viewBox='0 0 24 24' width='24px' fill='%231b1c1a'%3E%3Cpath d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 10px center; background-size: 20px; }
.m3-select-group .m3-select-input:hover { border-color: var(--md-sys-color-on-surface-variant); }
.m3-select-group .m3-select-input:focus { border-color: var(--md-sys-color-primary); outline: 1px solid var(--md-sys-color-primary); outline-offset: -1px; }
.m3-select-group .m3-input-error-list { list-style: none; padding: 4px 2px 0; margin: 0; font-size: var(--m3-typescale-label-small-font-size); color: var(--md-sys-color-error); line-height: var(--m3-typescale-label-small-line-height); }
.m3-select-group.has-error .m3-select-input { border-color: var(--md-sys-color-error); }
.m3-select-group.has-error label { color: var(--md-sys-color-error); }

.m3-flash-message { padding: var(--m3-padding-medium); margin-bottom: var(--m3-padding-medium); border-radius: var(--m3-shape-corner-small); font-size: var(--m3-typescale-body-medium-font-size); display: flex; align-items: center; gap: var(--m3-padding-small); width: 100%; box-sizing: border-box; }
.m3-flash-message i { font-size: 1.25em; flex-shrink: 0; }
.m3-flash-message span { flex-grow: 1; }
.m3-flash--error, .m3-flash--danger { background-color: var(--md-sys-color-error-container); color: var(--md-sys-color-on-error-container); }
.m3-flash--success { background-color: var(--md-sys-color-primary-container); color: var(--md-sys-color-on-primary-container); }
.m3-flash--info, .m3-flash--message { background-color: var(--md-sys-color-secondary-container); color: var(--md-sys-color-on-secondary-container); }
.m3-flash--warning { background-color: #FFF8E1; color: #6D4C41; border: 1px solid #FFCA28; }

.m3-button { display: inline-flex; align-items: center; justify-content: center; padding: 10px 24px; border-radius: var(--m3-shape-corner-full); font-family: var(--m3-font-family); font-size: var(--m3-typescale-label-large-font-size); font-weight: var(--m3-font-weight-medium); letter-spacing: 0.1px; border: none; cursor: pointer; text-transform: none; transition: background-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease, opacity 0.2s ease; outline: none; position: relative; overflow: hidden; white-space: nowrap; -webkit-tap-highlight-color: transparent; min-height: var(--m3-button-height); }
.m3-button::before { content: ""; position: absolute; inset: 0; background-color: currentColor; opacity: 0; border-radius: inherit; transition: opacity 0.2s ease; z-index: 0; }
.m3-button:hover::before { opacity: var(--m3-state-layer-opacity-hover); }
.m3-button:focus-visible::before { opacity: var(--m3-state-layer-opacity-focus); }
.m3-button:active::before { opacity: var(--m3-state-layer-opacity-pressed); }
.m3-button i, .m3-button span { position: relative; z-index: 1; vertical-align: middle; }
.m3-button__icon { margin-left: -8px; margin-right: 8px; font-size: 1.125em; }
.m3-button span + .m3-button__icon { margin-left: 8px; margin-right: -8px; }
.m3-button--filled { background-color: var(--md-sys-color-primary); color: var(--md-sys-color-on-primary); box-shadow: var(--m3-elevation-level0); }
.m3-button--filled::before { background-color: var(--md-sys-color-on-primary); }
.m3-button--filled:hover:not(:disabled) { box-shadow: var(--m3-elevation-level1); background-color: rgba(var(--md-sys-color-primary-rgb), 0.95); }
.m3-button--filled:disabled { background-color: rgba(var(--md-sys-color-on-surface-rgb), 0.12); color: rgba(var(--md-sys-color-on-surface-rgb), 0.38); box-shadow: none !important; cursor: not-allowed !important; }
.m3-button--filled:disabled::before, .m3-button--filled:disabled::after { display: none; }
.m3-button--tonal { background-color: var(--md-sys-color-secondary-container); color: var(--md-sys-color-on-secondary-container); box-shadow: var(--m3-elevation-level0); }
.m3-button--tonal::before { background-color: var(--md-sys-color-on-secondary-container); }
.m3-button--tonal:hover:not(:disabled) { box-shadow: var(--m3-elevation-level1); background-color: rgba(var(--md-sys-color-secondary-container-rgb), 0.9); }
.m3-button--tonal:disabled { background-color: rgba(var(--md-sys-color-on-surface-rgb), 0.12); color: rgba(var(--md-sys-color-on-surface-rgb), 0.38); box-shadow: none !important; cursor: not-allowed !important; }
.m3-button--tonal:disabled::before, .m3-button--tonal:disabled::after { display: none; }
.m3-button--outlined { background-color: transparent; color: var(--md-sys-color-primary); border: 1px solid var(--md-sys-color-outline); padding: 10px 23px; }
.m3-button--outlined::before { background-color: var(--md-sys-color-primary); }
.m3-button--outlined:hover:not(:disabled) { background-color: rgba(var(--md-sys-color-primary-rgb), 0.08); }
.m3-button--outlined:disabled { color: rgba(var(--md-sys-color-on-surface-rgb), 0.38); border-color: rgba(var(--md-sys-color-on-surface-rgb), 0.12); background-color: transparent; cursor: not-allowed !important; }
.m3-button--outlined:disabled::before, .m3-button--outlined:disabled::after { display: none; }
.m3-button--text { background-color: transparent; color: var(--md-sys-color-primary); padding-left: 12px; padding-right: 12px; }
.m3-button--text::before { background-color: var(--md-sys-color-primary); }
.m3-button--text:disabled { color: rgba(var(--md-sys-color-on-surface-rgb), 0.38); background-color: transparent; cursor: not-allowed !important; }
.m3-button--text:disabled::before, .m3-button--text:disabled::after { display: none; }
.m3-button.m3-button--sending { background-color: var(--custom-color-sending) !important; color: var(--custom-color-on-sending) !important; opacity: 0.9; cursor: wait !important; box-shadow: none !important; }
.m3-button.m3-button--sending i { animation: m3-spinner-spin 1s linear infinite; }
.m3-button.m3-button--success { background-color: var(--custom-color-success) !important; color: var(--custom-color-on-success) !important; }
.m3-button.m3-button--success::before { background-color: var(--custom-color-on-success) !important; }
.m3-button.m3-button--confirmed { background-color: var(--custom-color-confirmed) !important; color: var(--custom-color-on-confirmed) !important; }
.m3-button.m3-button--confirmed::before { background-color: var(--custom-color-on-confirmed) !important; }
.m3-button.m3-button--success.m3-button--disabled, .m3-button.m3-button--confirmed.m3-button--disabled { background-color: var(--custom-color-sending) !important; color: var(--custom-color-on-sending) !important; opacity: 0.7 !important; cursor: not-allowed !important; box-shadow: none !important; }
.m3-button.m3-button--disabled::before, .m3-button.m3-button--disabled::after { display: none !important; }
.m3-dialog__actions .m3-button--text.button-danger { color: var(--md-sys-color-error); }
.m3-dialog__actions .m3-button--text.button-danger::before { background-color: var(--md-sys-color-error); }

.m3-montagens-list { margin-bottom: 32px; }
.m3-cards-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 24px; }
.m3-card { border-radius: var(--m3-shape-corner-medium); overflow: hidden; display: flex; flex-direction: column; height: 100%; transition: box-shadow 0.25s ease, border-color 0.25s ease, background-color 0.25s ease, transform 0.20s ease-out; position: relative; border: 1px solid var(--md-sys-color-outline-variant); }
.m3-card::before { content: ""; position: absolute; inset: 0; background-color: var(--md-sys-color-on-surface); opacity: 0; border-radius: inherit; transition: opacity 0.2s ease; pointer-events: none; z-index: 0; }
.m3-card:hover { border-color: var(--md-sys-color-outline); transform: scale(1.015); }
.m3-card:hover::before { opacity: calc(var(--m3-state-layer-opacity-hover) / 4); }
.m3-card:focus-visible { border-color: var(--md-sys-color-primary); outline: none; box-shadow: var(--m3-elevation-level1); }
.m3-card:focus-visible::before { opacity: calc(var(--m3-state-layer-opacity-focus) / 2); }
.m3-card--filled { background-color: var(--md-sys-color-surface-container-low); color: var(--md-sys-color-on-surface); box-shadow: var(--m3-elevation-level1); border-color: transparent; }
.m3-card--filled:hover { box-shadow: var(--m3-elevation-level2); border-color: transparent; }
.m3-card--outlined { background-color: var(--md-sys-color-surface); color: var(--md-sys-color-on-surface); box-shadow: var(--m3-elevation-level0); border-color: var(--md-sys-color-outline-variant); }
.m3-card--outlined:hover { box-shadow: var(--m3-elevation-level1); border-color: var(--md-sys-color-outline); }
.m3-card__content { padding: 16px; flex-grow: 1; line-height: 1.6; position: relative; z-index: 1; }
.m3-card__content p { align-items: baseline; margin-bottom: 10px; font-size: var(--m3-typescale-body-medium-font-size); }
.m3-card__content p:last-child { margin-bottom: 0; }
.m3-card__content .m3-list-item .m3-list-item__icon { color: var(--md-sys-color-secondary); }
.m3-card__label { font-weight: var(--m3-font-weight-regular); color: var(--md-sys-color-on-surface-variant); margin-right: 6px; font-size: var(--m3-typescale-label-medium-font-size); flex-shrink: 0; }
.m3-card__link { color: var(--md-sys-color-primary); font-weight: var(--m3-font-weight-medium); word-break: break-all; }
.m3-card__alert { background-color: var(--md-sys-color-error-container); color: var(--md-sys-color-on-error-container); padding: 12px 16px; border-radius: var(--m3-shape-corner-small); margin: 18px 0; font-weight: var(--m3-font-weight-medium); display: flex; align-items: center; gap: 10px; font-size: var(--m3-typescale-label-large-font-size); }
.m3-card__alert-icon { font-size: 1.3em; flex-shrink: 0; }
.m3-card--assistencia .m3-alert-text--pulsing { animation: m3-pulse-text 1.2s infinite ease-in-out alternate; display: inline-block; }
@keyframes m3-pulse-text { from { opacity: 1; } to { opacity: 0.6; } }
.m3-card--assistencia { border-color: var(--custom-color-assistencia-border); border-width: 1px; background-color: var(--custom-color-assistencia-bg); box-shadow: var(--m3-elevation-level0); transform-origin: center center; }
.m3-card--assistencia:hover { box-shadow: var(--m3-elevation-level1); border-color: rgba(var(--md-sys-color-error-rgb), 0.8); background-color: rgba(var(--md-sys-color-error-container-rgb), 0.4); transform: scale(1.015); opacity: 1; }
.m3-card--assistencia:hover .m3-alert-text--pulsing { animation-play-state: paused; }
.m3-card__assistencia-icon { color: var(--custom-color-assistencia-icon); font-size: 1.1em; float: right; margin: -4px 0 0 8px; opacity: 0.8; }
.m3-card__details-section { background-color: rgba(var(--md-sys-color-surface-rgb), 0.5); padding: 16px; margin: 16px 0; border-radius: var(--m3-shape-corner-small); border: 1px solid var(--md-sys-color-outline-variant); }
.m3-card__details-section--avarias { background-color: var(--md-sys-color-error-container); border-color: rgba(var(--md-sys-color-error-rgb), 0.4); color: var(--md-sys-color-on-error-container); }
.m3-card__details-title { display: block; margin-bottom: 12px; font-weight: var(--m3-font-weight-bold); color: var(--md-sys-color-on-surface-variant); font-size: var(--m3-typescale-label-large-font-size); display: flex; align-items: center; gap: 8px; }
.m3-card__details-title i { font-size: 1em; color: var(--md-sys-color-secondary); }
.m3-card__details-title--avaria { color: var(--md-sys-color-error); font-weight: var(--m3-font-weight-bold); text-transform: uppercase; letter-spacing: 0.5px; }
.m3-card__details-title--avaria i { color: var(--md-sys-color-error); font-size: 1.1em; }
.m3-card__details-section--avarias p { font-size: var(--m3-typescale-body-small-font-size); margin-bottom: 8px; line-height: 1.5; color: var(--md-sys-color-on-error-container); }
.m3-card__details-section--avarias p:last-child { margin-bottom: 0; }
.m3-card__details-section--avarias .m3-card__avaria-item .m3-card__label { color: rgba(var(--md-sys-color-on-error-container-rgb), 0.85); font-weight: var(--m3-font-weight-medium); }
.m3-card__avaria-item { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid rgba(var(--md-sys-color-error-rgb), 0.3); }
.m3-card__avaria-item:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none;}
.m3-divider { border: none; border-top: 1px solid var(--md-sys-color-outline-variant); margin: 8px 0; }
.m3-divider--inset { margin: 6px 0; border-top-color: rgba(var(--md-sys-color-on-surface-rgb), 0.12); }
.m3-card__actions { padding: 12px 16px; display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; border-top: 1px solid var(--md-sys-color-outline-variant); position: relative; z-index: 1; background-color: inherit; border-bottom-left-radius: inherit; border-bottom-right-radius: inherit; margin-top: auto; }
.m3-card__content > .m3-button.button-download { margin-top: var(--m3-padding-large); margin-left: auto; margin-right: auto; display: block; max-width: 300px; }

.m3-list { padding: 0; margin: 0; list-style: none; }
.m3-list-item, .m3-list-item--complex { display: flex; flex-wrap: nowrap; align-items: flex-start; justify-content: flex-start; padding: 8px 0; gap: 8px; }
.m3-list-item__icon { width: 1.4em; text-align: center; flex-shrink: 0; color: var(--md-sys-color-secondary); margin-right: 8px; margin-top: 2px; font-size: 0.9em; }
.m3-list-item__label { font-weight: var(--m3-font-weight-regular); color: var(--md-sys-color-on-surface-variant); font-size: var(--m3-typescale-label-large-font-size); width: auto; min-width: 90px; flex-shrink: 0; margin-right: 6px; white-space: nowrap; }
.m3-list-item__value { font-weight: var(--m3-font-weight-regular); color: var(--md-sys-color-on-surface); font-size: var(--m3-typescale-body-medium-font-size); flex-grow: 1; word-break: break-word; text-align: left; }
.m3-list-item--complex { flex-wrap: wrap; justify-content: space-between; }
.m3-list-item--complex .m3-list-item__text { flex-grow: 1; margin-right: 16px; display: flex; align-items: flex-start; gap: 8px; }
.m3-list-item--complex .m3-button { flex-shrink: 0; align-self: center; }
.button-whatsapp { box-shadow: var(--m3-elevation-level1); }
.button-whatsapp:hover { box-shadow: var(--m3-elevation-level2); }
.button-maps { box-shadow: var(--m3-elevation-level0); }
.button-maps:hover { box-shadow: var(--m3-elevation-level1); }

.m3-dialog__scrim { display: none; position: fixed; inset: 0; background-color: var(--md-sys-color-scrim); z-index: 5000; display: flex; justify-content: center; align-items: center; padding: 24px; animation: m3-fade-in 0.25s ease-out forwards; -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
@keyframes m3-fade-in { from { opacity: 0; } to { opacity: 1; } }
.m3-dialog { background-color: var(--md-sys-color-surface-container-high); color: var(--md-sys-color-on-surface); border-radius: var(--m3-shape-corner-extra-large); box-shadow: var(--m3-elevation-level3); padding: 24px; max-width: 560px; width: 100%; display: flex; flex-direction: column; max-height: calc(100vh - 48px); animation: m3-scale-up 0.25s cubic-bezier(0.2, 0, 0, 1) forwards; position: relative; }
@keyframes m3-scale-up { from { transform: scale(0.95); opacity: 0; } to { transform: scale(1); opacity: 1; } }
.m3-dialog__header { padding-bottom: 16px; flex-shrink: 0; display: flex; align-items: center; gap: 16px; padding-right: 48px; }
.m3-dialog__icon { font-size: 1.5rem; color: var(--md-sys-color-secondary); flex-shrink: 0; }
.m3-dialog__title { font-size: var(--m3-typescale-headline-small-font-size); line-height: var(--m3-typescale-headline-small-line-height); font-weight: var(--m3-font-weight-regular); margin: 0; color: var(--md-sys-color-on-surface); flex-grow: 1; }
.m3-dialog__content { color: var(--md-sys-color-on-surface-variant); font-size: var(--m3-typescale-body-medium-font-size); line-height: 1.6; overflow-y: auto; margin-top: 0; margin-bottom: 24px; flex-grow: 1; }
.m3-dialog__header + .m3-dialog__content { margin-top: 16px; }
.m3-dialog__content:last-child { margin-bottom: 0; }
.m3-dialog__content p:last-child { margin-bottom: 0; }
.m3-dialog__content strong { color: var(--md-sys-color-on-surface); font-weight: var(--m3-font-weight-medium); }
.m3-dialog__actions { display: flex; justify-content: flex-end; gap: 8px; padding-top: 8px; flex-shrink: 0; }
.m3-dialog__close-button { position: absolute; top: 12px; right: 12px; color: var(--md-sys-color-on-surface-variant); z-index: 10; width: 40px; height: 40px; padding: 0; border-radius: 50%; }
.m3-dialog__close-button::before { background-color: var(--md-sys-color-on-surface-variant); }
.m3-dialog__close-button i { font-size: 1.25rem; margin: 0; }
.m3-dialog__close-button:hover { background-color: rgba(var(--md-sys-color-on-surface-rgb), 0.08); }
#modalIniciar .m3-file-input-group,
#modalIniciar .m3-select-group,
#modalIniciar .m3-text-field { margin-bottom: var(--m3-padding-large); }
#modalIniciar .m3-dialog__actions { padding-top: var(--m3-padding-medium); }

.m3-empty-state { text-align: center; padding: 64px 24px; color: var(--md-sys-color-on-surface-variant); width: 100%; background-color: var(--md-sys-color-surface-container-low); border-radius: var(--m3-shape-corner-medium); margin-top: 24px; border: 1px dashed var(--md-sys-color-outline-variant); }
.m3-empty-state__icon { font-size: 56px; margin-bottom: 20px; color: var(--md-sys-color-outline); }
.m3-empty-state p { font-size: var(--m3-typescale-body-large-font-size); line-height: 1.6; }

#scrollToTopBtn { position: fixed; bottom: 24px; right: 24px; z-index: 100; width: 56px; height: 56px; padding: 0; border-radius: var(--m3-shape-corner-large); box-shadow: var(--m3-elevation-level3); opacity: 0; transform: scale(0.8); pointer-events: none; visibility: hidden; transition: opacity 0.25s ease-out, transform 0.25s ease-out, box-shadow 0.2s ease, visibility 0s linear 0.25s; display: inline-flex; align-items: center; justify-content: center; border: none; cursor: pointer; }
#scrollToTopBtn.visible { opacity: 1; transform: scale(1); pointer-events: auto; visibility: visible; transition-delay: 0s; }
#scrollToTopBtn i { font-size: 1.5em; margin: 0; line-height: 1; }
.m3-fab--secondary { background-color: var(--md-sys-color-secondary-container); color: var(--md-sys-color-on-secondary-container); }
.m3-fab--secondary::before { content:""; position: absolute; inset: 0; background-color: var(--md-sys-color-on-secondary-container); opacity: 0; border-radius: inherit; transition: opacity 0.2s ease; pointer-events: none; z-index: 0; }
.m3-fab--secondary:hover:not(:disabled) { box-shadow: var(--m3-elevation-level4); }
.m3-fab--secondary:hover::before { opacity: var(--m3-state-layer-opacity-hover); }
.m3-fab--secondary:focus-visible::before { opacity: var(--m3-state-layer-opacity-focus); }
.m3-fab--secondary:active::before { opacity: var(--m3-state-layer-opacity-pressed); }
#scrollToTopBtn:focus-visible { outline-color: var(--md-sys-color-secondary); border-radius: var(--m3-shape-corner-large); }

select#apelido.locked {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: none !important;
    cursor: default;
}
select#apelido:disabled {
}

@media (max-width: 768px) {
    .m3-container { width: 95%; margin: 16px auto; padding: 0; }
    .m3-cards-grid { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
    .m3-filter .filtro-mes { flex-direction: column; align-items: stretch; }
    .m3-text-field,
    .m3-file-input-group,
    .m3-select-group { max-width: none; width: 100%; }
    .m3-filter .m3-button { width: 100%; }
    .m3-dialog { max-width: 90%; border-radius: var(--m3-shape-corner-large); }
    .m3-card__actions { justify-content: space-around; }
    #scrollToTopBtn { bottom: 20px; right: 20px; width: 48px; height: 48px; border-radius: 12px; }
    #scrollToTopBtn i { font-size: 1.3em; }
    .m3-list-item__label { min-width: 80px; }
    .m3-list-item__value { text-align: left; }
    .m3-fitter-info__card, .m3-total-registros-section .total-registros, .m3-page-title-card { max-width: none; }
    .m3-page-title-card { padding: 12px 16px; }
    .m3-page-title-card h2 { font-size: var(--m3-typescale-title-large-font-size); }
}

@media (max-width: 480px) {
    body { font-size: 14px; }
    .m3-container { width: 100%; max-width: 100%; margin: 0; padding: 16px var(--m3-padding-medium); box-sizing: border-box; }
    .m3-fitter-info, .m3-filter, .m3-total-registros-section, .m3-page-title-card-section, .m3-montagens-list, .lista-produtos, .m3-card__content { padding-left: 0; padding-right: 0; margin-left: 0; margin-right: 0;}
    .m3-card { margin-left: 0; margin-right: 0; padding: var(--m3-padding-medium); }
    .m3-card__content { padding: 0; }
    .m3-top-app-bar { height: 56px; padding: 8px 12px; }
    .m3-top-app-bar__logo { max-height: 32px; margin-left: auto; margin-right: 8px; position: static; transform: none; }
    .m3-top-app-bar .header-bar { justify-content: flex-start; position: relative; }
    .m3-top-app-bar .nav-link, .m3-top-app-bar__action { z-index: 1; }
    .m3-button { padding: 10px 20px; min-height: 48px; }
    .m3-button--text { padding-left: 12px; padding-right: 12px; }
    .m3-cards-grid { grid-template-columns: 1fr; gap: 16px; }
    .m3-fitter-info__card, .m3-fitter-info__card.destaque { max-width: none !important; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; flex-basis: auto !important; gap: 12px; padding: 12px 16px; }
    .m3-fitter-info__icon { font-size: 1.3rem; }
    .m3-filter .filtro-mes { flex-direction: column; align-items: stretch; width: 100%; }
    .m3-filter .m3-text-field { width: 100%; max-width: none; height: auto; min-height: var(--m3-text-field-height); }
    .m3-filter .m3-text-field__input { height: var(--m3-text-field-height); padding-top: 0; padding-bottom: 0; line-height: var(--m3-text-field-height); display: flex; align-items: center; }
    .m3-filter .m3-text-field__label { top: 50%; transform: translateY(-50%); }
    .m3-filter .m3-text-field__input:focus + label, .m3-filter .m3-text-field__input:not(:placeholder-shown) + label { top: -8px; transform: translateY(0); }
    .m3-filter .m3-button { width: 100%; min-height: 48px; }
    .m3-list-item, .m3-list-item--complex { flex-direction: row; flex-wrap: nowrap; align-items: center; gap: 8px; padding: 8px 0; }
    .m3-list-item__icon { width: 1.2em; text-align: center; flex-shrink: 0; color: var(--md-sys-color-secondary); margin-right: 4px; margin-top: 0; font-size: 1em; }
    .m3-list-item__label { min-width: 0; width: auto; flex-shrink: 0; margin-right: 6px; white-space: nowrap; font-size: var(--m3-typescale-label-large-font-size); }
    .m3-list-item__value { flex-grow: 1; flex-basis: 0; margin-left: 0; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--m3-typescale-body-medium-font-size); }
    .m3-list-item--complex { flex-wrap: wrap; align-items: center; }
    .m3-list-item--complex .m3-list-item__text { flex-grow: 1; flex-basis: 0; margin-right: 8px; overflow: hidden; display: flex; flex-wrap: nowrap; align-items: center;}
    .m3-list-item--complex .m3-button { flex-shrink: 0; align-self: center; margin-top: 0; width: auto; padding-left: 16px; padding-right: 16px; }
    .m3-list-item--complex .button-whatsapp, .m3-list-item--complex .button-maps { font-size: var(--m3-typescale-label-medium-font-size); min-height: 36px; }
    .m3-list-item--complex .button-whatsapp .m3-button__icon, .m3-list-item--complex .button-maps .m3-button__icon { font-size: 1em; margin-left: -4px; margin-right: 4px; }
    .m3-card__content > .m3-button { width: 100%; max-width: none; }
    .m3-card__content > .m3-button.button-download { width: 100%; max-width: none; }
    .m3-dialog__scrim { padding: 0; align-items: flex-end; }
    .m3-dialog { width: 100%; max-width: 100%; border-radius: var(--m3-shape-corner-large) var(--m3-shape-corner-large) 0 0; margin-bottom: 0; max-height: 85vh; animation: m3-slide-up 0.3s ease-out forwards; padding: 20px; padding-top: 48px; box-sizing: border-box; }
    @keyframes m3-slide-up { from { transform: translateY(100%); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
    .m3-dialog__title { font-size: var(--m3-typescale-title-large-font-size); }
    .m3-dialog__content { margin-bottom: 16px; }
    .m3-dialog__actions { flex-direction: column-reverse; align-items: stretch; gap: 8px; }
    .m3-dialog__actions .m3-button { width: 100%; padding-left: var(--m3-padding-medium); padding-right: var(--m3-padding-medium);}
    .m3-dialog__close-button { top: 8px; right: 8px; }
    #modalIniciar .m3-file-input-group,
    #modalIniciar .m3-select-group,
    #modalIniciar .m3-text-field { margin-bottom: var(--m3-padding-medium); }
    #modalIniciar .m3-dialog__actions { padding-top: var(--m3-padding-small); }
    .m3-card__actions { flex-direction: column; align-items: stretch; gap: 8px; }
    .m3-card__actions .m3-button { width: 100%; }
    #scrollToTopBtn { bottom: 16px; right: 16px; }
}