/* ==========================================================================
   Rodare — tema do Controle de Frotas (layout 02).
   Petróleo + âmbar sobre fundo areia; menu lateral escuro; Outfit + Nunito Sans.
   Claro/escuro via data-bs-theme. Todas as cores passam por tokens.
   ========================================================================== */

:root, [data-bs-theme="light"] {
    --mz-bg: #F6F3EE;
    --mz-surface: #FFFFFF;
    --mz-surface-2: #F0EBE3;
    --mz-border: #E2DBD0;
    --mz-text: #1D2522;
    --mz-muted: #56615B;
    --mz-accent: #0F766E;
    --mz-accent-rgb: 15, 118, 110;
    --mz-accent-hover: #0B5E58;
    --mz-accent-text: #FFFFFF;
    --mz-accent-2: #E9A23B;
    --mz-active-bg: #E9A23B;
    --mz-active-text: #1D2522;
    --mz-shadow: 0 12px 32px rgba(29, 37, 34, 0.10);
    --mz-display: "Outfit", "Segoe UI", system-ui, sans-serif;
    /* cores de módulo sobre fundo claro (painel, manual) */
    --mz-g1: #0F766E; --mz-g2: #B7791F; --mz-g3: #1D4ED8; --mz-g4: #C2410C; --mz-g5: #15803D; --mz-g6: #7C3AED; --mz-g7: #64748B;
    /* menu lateral escuro */
    --mz-side-bg: #0F3D3A; --mz-side-text: #E6F4F1; --mz-side-muted: #A4CBC4; --mz-side-hover: #16524D; --mz-side-border: #1B524D;
    --mz-sg1: #E9A23B; --mz-sg2: #5EEAD4; --mz-sg3: #93C5FD; --mz-sg4: #FCA5A5; --mz-sg5: #FCD34D; --mz-sg6: #C4B5FD; --mz-sg7: #CBD5E1;

    --bs-body-bg: var(--mz-bg);
    --bs-body-color: var(--mz-text);
    --bs-body-color-rgb: 29, 37, 34;
    --bs-emphasis-color: #0E1412;
    --bs-secondary-color: var(--mz-muted);
    --bs-secondary-bg: var(--mz-surface-2);
    --bs-tertiary-bg: var(--mz-surface-2);
    --bs-border-color: var(--mz-border);
    --bs-border-color-translucent: rgba(29, 37, 34, 0.1);
    --bs-primary: #0F766E; --bs-primary-rgb: 15, 118, 110;
    --bs-primary-bg-subtle: #DDF2EE; --bs-primary-text-emphasis: #0B4F4A; --bs-primary-border-subtle: #9ED6CD;
    --bs-secondary: #56615B; --bs-secondary-rgb: 86, 97, 91;
    --bs-danger: #C8283B; --bs-danger-rgb: 200, 40, 59; --bs-danger-bg-subtle: #FCE8EA; --bs-danger-text-emphasis: #9B1C2B; --bs-danger-border-subtle: #F2B8BF;
    --bs-warning: #A15C00; --bs-warning-rgb: 161, 92, 0; --bs-warning-bg-subtle: #FFF1D6; --bs-warning-text-emphasis: #7A4600; --bs-warning-border-subtle: #F2D08A;
    --bs-success: #157F52; --bs-success-rgb: 21, 127, 82; --bs-success-bg-subtle: #E1F4EA; --bs-success-text-emphasis: #0F5E3C; --bs-success-border-subtle: #A6DCC0;
    --bs-info: #1F66C7; --bs-info-rgb: 31, 102, 199; --bs-info-bg-subtle: #E4EEFB; --bs-info-text-emphasis: #174C94; --bs-info-border-subtle: #A9C6EE;
    --bs-link-color: #0F766E; --bs-link-color-rgb: 15, 118, 110; --bs-link-hover-color: #0B5E58; --bs-link-hover-color-rgb: 11, 94, 88;
    --bs-font-sans-serif: "Nunito Sans", "Segoe UI", system-ui, sans-serif;
    --bs-body-font-size: 0.9375rem;
    --bs-border-radius: 0.75rem;
    --bs-border-radius-sm: 0.5rem;
    --bs-border-radius-lg: 1.125rem;
    --bs-focus-ring-color: rgba(15, 118, 110, 0.28);
    color-scheme: light;
}

[data-bs-theme="dark"] {
    --mz-bg: #0C1413;
    --mz-surface: #13201E;
    --mz-surface-2: #1A2B28;
    --mz-border: #24403B;
    --mz-text: #E7F2EF;
    --mz-muted: #9AB8B1;
    --mz-accent: #2DD4BF;
    --mz-accent-rgb: 45, 212, 191;
    --mz-accent-hover: #5EEAD4;
    --mz-accent-text: #062421;
    --mz-accent-2: #E9A23B;
    --mz-active-bg: #E9A23B;
    --mz-active-text: #0C1413;
    --mz-shadow: 0 12px 32px rgba(0, 0, 0, 0.4);
    --mz-g1: #2DD4BF; --mz-g2: #E9A23B; --mz-g3: #60A5FA; --mz-g4: #FB923C; --mz-g5: #4ADE80; --mz-g6: #A78BFA; --mz-g7: #94A3B8;
    --mz-side-bg: #081010; --mz-side-text: #E6F4F1; --mz-side-muted: #8FB3AC; --mz-side-hover: #12302C; --mz-side-border: #15302C;

    --bs-body-bg: var(--mz-bg);
    --bs-body-color: var(--mz-text);
    --bs-body-color-rgb: 231, 242, 239;
    --bs-emphasis-color: #FFFFFF;
    --bs-secondary-color: var(--mz-muted);
    --bs-secondary-bg: var(--mz-surface-2);
    --bs-tertiary-bg: var(--mz-surface-2);
    --bs-border-color: var(--mz-border);
    --bs-border-color-translucent: rgba(255, 255, 255, 0.1);
    --bs-primary: #2DD4BF; --bs-primary-rgb: 45, 212, 191;
    --bs-primary-bg-subtle: #0E302B; --bs-primary-text-emphasis: #7FF0DC; --bs-primary-border-subtle: #1C5A51;
    --bs-secondary: #9AB8B1; --bs-secondary-rgb: 154, 184, 177;
    --bs-danger: #FF7382; --bs-danger-rgb: 255, 115, 130; --bs-danger-bg-subtle: #3A1419; --bs-danger-text-emphasis: #FF9DA7; --bs-danger-border-subtle: #6E2530;
    --bs-warning: #F5B544; --bs-warning-rgb: 245, 181, 68; --bs-warning-bg-subtle: #33260C; --bs-warning-text-emphasis: #F8CB78; --bs-warning-border-subtle: #6A4E17;
    --bs-success: #45D39B; --bs-success-rgb: 69, 211, 155; --bs-success-bg-subtle: #0F2E22; --bs-success-text-emphasis: #7DE2B9; --bs-success-border-subtle: #1D5A42;
    --bs-info: #6AAEFF; --bs-info-rgb: 106, 174, 255; --bs-info-bg-subtle: #122640; --bs-info-text-emphasis: #9CC8FF; --bs-info-border-subtle: #24497A;
    --bs-link-color: #2DD4BF; --bs-link-color-rgb: 45, 212, 191; --bs-link-hover-color: #5EEAD4; --bs-link-hover-color-rgb: 94, 234, 212;
    --bs-focus-ring-color: rgba(45, 212, 191, 0.35);
    color-scheme: dark;
}

/* ---------- Base ---------- */
body { background: var(--mz-bg); color: var(--mz-text); font-family: var(--bs-font-sans-serif); -webkit-font-smoothing: antialiased; }
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5 { font-family: var(--mz-display); font-weight: 700; letter-spacing: -0.01em; color: var(--mz-text); text-wrap: balance; }
.h4 { font-size: 1.6rem; }

a { text-underline-offset: 3px; }
.text-muted, .text-body-secondary { color: var(--mz-muted) !important; }
.num, .table td.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
:focus-visible { outline: 2px solid var(--mz-accent); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

/* ---------- Estrutura: menu flutuante + área principal ---------- */
.mz-shell { display: flex; gap: 20px; padding: 20px; min-height: 100vh; }
.mz-sidebar {
    width: 268px; flex-shrink: 0; position: sticky; top: 20px; align-self: flex-start;
    height: calc(100vh - 40px); display: flex; flex-direction: column; gap: 18px; padding: 22px 14px;
    background: var(--mz-surface); border: 1px solid var(--mz-border); border-radius: 24px; box-shadow: var(--mz-shadow);
}
.mz-brand { display: flex; align-items: center; gap: 12px; padding: 0 8px; text-decoration: none; color: var(--mz-text); }
.mz-brand-name { font-size: 20px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; }
.mz-brand-tag { font-size: 12px; color: var(--mz-muted); }
.mz-nav { display: flex; flex-direction: column; gap: 16px; overflow-y: auto; flex-grow: 1; margin: 0 -6px; padding: 0 6px; scrollbar-width: thin; }
.mz-group { display: flex; flex-direction: column; gap: 2px; }
.mz-group-title { display: flex; align-items: center; gap: 8px; padding: 0 12px 6px; font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--mz-muted); }
.mz-dot { width: 8px; height: 8px; border-radius: 99px; flex-shrink: 0; background: var(--dot, var(--mz-accent)); }
/* Grupos recolhíveis: só um aberto por vez, sem rolagem no menu. */
.mz-nav { gap: 4px; }
.mz-group { gap: 2px; }
.mz-group-toggle {
    width: 100%; display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 0; border-radius: 12px;
    background: transparent; color: var(--mz-text); font: inherit; font-size: 12px; font-weight: 700; letter-spacing: 0.07em;
    text-transform: uppercase; text-align: left; cursor: pointer; transition: background .15s;
}
.mz-group-toggle:hover { background: var(--mz-surface-2); }
.mz-group.open > .mz-group-toggle { color: var(--mz-text); }
.mz-group:not(.open) > .mz-group-toggle { color: var(--mz-muted); }
.mz-group-name { flex-grow: 1; }
.mz-group-total {
    min-width: 22px; text-align: center; font-size: 11px; font-weight: 700; letter-spacing: 0; padding: 1px 7px; border-radius: 99px;
    background: color-mix(in srgb, var(--dot, var(--mz-accent)) 18%, transparent); color: var(--mz-text);
}
.mz-group.open .mz-group-total { display: none; }
.mz-chevron { font-size: 12px; transition: transform .2s; }
.mz-group.open .mz-chevron { transform: rotate(180deg); }
.mz-group-items { display: flex; flex-direction: column; gap: 2px; padding: 2px 0 8px; }
.mz-group-items[hidden] { display: none; }
.mz-foot-row { display: flex; align-items: stretch; gap: 8px; }
.mz-help-btn {
    width: 48px; flex-shrink: 0; border-radius: 16px; display: flex; align-items: center; justify-content: center;
    background: var(--mz-surface-2); color: var(--mz-text); font-size: 20px; text-decoration: none; transition: background .15s, color .15s;
}
.mz-help-btn:hover { background: var(--mz-active-bg); color: var(--mz-active-text); }
.mz-link {
    display: flex; align-items: center; gap: 12px; padding: 9px 12px; border-radius: 12px;
    color: var(--mz-text); text-decoration: none; font-size: 14px; font-weight: 500; transition: background .15s, color .15s;
}
.mz-link .bi { font-size: 17px; color: var(--dot, var(--mz-muted)); transition: color .15s; }
.mz-link:hover { background: var(--mz-surface-2); color: var(--mz-text); }
.mz-link.active { background: var(--mz-active-bg); color: var(--mz-active-text); font-weight: 700; }
.mz-link.active .bi { color: var(--mz-active-text); }
.mz-count {
    margin-left: auto; min-width: 24px; text-align: center; font-size: 11px; font-weight: 700; padding: 2px 8px; border-radius: 99px;
    background: color-mix(in srgb, var(--dot, var(--mz-accent)) 18%, transparent); color: var(--mz-text);
}
.mz-link.active .mz-count { background: var(--mz-active-text); color: var(--mz-active-bg); }
.mz-user { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 16px; background: var(--mz-surface-2); }
.mz-avatar {
    width: 38px; height: 38px; border-radius: 99px; flex-shrink: 0; display: flex; align-items: center; justify-content: center;
    font-size: 13px; font-weight: 800; background: var(--mz-accent-2); color: #FFFFFF;
}
[data-bs-theme="dark"] .mz-avatar { color: #0D0D11; }
.mz-user-name { font-size: 14px; font-weight: 600; line-height: 1.2; }
.mz-user-role { font-size: 12px; color: var(--mz-muted); }

.mz-main {
    flex-grow: 1; min-width: 0; display: flex; flex-direction: column;
    background: var(--mz-bg); border: 1px solid var(--mz-border); border-radius: 24px; overflow: clip;
}
.mz-topbar {
    position: sticky; top: 0; z-index: 20; min-height: 72px; display: flex; align-items: center; gap: 12px; padding: 12px 28px;
    background: var(--mz-surface); border-bottom: 1px solid var(--mz-border);
}
.mz-crumb { display: flex; flex-direction: column; min-width: 0; }
.mz-crumb small { font-size: 12px; color: var(--mz-muted); }
.mz-crumb strong { font-size: 15px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mz-search {
    margin-left: auto; display: flex; align-items: center; gap: 10px; width: min(380px, 40vw); height: 44px; padding: 0 14px;
    border-radius: 12px; border: 1px solid var(--mz-border); background: var(--mz-bg);
}
.mz-search input { flex-grow: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--mz-text); font: inherit; font-size: 14px; }
.mz-search input::placeholder { color: var(--mz-muted); }
.mz-search:focus-within { border-color: var(--mz-accent); box-shadow: 0 0 0 3px var(--bs-focus-ring-color); }
.mz-icon-btn {
    position: relative; height: 44px; min-width: 44px; padding: 0 12px; border-radius: 12px; border: 1px solid var(--mz-border);
    background: var(--mz-surface); color: var(--mz-text); display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    font-size: 14px; font-weight: 600; text-decoration: none; cursor: pointer;
}
.mz-icon-btn:hover { background: var(--mz-surface-2); color: var(--mz-text); }
.mz-icon-btn .bi { font-size: 18px; }
.mz-badge-dot {
    position: absolute; top: 5px; right: 5px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 99px;
    display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; background: var(--bs-danger); color: #FFFFFF;
}
[data-bs-theme="dark"] .mz-badge-dot { color: #0D0D11; }
.mz-content { padding: 28px 32px 40px; display: flex; flex-direction: column; gap: 0; }
.mz-theme-dark { display: none; }
[data-bs-theme="dark"] .mz-theme-dark { display: inline; }
[data-bs-theme="dark"] .mz-theme-light { display: none; }

@media (max-width: 991.98px) {
    .mz-shell { padding: 0; gap: 0; }
    .mz-main { border-radius: 0; border: 0; }
    .mz-sidebar { position: static; height: 100%; border-radius: 0; box-shadow: none; border: 0; width: auto; }
    .mz-topbar { padding: 10px 16px; }
    .mz-search { display: none; }
    .mz-content { padding: 20px 16px 32px; }
}
.offcanvas-lg.mz-offcanvas { --bs-offcanvas-width: 290px; --bs-offcanvas-bg: var(--mz-surface); }
@media (min-width: 992px) { .offcanvas-lg.mz-offcanvas { display: contents; } }

/* ---------- Componentes Bootstrap no estilo Motriza ---------- */
.card { --bs-card-bg: var(--mz-surface); --bs-card-border-color: var(--mz-border); --bs-card-border-radius: 18px; --bs-card-inner-border-radius: 17px; --bs-card-cap-bg: transparent; --bs-card-spacer-y: 1.25rem; --bs-card-spacer-x: 1.375rem; }
.card-header { font-weight: 700; padding-top: 1rem; padding-bottom: 1rem; }
.card-body.card { border-radius: 18px; }
.list-group { --bs-list-group-bg: transparent; --bs-list-group-border-color: var(--mz-border); --bs-list-group-action-hover-bg: var(--mz-surface-2); --bs-list-group-color: var(--mz-text); }
.table { --bs-table-bg: transparent; --bs-table-color: var(--mz-text); --bs-table-border-color: var(--mz-border); --bs-table-hover-bg: var(--mz-surface-2); --bs-table-hover-color: var(--mz-text); margin-bottom: 0; }
.table > :not(caption) > * > * { padding: 0.75rem 0.875rem; }
.table thead th, .table-light th, .table > thead.table-light > tr > th {
    --bs-table-bg: var(--mz-surface-2); --bs-table-color: var(--mz-muted); background: var(--mz-surface-2) !important; color: var(--mz-muted) !important;
    font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; border-bottom-width: 1px; white-space: nowrap;
}
.table-light { --bs-table-bg: var(--mz-surface-2); --bs-table-color: var(--mz-text); }
tfoot.table-light td, tfoot.table-light th { background: var(--mz-surface-2) !important; color: var(--mz-text) !important; }
.table-warning { --bs-table-bg: var(--bs-warning-bg-subtle); --bs-table-color: var(--mz-text); }
.card > .table-responsive:first-child .table thead th:first-child { border-top-left-radius: 17px; }
.card > .table-responsive:first-child .table thead th:last-child { border-top-right-radius: 17px; }

.btn { --bs-btn-border-radius: 12px; --bs-btn-font-weight: 600; --bs-btn-padding-y: 0.5rem; --bs-btn-padding-x: 1rem; }
.btn-sm { --bs-btn-border-radius: 9px; --bs-btn-padding-y: 0.3rem; --bs-btn-padding-x: 0.7rem; }
.btn-lg, .btn-xl { --bs-btn-border-radius: 14px; }
.btn-primary, .btn-danger {
    --bs-btn-color: var(--mz-accent-text); --bs-btn-bg: var(--mz-accent); --bs-btn-border-color: var(--mz-accent);
    --bs-btn-hover-color: var(--mz-accent-text); --bs-btn-hover-bg: var(--mz-accent-hover); --bs-btn-hover-border-color: var(--mz-accent-hover);
    --bs-btn-active-color: var(--mz-accent-text); --bs-btn-active-bg: var(--mz-accent-hover); --bs-btn-active-border-color: var(--mz-accent-hover);
    --bs-btn-disabled-color: var(--mz-accent-text); --bs-btn-disabled-bg: var(--mz-accent); --bs-btn-disabled-border-color: var(--mz-accent);
    --bs-btn-focus-shadow-rgb: var(--mz-accent-rgb);
}
.btn-secondary {
    --bs-btn-color: #FFFFFF; --bs-btn-bg: var(--mz-accent-2); --bs-btn-border-color: var(--mz-accent-2);
    --bs-btn-hover-color: #FFFFFF; --bs-btn-hover-bg: #1E293B; --bs-btn-hover-border-color: #1E293B;
}
[data-bs-theme="dark"] .btn-secondary { --bs-btn-color: #0D0D11; --bs-btn-hover-color: #0D0D11; --bs-btn-hover-bg: #CBD5E1; --bs-btn-hover-border-color: #CBD5E1; }
.btn-outline-secondary, .btn-outline-primary {
    --bs-btn-color: var(--mz-text); --bs-btn-bg: var(--mz-surface); --bs-btn-border-color: var(--mz-border);
    --bs-btn-hover-color: var(--mz-text); --bs-btn-hover-bg: var(--mz-surface-2); --bs-btn-hover-border-color: var(--mz-border);
    --bs-btn-active-color: var(--mz-active-text); --bs-btn-active-bg: var(--mz-active-bg); --bs-btn-active-border-color: var(--mz-active-bg);
}
.btn-outline-primary { --bs-btn-color: var(--mz-accent); --bs-btn-border-color: color-mix(in srgb, var(--mz-accent) 45%, var(--mz-border)); }
.btn-outline-danger { --bs-btn-color: var(--bs-danger); --bs-btn-border-color: color-mix(in srgb, var(--bs-danger) 45%, var(--mz-border)); --bs-btn-hover-bg: var(--bs-danger); --bs-btn-hover-border-color: var(--bs-danger); --bs-btn-hover-color: #FFFFFF; }
.btn-success { --bs-btn-bg: var(--bs-success); --bs-btn-border-color: var(--bs-success); --bs-btn-hover-bg: var(--bs-success-text-emphasis); --bs-btn-hover-border-color: var(--bs-success-text-emphasis); }
.btn-warning { --bs-btn-color: #18181F; }
.btn-group > .btn.active { z-index: 1; }

.form-control, .form-select { border-radius: 12px; border-color: var(--mz-border); background-color: var(--mz-surface); color: var(--mz-text); min-height: 42px; }
.form-control-sm, .form-select-sm { border-radius: 9px; min-height: 34px; }
.form-control:focus, .form-select:focus { border-color: var(--mz-accent); box-shadow: 0 0 0 3px var(--bs-focus-ring-color); }
.form-check-input:checked { background-color: var(--mz-accent); border-color: var(--mz-accent); }
.form-label { font-weight: 600; font-size: 13.5px; }

/* Selos: pílulas suaves com texto legível nos dois temas (a cor vem com texto). */
.badge { border-radius: 99px; font-weight: 600; font-size: 12px; padding: 0.35em 0.75em; letter-spacing: 0; }
.text-bg-danger { background: var(--bs-danger-bg-subtle) !important; color: var(--bs-danger-text-emphasis) !important; }
.text-bg-warning { background: var(--bs-warning-bg-subtle) !important; color: var(--bs-warning-text-emphasis) !important; }
.text-bg-success { background: var(--bs-success-bg-subtle) !important; color: var(--bs-success-text-emphasis) !important; }
.text-bg-info { background: var(--bs-info-bg-subtle) !important; color: var(--bs-info-text-emphasis) !important; }
.text-bg-secondary, .text-bg-light { background: var(--mz-surface-2) !important; color: var(--mz-muted) !important; border-color: var(--mz-border) !important; }
.text-bg-primary { background: var(--bs-primary-bg-subtle) !important; color: var(--bs-primary-text-emphasis) !important; }

.alert { border-radius: 14px; border-width: 1px; }
.nav-tabs { --bs-nav-tabs-border-color: var(--mz-border); --bs-nav-tabs-link-active-bg: var(--mz-surface); --bs-nav-tabs-link-active-color: var(--mz-accent); --bs-nav-tabs-link-active-border-color: var(--mz-border) var(--mz-border) var(--mz-surface); }
.nav-tabs .nav-link { color: var(--mz-muted); font-weight: 600; border-radius: 12px 12px 0 0; }
.nav-tabs .nav-link:hover { color: var(--mz-text); }
.nav-pills { --bs-nav-pills-link-active-bg: var(--mz-active-bg); --bs-nav-pills-link-active-color: var(--mz-active-text); --bs-nav-pills-border-radius: 99px; }
.nav-pills .nav-link { color: var(--mz-text); font-weight: 600; }
.pagination { --bs-pagination-bg: var(--mz-surface); --bs-pagination-border-color: var(--mz-border); --bs-pagination-color: var(--mz-text); --bs-pagination-active-bg: var(--mz-active-bg); --bs-pagination-active-border-color: var(--mz-active-bg); --bs-pagination-hover-bg: var(--mz-surface-2); --bs-pagination-hover-color: var(--mz-text); --bs-pagination-disabled-bg: var(--mz-surface); }
.dropdown-menu { --bs-dropdown-bg: var(--mz-surface); --bs-dropdown-border-color: var(--mz-border); --bs-dropdown-link-hover-bg: var(--mz-surface-2); --bs-dropdown-border-radius: 14px; box-shadow: var(--mz-shadow); }
.progress { --bs-progress-bg: var(--mz-surface-2); --bs-progress-bar-bg: var(--mz-accent); }
.bg-body-tertiary { background: var(--mz-surface-2) !important; }
details > summary { cursor: pointer; }

/* ---------- Painel ---------- */
.mz-page-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 22px; }
.mz-page-head h1 { font-size: 30px; font-weight: 800; letter-spacing: -0.025em; margin: 0; }
.mz-page-head p { margin: 4px 0 0; color: var(--mz-muted); font-size: 14px; }
.mz-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin-bottom: 18px; }
.mz-kpi {
    display: flex; flex-direction: column; gap: 12px; padding: 20px; border-radius: 18px; text-decoration: none;
    background: var(--mz-surface); border: 1px solid var(--mz-border); color: var(--mz-text); transition: border-color .15s, transform .15s;
}
a.mz-kpi:hover { border-color: color-mix(in srgb, var(--tone) 50%, var(--mz-border)); color: var(--mz-text); transform: translateY(-1px); }
.mz-kpi-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mz-kpi-icon { width: 42px; height: 42px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 19px;
    background: color-mix(in srgb, var(--tone) 14%, transparent); color: var(--tone); }
.mz-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 99px;
    background: color-mix(in srgb, var(--tone, var(--mz-muted)) 14%, transparent); color: var(--tone, var(--mz-muted)); white-space: nowrap; }
.mz-kpi-label { font-size: 13px; font-weight: 600; color: var(--mz-muted); }
.mz-kpi-value { font-size: 34px; font-weight: 800; line-height: 1; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.mz-kpi-sub { font-size: 12.5px; color: var(--mz-muted); }
.mz-grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-bottom: 18px; }
.mz-span-2 { grid-column: span 2; }
.mz-panel { background: var(--mz-surface); border: 1px solid var(--mz-border); border-radius: 18px; padding: 22px; display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.mz-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.mz-panel-head h2 { font-size: 16px; font-weight: 700; margin: 0; }
.mz-panel-head a { font-size: 13px; font-weight: 600; text-decoration: none; }
.mz-bars { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px; align-items: end; height: 200px; }
.mz-bar-col { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 8px; height: 100%; min-width: 0; }
.mz-bar { width: 100%; border-radius: 10px 10px 4px 4px; background: color-mix(in srgb, var(--mz-accent) 30%, transparent); min-height: 3px; }
.mz-bar.current { background: var(--mz-accent); }
.mz-bar-val { font-size: 11px; font-weight: 600; color: var(--mz-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.mz-bar-lbl { font-size: 12px; font-weight: 600; }
.mz-ring-card { display: flex; align-items: center; gap: 18px; flex-grow: 1; }
.mz-ring { width: 96px; height: 96px; border-radius: 99px; flex-shrink: 0; display: flex; align-items: center; justify-content: center;
    background: conic-gradient(var(--tone) calc(var(--pct) * 1%), var(--mz-surface-2) 0); }
.mz-ring span { width: 74px; height: 74px; border-radius: 99px; display: flex; align-items: center; justify-content: center; background: var(--mz-surface);
    font-size: 17px; font-weight: 800; font-variant-numeric: tabular-nums; }
.mz-ring.na { background: var(--mz-surface-2); }
.mz-ring.na span { font-size: 12px; color: var(--mz-muted); text-align: center; }
.mz-list { display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; list-style: none; }
.mz-list li { display: flex; align-items: center; gap: 12px; min-width: 0; }
.mz-list .grow { flex-grow: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.mz-list .t { font-size: 14px; font-weight: 700; }
.mz-list .s { font-size: 13px; color: var(--mz-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mz-list .w { font-size: 12px; color: var(--mz-muted); white-space: nowrap; }
.mz-list.lined li { padding-bottom: 12px; border-bottom: 1px solid var(--mz-border); }
.mz-list.lined li:last-child { border-bottom: 0; padding-bottom: 0; }
.mz-stop { width: 44px; height: 44px; border-radius: 12px; flex-shrink: 0; display: flex; align-items: center; justify-content: center;
    background: var(--bs-danger-bg-subtle); color: var(--bs-danger); font-size: 18px; }
.mz-stage { display: flex; align-items: center; gap: 12px; }
.mz-stage .l { width: 132px; font-size: 13px; flex-shrink: 0; }
.mz-stage .track { height: 8px; border-radius: 99px; background: var(--mz-surface-2); flex-grow: 1; overflow: hidden; }
.mz-stage .fill { height: 100%; border-radius: 99px; background: var(--c); }
.mz-stage .n { width: 22px; text-align: right; font-size: 13px; font-weight: 700; font-variant-numeric: tabular-nums; }
.mz-empty { color: var(--mz-muted); font-size: 13.5px; margin: 0; }
.mz-foot { color: var(--mz-muted); font-size: 12.5px; margin-top: 4px; }
@media (max-width: 1199.98px) { .mz-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .mz-grid-3 { grid-template-columns: minmax(0, 1fr); } .mz-span-2 { grid-column: auto; } }
@media (max-width: 575.98px) { .mz-kpis { grid-template-columns: minmax(0, 1fr); } .mz-bars { gap: 8px; } .mz-bar-val { display: none; } }

/* ---------- Legado de telas internas ---------- */
.stat-card .stat-value { font-size: 2rem; font-weight: 800; line-height: 1.1; font-variant-numeric: tabular-nums; }
.thumb { width: 84px; height: 84px; object-fit: cover; border-radius: 12px; border: 1px solid var(--mz-border); }
.asset-photo { width: 100%; max-width: 320px; aspect-ratio: 4/3; object-fit: cover; border-radius: 14px; }
.kanban { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 1fr); gap: 14px; overflow-x: auto; padding-bottom: .5rem; }
.kanban-col { background: var(--mz-surface-2); border-radius: 16px; padding: 10px; min-height: 220px; }
.kanban-col .card { border-radius: 12px; }
.answer-group .btn { min-height: 52px; font-size: 1rem; }
.check-item { border-left: 4px solid var(--mz-border); }
.check-item.is-conforme { border-left-color: var(--bs-success); }
.check-item.is-nao_conforme { border-left-color: var(--bs-danger); }
.check-item.is-na { border-left-color: var(--mz-muted); }
.save-indicator { font-size: .85rem; }
.btn-xl { padding: 1rem 1.25rem; font-size: 1.05rem; }

/* ---------- Login ---------- */
.mz-auth { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; background: var(--mz-bg); }
.mz-auth-card { width: 100%; max-width: 420px; background: var(--mz-surface); border: 1px solid var(--mz-border); border-radius: 24px; box-shadow: var(--mz-shadow); padding: 32px; }

@media print {
    .mz-sidebar, .mz-topbar, .d-print-none, .offcanvas-lg { display: none !important; }
    .mz-shell { padding: 0; } .mz-main { border: 0; }
    .card, .mz-panel { break-inside: avoid; }
}

/* ==========================================================================
   Rodare: menu lateral escuro (petróleo) com item ativo em âmbar.
   ========================================================================== */
.mz-sidebar { background: var(--mz-side-bg); border-color: var(--mz-side-border); }
.offcanvas-lg.mz-offcanvas { --bs-offcanvas-bg: var(--mz-side-bg); }
.mz-sidebar .mz-brand { color: var(--mz-side-text); }
.mz-sidebar .mz-brand-tag { color: var(--mz-side-muted); }
.mz-sidebar .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }
.mz-sidebar .mz-group-toggle { color: var(--mz-side-text); }
.mz-sidebar .mz-group:not(.open) > .mz-group-toggle { color: var(--mz-side-muted); }
.mz-sidebar .mz-group-toggle:hover { background: var(--mz-side-hover); color: var(--mz-side-text); }
.mz-sidebar .mz-link { color: var(--mz-side-text); }
.mz-sidebar .mz-link:hover { background: var(--mz-side-hover); color: var(--mz-side-text); }
.mz-sidebar .mz-link.active, .mz-sidebar .mz-link.active:hover { background: var(--mz-active-bg); color: var(--mz-active-text); }
.mz-sidebar .mz-count, .mz-sidebar .mz-group-total { background: color-mix(in srgb, var(--dot) 22%, transparent); color: var(--mz-side-text); }
.mz-sidebar .mz-link.active .mz-count { background: var(--mz-active-text); color: var(--mz-active-bg); }
.mz-sidebar .mz-user { background: var(--mz-side-hover); }
.mz-sidebar .mz-user-name { color: var(--mz-side-text); }
.mz-sidebar .mz-user-role, .mz-sidebar .mz-user .text-muted { color: var(--mz-side-muted) !important; }
.mz-sidebar .mz-help-btn { background: var(--mz-side-hover); color: var(--mz-side-text); }
.mz-sidebar .mz-help-btn:hover { background: var(--mz-active-bg); color: var(--mz-active-text); }
.mz-avatar, [data-bs-theme="dark"] .mz-avatar { background: var(--mz-accent-2); color: #1D2522; }

/* Tipografia de destaque (Outfit) */
.mz-brand-name, .mz-page-head h1, .mz-kpi-value, .mz-panel-head h2, .hp-sec > h2 { font-family: var(--mz-display); }
.mz-page-head h1 { font-weight: 700; letter-spacing: -0.02em; }

/* Botão secundário neutro (o âmbar fica reservado ao item ativo) */
.btn-secondary { --bs-btn-color: #FFFFFF; --bs-btn-bg: #33413D; --bs-btn-border-color: #33413D; --bs-btn-hover-color: #FFFFFF; --bs-btn-hover-bg: #1D2522; --bs-btn-hover-border-color: #1D2522; }
[data-bs-theme="dark"] .btn-secondary { --bs-btn-color: #0C1413; --bs-btn-bg: #9AB8B1; --bs-btn-border-color: #9AB8B1; --bs-btn-hover-color: #0C1413; --bs-btn-hover-bg: #C3D8D3; --bs-btn-hover-border-color: #C3D8D3; }
.mz-sidebar .mz-group.open > .mz-group-toggle { color: var(--mz-side-text); }