/*
 * Tokens visuais globais do Painel.
 * Use em CSS: color: var(--exp-color-text-primary);
 * Use com Tailwind: bg-[var(--exp-color-primary-500)].
 */
:root {
    /* Recuo lateral compartilhado pelas paginas que adotam o design system. */
    --exp-page-gutter: clamp(24px, 5%, 80px);

    /* Campos de filtro: uso opt-in, sem alterar a densidade do legado. */
    --exp-filter-control-height: 40px;
    --exp-filter-font-size: 12px;
    --exp-filter-label-gap: 6px;

    /* Graficos opt-in: medidas compartilhadas por Gestao e BI Juridico. */
    --exp-chart-font-size: 12px;
    --exp-chart-track-height: 12px;
    --exp-chart-track-thin-height: 8px;
    --exp-chart-dot-size: 8px;

    /* Cores da marca aprovadas; adocao gradual, sem alterar o legado. */
    --exp-color-brand-blue: #1EA0F2;
    --exp-color-brand-navy: #11114B;

    /* Marca e acoes */
    --exp-color-primary-50: #f0f9ff;
    --exp-color-primary-100: #e0f2fe;
    --exp-color-primary-200: #bae6fd;
    --exp-color-primary-300: #7dd3fc;
    --exp-color-primary-400: #38bdf8;
    --exp-color-primary-500: #0ea5e9;
    --exp-color-primary-600: #0284c7;
    --exp-color-primary-700: #0369a1;
    --exp-color-primary-800: #075985;
    --exp-color-primary-900: #0c4a6e;

    /* Superficies, texto e bordas */
    --exp-color-surface: #ffffff;
    --exp-color-surface-subtle: #f8fafc;
    --exp-color-surface-muted: #f1f5f9;
    --exp-color-border: #e2e8f0;
    --exp-color-border-strong: #cbd5e1;
    --exp-color-text-primary: #0f172a;
    --exp-color-text-secondary: #475569;
    --exp-color-text-muted: #64748b;
    --exp-color-text-disabled: #94a3b8;

    /* Tinta principal (texto). No claro e o navy da marca; no escuro vira tinta clara.
       Separa o papel de TEXTO do papel de FUNDO de --exp-color-brand-navy, que deve
       permanecer escuro nos dois temas (botoes, tabs ativas, KPIs, cards de marca). */
    --exp-color-ink: var(--exp-color-brand-navy);

    /* Estados semanticos */
    --exp-color-success: #22c55e;
    --exp-color-success-subtle: #dcfce7;
    --exp-color-warning: #f59e0b;
    --exp-color-warning-subtle: #fef3c7;
    --exp-color-danger: #ef4444;
    --exp-color-danger-subtle: #fee2e2;
    /* Texto legivel sobre superficies claras e fundos semanticos suaves. */
    --exp-color-success-text: #166534;
    --exp-color-warning-text: #92400e;
    --exp-color-danger-text: #b42318;
    --exp-color-info: var(--exp-color-primary-500);
    --exp-color-info-subtle: var(--exp-color-primary-50);

    /* Shell: header (aliases para permitir personalizacao independente). */
    --exp-shell-header-bg: var(--exp-color-surface);
    --exp-shell-header-border: var(--exp-color-border);
    --exp-shell-header-shadow: var(--exp-shadow-soft);
    --exp-shell-header-action-font-size: 0.875rem;
    --exp-shell-header-action-font-weight: 500;
    --exp-shell-header-action-padding-x: 0.75rem;
    --exp-shell-profile-text: var(--exp-color-brand-navy);
    --exp-shell-profile-hover-bg: var(--exp-color-surface-muted);
    --exp-shell-profile-name-max-width: 12rem;
    --exp-shell-profile-padding-x: 0.375rem;
    --exp-shell-profile-padding-y: 0.125rem;

    /* Botoes */
    --exp-button-bg-primary: #2563eb;
    --exp-button-text-primary: #ffffff;
    --exp-button-bg-secondary: #ffffff;
    --exp-button-bg-secondary-hover: #f9fafb;
    --exp-button-border-secondary: #d1d5db;
    --exp-button-text-secondary: #1e293b;
    --exp-button-gap: 0.5rem;
    --exp-button-padding-x: 1rem;
    --exp-button-padding-y: 0.5rem;
    --exp-button-radius: var(--exp-radius-sm);
    --exp-button-hover-opacity: 0.9;

    /* Variante verde de acao; nao representa status de sucesso. */
    --exp-button-bg-green: #16a34a;
    --exp-button-bg-green-hover: #15803d;
    --exp-button-text-green: var(--exp-button-text-primary);

    /* Botao destrutivo (exclusao / descartar) */
    --exp-button-bg-danger: var(--exp-color-danger);
    --exp-button-bg-danger-hover: #dc2626;
    --exp-button-text-danger: #ffffff;
    --exp-button-ghost-danger-text: #b42318;
    --exp-button-ghost-danger-bg-hover: var(--exp-color-danger-subtle);

    /* Botao somente com icone */
    --exp-icon-button-size: 36px;
    --exp-icon-button-icon-size: 20px;
    --exp-icon-button-color: var(--exp-color-text-secondary);
    --exp-icon-button-hover-color: var(--exp-color-text-primary);
    --exp-icon-button-hover-bg: var(--exp-color-surface-muted);

    /* Contador de notificacoes */
    --exp-notification-badge-bg: #dc2626;
    --exp-notification-badge-text: var(--exp-color-surface);
    --exp-notification-badge-ring: var(--exp-shell-header-bg);
    --exp-notification-badge-size: 16px;
    --exp-notification-badge-font-size: 10px;

    /* Dropdown de acoes */
    --exp-dropdown-bg: var(--exp-color-surface);
    --exp-dropdown-border: var(--exp-color-border);
    --exp-dropdown-text: var(--exp-color-brand-navy);
    --exp-dropdown-icon: var(--exp-color-text-secondary);
    --exp-dropdown-hover-bg: var(--exp-color-surface-subtle);
    --exp-dropdown-danger-text: var(--exp-button-ghost-danger-text);
    --exp-dropdown-danger-hover-bg: var(--exp-button-ghost-danger-bg-hover);
    --exp-dropdown-radius: var(--exp-radius-md);
    --exp-dropdown-shadow: var(--exp-shadow-soft);
    --exp-dropdown-width: 16rem;
    --exp-dropdown-z-index: 120;
    --exp-dropdown-font-size: 0.875rem;
    --exp-dropdown-item-padding-x: 0.875rem;
    --exp-dropdown-item-padding-y: 0.625rem;

    /* Avatar */
    --exp-avatar-size-xs: 1.5rem;
    --exp-avatar-size-sm: 2rem;
    --exp-avatar-size-md: 2.5rem;
    --exp-avatar-size-lg: 3.5rem;
    --exp-avatar-size-xl: 5rem;
    --exp-avatar-bg-unassigned: #f8fafc;
    --exp-avatar-text: #ffffff;
    --exp-avatar-border: #ffffff;
    --exp-avatar-group-gap: -0.5rem;

    /* Modal de filtros */
    --exp-filtros-overlay: rgba(0, 0, 0, 0.4);
    --exp-filtros-largura: 48rem;
    --exp-filtros-raio: 0.75rem;
    --exp-filtros-padding-x: 1.5rem;
    --exp-filtros-padding-y: 1rem;
    --exp-filtros-gap: 1rem;
    --exp-filtros-z-index: 50;
    --exp-filtros-sombra: 0 20px 25px -5px rgba(0, 0, 0, 0.1),
                           0 8px 10px -6px rgba(0, 0, 0, 0.1);

    /* Fundacoes reutilizaveis */
    --exp-radius-sm: 0.375rem;
    --exp-radius-md: 0.5rem;
    --exp-radius-lg: 0.75rem;
    --exp-radius-xl: 1rem;
    --exp-shadow-soft: 0 4px 14px rgba(15, 23, 42, 0.08);
    --exp-transition-base: 150ms ease;
}

@media (max-width: 600px) {
    :root { --exp-page-gutter: 12px; }
}

html.dark {
    color-scheme: dark;

    /* =========================================================================
       EXPEDIT DARK — MIDNIGHT SLATE

       Regra:
       - neutros/slate constroem a interface;
       - azul Expedit fica reservado para marca e interação;
       - elevação acontece principalmente por luminosidade;
       - cores semânticas comunicam significado, não decoração.
       ========================================================================= */

    /* -------------------------------------------------------------------------
       Primitivos exclusivos do tema escuro
       ------------------------------------------------------------------------- */

    --exp-dark-canvas: #0B1220;
    --exp-dark-surface: #111827;
    --exp-dark-surface-raised: #172033;
    --exp-dark-surface-hover: #1E293B;

    --exp-dark-border: #263449;
    --exp-dark-border-strong: #56667C;


    /* -------------------------------------------------------------------------
       Superfícies
       ------------------------------------------------------------------------- */

    /* Fundo geral da aplicação */
    --exp-color-surface-subtle: var(--exp-dark-canvas);

    /* Cards, sidebar, header e componentes */
    --exp-color-surface: var(--exp-dark-surface);

    /* Hover, selected neutro e preenchimentos secundários */
    --exp-color-surface-muted: var(--exp-dark-surface-hover);

    /* Menus, popovers, dropdowns e elementos elevados */
    --exp-color-surface-raised: var(--exp-dark-surface-raised);

    /* Bordas */
    --exp-color-border: var(--exp-dark-border);
    --exp-color-border-strong: var(--exp-dark-border-strong);


    /* -------------------------------------------------------------------------
       Texto
       ------------------------------------------------------------------------- */

    /*
     * Evita branco puro em todo o conteúdo.
     * Mantém contraste alto sem criar efeito "brilhando" no fundo escuro.
     */
    --exp-color-text-primary: #F1F5F9;
    --exp-color-text-secondary: #CBD5E1;
    --exp-color-text-muted: #94A3B8;
    --exp-color-text-disabled: #64748B;

    --exp-color-ink: var(--exp-color-text-primary);


    /* -------------------------------------------------------------------------
       Interação / Accent
       ------------------------------------------------------------------------- */

    /*
     * Brand blue continua sendo identidade.
     * Não deve virar a cor de todas as superfícies.
     */
    --exp-color-link: #38BDF8;
    --exp-color-link-hover: #7DD3FC;

    --exp-color-focus-ring: #38BDF8;
    --exp-color-focus-ring-offset: var(--exp-dark-canvas);


    /* -------------------------------------------------------------------------
       Seleção
       Ex.: item ativo da sidebar, filtros selecionados, linhas selecionadas.
       ------------------------------------------------------------------------- */

    --exp-color-selected-bg: rgba(30, 160, 242, 0.14);
    --exp-color-selected-bg-hover: rgba(30, 160, 242, 0.20);
    --exp-color-selected-border: rgba(56, 189, 248, 0.38);
    --exp-color-selected-text: #BAE6FD;


    /* -------------------------------------------------------------------------
       Estados semânticos
       ------------------------------------------------------------------------- */

    --exp-color-success: #4ADE80;
    --exp-color-success-subtle: #0F2A1D;
    --exp-color-success-text: #86EFAC;

    --exp-color-warning: #FBBF24;
    --exp-color-warning-subtle: #33250B;
    --exp-color-warning-text: #FCD34D;

    --exp-color-danger: #F87171;
    --exp-color-danger-subtle: #351418;
    --exp-color-danger-text: #FDA4AF;

    --exp-color-info: #38BDF8;
    --exp-color-info-subtle: #0B2942;
    --exp-color-info-text: #7DD3FC;


    /* -------------------------------------------------------------------------
       Botão primário
       ------------------------------------------------------------------------- */

    /*
     * Mantém azul mais profundo para permitir texto branco acessível.
     */
    --exp-button-bg-primary: #2563EB;
    --exp-button-bg-primary-hover: #1D4ED8;
    --exp-button-bg-primary-active: #1E40AF;
    --exp-button-text-primary: #FFFFFF;

    /* Melhor usar estados de cor explícitos em vez de opacity */
    --exp-button-hover-opacity: 1;


    /* -------------------------------------------------------------------------
       Botão secundário / outlined
       ------------------------------------------------------------------------- */

    --exp-button-bg-secondary: var(--exp-dark-surface);
    --exp-button-bg-secondary-hover: var(--exp-dark-surface-hover);
    --exp-button-border-secondary: var(--exp-dark-border-strong);
    --exp-button-text-secondary: var(--exp-color-text-primary);


    /* -------------------------------------------------------------------------
       Variante verde LEGADA

       Sugestão: remover do Design System.
       Verde deveria significar success/positivo, não uma ação arbitrária.
       Mantido aqui apenas por compatibilidade.
       ------------------------------------------------------------------------- */

    --exp-button-bg-green: #15803D;
    --exp-button-bg-green-hover: #166534;
    --exp-button-text-green: #FFFFFF;


    /* -------------------------------------------------------------------------
       Destrutivo
       ------------------------------------------------------------------------- */

    /*
     * Não usar --exp-color-danger diretamente como fundo.
     * O danger de foreground é propositalmente mais claro no dark,
     * enquanto botão preenchido precisa ser mais escuro para texto branco.
     */
    --exp-button-bg-danger: #DC2626;
    --exp-button-bg-danger-hover: #B91C1C;
    --exp-button-text-danger: #FFFFFF;

    --exp-button-ghost-danger-text: #FDA4AF;
    --exp-button-ghost-danger-bg-hover: #351418;


    /* -------------------------------------------------------------------------
       Icon buttons
       ------------------------------------------------------------------------- */

    --exp-icon-button-color: #94A3B8;
    --exp-icon-button-hover-color: #F1F5F9;
    --exp-icon-button-hover-bg: var(--exp-dark-surface-hover);


    /* -------------------------------------------------------------------------
       Header / shell
       ------------------------------------------------------------------------- */

    --exp-shell-header-bg: var(--exp-dark-surface);
    --exp-shell-header-border: var(--exp-dark-border);

    /*
     * Shadow propositalmente discreta.
     * A diferença de superfície faz a maior parte do trabalho de elevação.
     */
    --exp-shell-header-shadow:
        0 1px 0 rgba(255, 255, 255, 0.02),
        0 8px 24px rgba(0, 0, 0, 0.16);

    --exp-shell-profile-text: var(--exp-color-text-secondary);
    --exp-shell-profile-hover-bg: var(--exp-dark-surface-hover);


    /* -------------------------------------------------------------------------
       Dropdowns / popovers
       ------------------------------------------------------------------------- */

    --exp-dropdown-bg: var(--exp-dark-surface-raised);
    --exp-dropdown-border: var(--exp-dark-border);

    --exp-dropdown-text: var(--exp-color-text-primary);
    --exp-dropdown-icon: var(--exp-color-text-muted);

    --exp-dropdown-hover-bg: var(--exp-dark-surface-hover);

    --exp-dropdown-danger-text: #FDA4AF;
    --exp-dropdown-danger-hover-bg: #351418;

    --exp-dropdown-shadow:
        0 16px 40px rgba(0, 0, 0, 0.38),
        0 0 0 1px rgba(148, 163, 184, 0.05);


    /* -------------------------------------------------------------------------
       Notificações
       ------------------------------------------------------------------------- */

    --exp-notification-badge-bg: #DC2626;
    --exp-notification-badge-text: #FFFFFF;
    --exp-notification-badge-ring: var(--exp-shell-header-bg);


    /* -------------------------------------------------------------------------
       Avatar
       ------------------------------------------------------------------------- */

    --exp-avatar-bg-unassigned: var(--exp-dark-surface-hover);
    --exp-avatar-text: var(--exp-color-text-primary);
    --exp-avatar-border: var(--exp-dark-surface);


    /* -------------------------------------------------------------------------
       Modal / overlay
       ------------------------------------------------------------------------- */

    --exp-filtros-overlay: rgba(2, 6, 23, 0.68);

    --exp-filtros-sombra:
        0 24px 64px rgba(0, 0, 0, 0.48),
        0 0 0 1px rgba(148, 163, 184, 0.06);


    /* -------------------------------------------------------------------------
       Elevation genérica
       ------------------------------------------------------------------------- */

    --exp-shadow-soft:
        0 12px 32px rgba(0, 0, 0, 0.28);
}
/*
 * Componentes visuais globais do Painel.
 * Carregado pelo tema global junto com expedit-tokens.css.
 */

/* Graficos em HTML/CSS: composicao e dados continuam no modulo consumidor. */
.exp-chart{min-width:0;color:var(--exp-color-ink);font-size:var(--exp-chart-font-size);font-variant-numeric:tabular-nums}
.exp-chart-track{display:flex;min-width:0;height:var(--exp-chart-track-height);overflow:hidden;border-radius:var(--exp-radius-sm);background:var(--exp-color-surface-muted)}
.exp-chart-track--thin{height:var(--exp-chart-track-thin-height)}
.exp-chart-track>:is(span,i){height:100%;flex-shrink:0}
.exp-chart-legend{display:flex;flex-wrap:wrap;gap:8px 14px;padding:0;list-style:none;font-size:var(--exp-chart-font-size);color:var(--exp-color-text-secondary);font-variant-numeric:tabular-nums}
.exp-chart-legend>:is(span,li){display:inline-flex;align-items:center;gap:6px;min-width:0;flex-wrap:wrap;overflow-wrap:anywhere}
.exp-chart-legend :is(b,strong):not(.exp-chart-dot){color:var(--exp-color-ink)}
.exp-chart-dot{display:inline-block;width:var(--exp-chart-dot-size);height:var(--exp-chart-dot-size);flex:0 0 var(--exp-chart-dot-size);border-radius:2px}
.exp-chart :focus-visible{outline:2px solid var(--exp-color-brand-blue);outline-offset:3px}

/* Paginas e tabelas opt-in: nao alteram o container ou o FlexGrid legado. */
.exp-page{box-sizing:border-box;width:100%;max-width:none;min-width:0;margin:0;padding:24px var(--exp-page-gutter,clamp(24px,5%,80px)) 40px;background:var(--exp-color-surface-subtle);color:var(--exp-color-ink);font:13px/1.5 Inter,system-ui,Arial,sans-serif;--exp-button-bg-primary:var(--exp-color-brand-navy)}
.exp-page *{box-sizing:border-box}
/* Fichas de pessoa e processo: base visual opt-in, sem controlar dados ou abas. */
.exp-record{--exp-button-text-secondary:var(--exp-color-ink);min-width:0}
.exp-record .exp-btn{min-height:36px;border-radius:var(--exp-radius-md);font-size:12px;font-weight:500;box-shadow:none}
.exp-record .exp-btn i{color:inherit}
.exp-record .exp-record-title{margin:0;color:var(--exp-color-ink);font-size:22px;line-height:1.3;font-weight:600;overflow-wrap:anywhere}
.exp-record .exp-record-heading{display:flex;align-items:center;flex-wrap:wrap;gap:8px;width:100%;min-width:0}
.exp-record .exp-record-heading>.exp-btn{margin-left:auto;flex:none;white-space:nowrap}
.exp-record .exp-record-tabs{min-width:0;margin:0 0 16px;padding:6px;border:1px solid var(--exp-color-border);border-radius:var(--exp-radius-lg);background:var(--exp-color-surface)}
.exp-record .exp-record-tabs-list{display:flex;flex-wrap:wrap;gap:4px;min-width:0;margin:0;padding:0;border:0;list-style:none;overflow:visible}
.exp-record .exp-record-tab{display:inline-flex;align-items:center;gap:7px;min-height:36px;margin:0;padding:8px 10px;border:0;border-radius:var(--exp-radius-md);background:transparent;font:500 12px/1.5 Inter,system-ui,Arial,sans-serif;color:var(--exp-color-text-secondary);text-decoration:none;white-space:nowrap;cursor:pointer;flex:none}
.exp-record .exp-record-tab i{margin:0;color:var(--exp-color-text-muted)}
.exp-record .exp-record-tab:hover{background:var(--exp-color-surface-subtle)}
.exp-record .exp-record-tab.active{background:var(--exp-color-primary-50);color:var(--exp-color-primary-700);font-weight:600}
.exp-record .exp-record-tab.active i{color:inherit}
.exp-record :is(.exp-btn,.exp-record-tab):focus-visible{outline:2px solid var(--exp-color-brand-blue);outline-offset:2px}
@media(max-width:760px){.exp-record .exp-record-tabs-list{flex-wrap:nowrap!important;overflow-x:auto!important;overscroll-behavior-x:contain;padding-bottom:4px}.exp-record .exp-record-tabs-list>li{flex:none}}
@media(max-width:600px){.exp-record .exp-record-title{font-size:18px}}
/* Campos de formularios de pagina; sem alterar submissao ou controles legados. */
.exp-form{min-width:0;color:var(--exp-color-ink);font:13px/1.5 Inter,system-ui,Arial,sans-serif}
.exp-form .form-label{display:block;margin-bottom:6px!important;font-size:12px!important;font-weight:600!important;color:var(--exp-color-ink)!important}
.exp-form label.block{display:block;margin-bottom:6px!important;font-size:12px;font-weight:600;color:var(--exp-color-ink)}
.exp-form :is(.form-control,.form-select){min-width:0;min-height:40px;padding:8px 11px!important;border:1px solid var(--exp-color-border);border-radius:var(--exp-radius-md);background-color:var(--exp-color-surface)!important;color:var(--exp-color-ink)!important;box-shadow:none;font:13px/1.45 Inter,system-ui,Arial,sans-serif}
.exp-form select:is(.form-control,.form-select){appearance:auto;background-image:none;padding-right:8px!important}
.exp-form textarea.form-control{min-height:80px;resize:vertical}
.exp-form :is(.form-control,.form-select):disabled{background-color:var(--exp-color-surface-muted)!important;color:var(--exp-color-text-muted)!important}
.exp-form :is(input,textarea)::placeholder{color:var(--exp-color-text-muted)}
.exp-form :is(.form-control,.form-select):focus{border-color:var(--exp-color-brand-blue);box-shadow:0 0 0 3px var(--exp-color-primary-50)}
.exp-form .select2-container{min-width:0;max-width:100%;width:100%!important}
.exp-form .select2-selection{min-height:40px!important;background:var(--exp-color-surface)!important;border:1px solid var(--exp-color-border)!important;border-radius:var(--exp-radius-md)}
.exp-form .select2-selection__rendered{color:var(--exp-color-ink)!important;font-size:13px;line-height:38px!important}
.exp-form .select2-selection--multiple .select2-selection__rendered{line-height:1.45!important}
.exp-form .select2-selection__choice{max-width:100%;white-space:normal;overflow-wrap:anywhere}
.exp-form .select2-selection__arrow{height:38px!important}
.exp-form :is(.form-text,.helper-text){font-size:12px;color:var(--exp-color-text-muted)}
.exp-form .exp-btn{min-height:40px}
.exp-form :focus-visible{outline:2px solid var(--exp-color-brand-blue);outline-offset:2px}
.exp-grid{min-width:0;width:100%;color:var(--exp-color-ink);font:13px/1.5 Inter,system-ui,Arial,sans-serif;--exp-button-bg-primary:var(--exp-color-brand-navy)}
.exp-grid>[class*="flexgrid-instance-"]{background:var(--exp-color-surface);border:1px solid var(--exp-color-border);border-radius:var(--exp-radius-lg);box-shadow:none;overflow:hidden}
.exp-grid>[class*="flexgrid-instance-"]>div:first-child{padding:18px 20px;gap:14px;border-color:var(--exp-color-border)}
.exp-grid h2{font-size:16px;font-weight:600;color:var(--exp-color-ink)!important;margin:0}
.exp-grid h2+p{font-size:12px;color:var(--exp-color-text-muted)!important;margin-top:4px}
.exp-grid h2+p:empty{display:none}
.exp-grid.exp-page h2{font-size:22px}
.exp-grid .new-btn-container{flex-wrap:wrap;gap:8px}
.exp-grid .new-btn-container>.exp-btn,.exp-grid [id^=export-dropdown-trigger-]{min-height:40px;font-size:12px;box-shadow:none}
.exp-grid .exp-btn i{color:inherit}
.exp-grid [id^=export-dropdown-trigger-]{border-color:var(--exp-color-border);border-radius:var(--exp-radius-md);color:var(--exp-color-ink)}
.exp-grid .flexgrid-table th{background:var(--exp-color-surface-subtle);color:var(--exp-color-text-muted);font-size:11px;font-weight:600;border-color:var(--exp-color-border)}
.exp-grid .flexgrid-table td{color:var(--exp-color-ink);border-color:var(--exp-color-border)}
.exp-grid .flexgrid-table tbody tr:hover{background:var(--exp-color-primary-50)}
.exp-grid .flexgrid-table td .exp-icon-btn{width:36px;height:36px;min-width:36px;padding:0;box-shadow:none;color:var(--exp-color-text-secondary)}
.exp-grid .flexgrid-table td .exp-icon-btn i{font-size:18px;color:inherit}
.exp-grid .flexgrid-table td .exp-icon-btn[data-metodo=DELETE]{color:var(--exp-color-danger-text)}
.exp-grid [data-flexgrid-pagination-size] select{height:40px;color:var(--exp-color-ink)!important;border:1px solid var(--exp-color-border);border-radius:var(--exp-radius-md);background:var(--exp-color-surface);appearance:auto;font-size:12px}
.exp-grid [data-flexgrid-pagination-size]{gap:6px;color:var(--exp-color-text-muted)}
.exp-grid nav button.exp-btn{width:36px;height:36px;min-height:36px;border-radius:var(--exp-radius-md);padding:0;box-shadow:none}
.exp-grid nav button[aria-current=page]{background:var(--exp-color-brand-navy);color:var(--exp-color-surface);border-color:var(--exp-color-ink)}
.exp-grid-filters{padding:20px 16px;background:color-mix(in srgb,var(--exp-color-brand-navy) 32%,transparent);backdrop-filter:none;color:var(--exp-color-ink);font:13px/1.45 Inter,system-ui,Arial,sans-serif}
.exp-grid-filters>div{display:flex;flex-direction:column;max-height:calc(100dvh - 40px);margin:0;min-width:0;border-radius:var(--exp-radius-xl);box-shadow:var(--exp-shadow-soft)}
.exp-grid-filters>div>div:first-child,.exp-grid-filters>div>div:last-child{flex:none;padding:14px 22px;border-color:var(--exp-color-border);gap:8px;flex-wrap:wrap}
.exp-grid-filters>div>div:nth-child(2){overflow:auto;min-height:0;padding:18px 22px}
.exp-grid-filters h3{font-size:16px;font-weight:600;color:var(--exp-color-ink)}
.exp-grid-filters label{font-size:12px;color:var(--exp-color-text-secondary)}
.exp-grid-filters :is(input:not([type=checkbox]):not([type=radio]),select){height:40px;border-color:var(--exp-color-border);border-radius:var(--exp-radius-md);color:var(--exp-color-ink)!important;background:var(--exp-color-surface);box-shadow:none;font-size:13px}
.exp-grid-filters select{appearance:none}
.exp-grid-filters .exp-btn{min-height:40px}
.exp-grid-filters [data-action=apply].exp-btn{background:var(--exp-color-brand-blue);color:var(--exp-color-ink)}
.exp-grid-filters [data-action=close] i{font-size:20px;color:inherit}
.exp-grid-filters .select2-selection{min-height:40px!important;border:1px solid var(--exp-color-border)!important;background:var(--exp-color-surface)!important;border-radius:var(--exp-radius-md)}
.exp-grid-filters .select2-selection__rendered{color:var(--exp-color-ink);font-size:13px}
.exp-grid-filters :focus-visible{outline:2px solid var(--exp-color-brand-blue);outline-offset:2px}
/* Variante visual do modal Twig existente; formularios e hooks sao preservados. */
.tailwind-modal.exp-modal{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:109;padding:20px 16px;overflow:hidden;background:color-mix(in srgb,var(--exp-color-brand-navy) 32%,transparent);color:var(--exp-color-ink);font:13px/1.45 Inter,system-ui,Arial,sans-serif;--exp-button-bg-primary:var(--exp-color-brand-blue);--exp-button-text-primary:var(--exp-color-ink)}
.exp-modal.hidden{display:none!important}
.exp-form-modal .form-modal-shell,.exp-form-modal .form-modal-layout{display:flex;flex-direction:column;min-height:0;overflow:hidden;width:100%}
.exp-form-modal .form-modal-layout{flex:1}
.exp-form-modal .exp-modal-body{padding-bottom:18px}
.exp-form-modal .exp-modal-body>.grid{margin:0}
.exp-form-modal .exp-modal-body :is(.exp-confirmation-content,.exp-confirmation-list){display:flex;flex-direction:column;gap:14px;min-width:0}
.exp-form-modal .exp-confirmation-list{margin-block:14px}
.exp-form-modal .exp-modal-body label.exp-confirmation-item{display:flex;align-items:flex-start;gap:12px;padding:14px;margin:0!important;border:1px solid var(--exp-color-border);border-radius:var(--exp-radius-lg);background:var(--exp-color-surface);cursor:pointer}
.exp-form-modal .exp-modal-body label.exp-confirmation-item:has(:checked){border-color:var(--exp-color-brand-blue);background:var(--exp-color-primary-50)}
.exp-form-modal .exp-confirmation-item>input{margin-top:3px!important}
.exp-form-modal .exp-confirmation-item>div{flex:1;min-width:0}
.exp-form-modal .exp-modal-body p{color:var(--exp-color-text-muted);overflow-wrap:anywhere;font-size:12px;line-height:1.5;margin:0}
.exp-form-modal .exp-modal-body .font-semibold{color:var(--exp-color-ink);font-weight:600}
.exp-form-modal .exp-flow-item,.exp-form-modal .exp-flow-notice{padding:14px;border:1px solid var(--exp-color-border);border-radius:var(--exp-radius-lg);background:var(--exp-color-surface-subtle)}
.exp-form-modal .exp-modal-body .exp-flow-notice{border-color:var(--exp-color-warning);background:var(--exp-color-warning-subtle)}
.exp-form-modal .exp-form-label-action{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:36px}
.exp-form-modal .exp-form-label-action label{margin:0!important}
.exp-form-modal .exp-modal-body .exp-form-label-row{display:flex;align-items:center;min-height:36px;margin:0!important}
.exp-form-modal .exp-form-switch{display:flex;align-items:center;gap:8px;min-height:36px}
.exp-form-modal .sp-original-input-container{width:100%;min-width:0}
.exp-form-modal .sp-original-input-container input{flex:1;min-width:0}
.exp-form-modal .exp-form-label-action .exp-btn{min-height:36px;padding:6px 10px}
.exp-form-modal .exp-modal-body .css-15w92n6{padding:14px;border:1px solid var(--exp-color-border);border-radius:var(--exp-radius-lg);background:var(--exp-color-surface-subtle);box-shadow:none}
.exp-form-modal .exp-modal-body .addNewEvento{display:block}
.timesheet-selection-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.timesheet-selection-modal .timesheet-card{border:1px solid var(--exp-color-border);border-radius:var(--exp-radius-lg);background:var(--exp-color-surface);box-shadow:none;cursor:pointer;min-width:0}
.timesheet-selection-modal .timesheet-card:is(.active,:hover){border-color:var(--exp-color-brand-blue);box-shadow:none;background:var(--exp-color-primary-50)}
.timesheet-selection-content{padding:14px}
.timesheet-selection-summary{display:flex;flex-direction:column;gap:10px}
.timesheet-selection-title{margin:0;color:var(--exp-color-ink);font-size:13px;font-weight:600;overflow-wrap:anywhere}
.timesheet-selection-details{display:flex;flex-wrap:wrap;gap:8px;align-items:center;color:var(--exp-color-text-muted);font-size:12px}
.timesheet-selection-info{margin-right:auto;color:var(--exp-color-text-muted);font-size:12px;overflow-wrap:anywhere;min-width:0;flex:1 1 180px}
.timesheet-selection-empty{grid-column:1/-1;padding:20px 0;text-align:center}
@media(max-width:520px){.timesheet-selection-list{grid-template-columns:minmax(0,1fr)}}
@media(max-width:520px){.exp-form-modal .exp-modal-body .row>:is(.col-md-3,.col-md-4,.col-md-9){flex-basis:100%}}
/* Variante opt-in para os modais Bootstrap: o plugin controla abertura e foco. */
.exp-bootstrap-modal{color:var(--exp-color-ink);font:13px/1.45 Inter,system-ui,Arial,sans-serif;--exp-button-bg-primary:var(--exp-color-brand-blue);--exp-button-text-primary:var(--exp-color-ink)}
.exp-bootstrap-modal .modal-dialog{width:var(--exp-modal-width,760px);max-width:calc(100vw - 32px);margin:20px auto;min-height:calc(100% - 40px)}
.exp-bootstrap-modal .modal-content{display:flex;flex-direction:column;max-height:calc(100dvh - 40px);min-height:0;overflow:hidden;border:1px solid var(--exp-color-border);border-radius:var(--exp-radius-xl);background:var(--exp-color-surface);box-shadow:var(--exp-shadow-soft)}
.exp-bootstrap-modal .exp-modal-form{display:flex;flex-direction:column;min-height:0;margin:0;overflow:hidden}
@media(max-width:520px){.exp-bootstrap-modal .modal-dialog{max-width:calc(100vw - 24px);margin:12px auto;min-height:calc(100% - 24px)}.exp-bootstrap-modal .modal-content{max-height:calc(100dvh - 24px)}}
.exp-modal>div:first-child{width:100%;max-width:min(var(--exp-modal-width,900px),calc(100vw - 32px));max-height:calc(100dvh - 40px);border:1px solid var(--exp-color-border);border-radius:var(--exp-radius-xl);background:var(--exp-color-surface);box-shadow:var(--exp-shadow-soft);min-height:0}
:is(.exp-modal,.exp-bootstrap-modal) .exp-modal-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:18px 22px 14px;flex:none;border-bottom:1px solid var(--exp-color-border);background:var(--exp-color-surface)}
:is(.exp-modal,.exp-bootstrap-modal) .exp-modal-header h2{font-size:16px;font-weight:600;color:var(--exp-color-ink);margin:0}
:is(.exp-modal,.exp-bootstrap-modal) .exp-modal-header p{font-size:12px;color:var(--exp-color-text-muted);margin:4px 0 0}
:is(.exp-modal,.exp-bootstrap-modal) .exp-modal-header>.exp-icon-btn{flex:none}
.exp-modal>div:first-child>form{display:flex;flex:1;flex-direction:column;min-height:0;padding:0;overflow:hidden;margin:0}
:is(.exp-modal,.exp-bootstrap-modal) form>*{margin-top:0!important;margin-bottom:0!important}
:is(.exp-modal,.exp-bootstrap-modal) .exp-modal-body{padding:18px 22px 6px;min-height:0;overflow:auto;overscroll-behavior:contain}
:is(.exp-modal,.exp-bootstrap-modal) .modal-form-footer{display:flex;flex:none;flex-direction:row;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px;padding:14px 22px;border-top:1px solid var(--exp-color-border);background:var(--exp-color-surface)}
:is(.exp-modal,.exp-bootstrap-modal) .modal-form-footer>div:empty{display:none}
:is(.exp-modal,.exp-bootstrap-modal) .modal-form-footer.hidden{display:none!important}
:is(.exp-modal,.exp-bootstrap-modal) .modal-form-footer>div:last-child{display:flex;flex-direction:row;gap:8px;flex-wrap:wrap}
:is(.exp-modal,.exp-bootstrap-modal) .modal-form-footer .exp-btn{min-height:40px;font-size:13px;font-weight:600}
:is(.exp-modal,.exp-bootstrap-modal) .exp-btn i{color:inherit}
:is(.exp-modal,.exp-bootstrap-modal) label{font-size:12px;font-weight:600;color:var(--exp-color-ink)!important;margin-bottom:6px!important}
:is(.exp-modal,.exp-bootstrap-modal) label i{color:var(--exp-color-text-muted)}
:is(.exp-modal,.exp-bootstrap-modal) :is(input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]),select,textarea){width:100%;min-width:0;min-height:40px;padding:8px 11px;border:1px solid var(--exp-color-border);border-radius:var(--exp-radius-md);background:var(--exp-color-surface);color:var(--exp-color-ink)!important;box-shadow:none;font:13px/1.45 Inter,system-ui,Arial,sans-serif}
:is(.exp-modal,.exp-bootstrap-modal) input::placeholder,:is(.exp-modal,.exp-bootstrap-modal) textarea::placeholder{color:var(--exp-color-text-muted)}
:is(.exp-modal,.exp-bootstrap-modal) select{appearance:auto}
:is(.exp-modal,.exp-bootstrap-modal) textarea{min-height:80px;resize:vertical}
:is(.exp-modal,.exp-bootstrap-modal) :is(input,textarea).shadow-sm{box-shadow:none!important}
:is(.exp-modal,.exp-bootstrap-modal) :is(input,select,textarea):not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]){padding:8px 11px!important}
:is(.exp-modal,.exp-bootstrap-modal) .relative:has(>.right-0)>input{padding-right:36px!important}
:is(.exp-modal,.exp-bootstrap-modal) .relative:has(>.left-0)>input{padding-left:36px!important}
:is(.exp-modal,.exp-bootstrap-modal) .select2-container{width:100%!important;max-width:100%;min-width:0}
:is(.exp-modal,.exp-bootstrap-modal) .select2-selection{min-height:40px!important;padding:0!important;border:1px solid var(--exp-color-border)!important;border-radius:var(--exp-radius-md);background:var(--exp-color-surface)!important}
:is(.exp-modal,.exp-bootstrap-modal) .select2-selection__rendered{color:var(--exp-color-ink)!important;font-size:13px;line-height:38px!important;padding-left:11px!important}
:is(.exp-modal,.exp-bootstrap-modal) .select2-selection--multiple .select2-selection__rendered{line-height:1.45!important;padding:4px 8px!important}
:is(.exp-modal,.exp-bootstrap-modal) .select2-selection__arrow{height:38px!important}
:is(.exp-modal,.exp-bootstrap-modal) :focus-visible{outline:2px solid var(--exp-color-brand-blue);outline-offset:2px}
@media(max-width:600px){.exp-page{padding:18px var(--exp-page-gutter,12px) 28px}.exp-grid>[class*="flexgrid-instance-"]>div:first-child{padding:14px}.exp-grid .new-btn-container{justify-content:flex-start}}
@media(max-width:520px){.tailwind-modal.exp-modal,.exp-grid-filters{padding:12px}.exp-modal>div:first-child,.exp-grid-filters>div{max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}.exp-modal>div:first-child{max-width:min(var(--exp-modal-width,900px),calc(100vw - 24px))}:is(.exp-modal,.exp-bootstrap-modal) .exp-modal-header,:is(.exp-modal,.exp-bootstrap-modal) .exp-modal-body,:is(.exp-modal,.exp-bootstrap-modal) .modal-form-footer{padding-inline:18px}.exp-grid-filters>div>div:last-child [data-flexgrid-persistence]{width:100%}.exp-grid-filters>div>div:nth-child(2)>div{grid-template-columns:minmax(0,1fr)}}

/* Shell: superficie do header; layout e hooks permanecem no template. */
.header-top.exp-shell-header {
    background-color: var(--exp-shell-header-bg);
    border-bottom: 1px solid var(--exp-shell-header-border);
    box-shadow: var(--exp-shell-header-shadow);
}

/* Campo da busca global no desktop; IDs e comportamento legado permanecem. */
.exp-search-input {
    background-color: var(--exp-color-surface-subtle);
    border-color: var(--exp-color-border-strong);
    border-radius: var(--exp-radius-sm);
    color: var(--exp-color-text-primary);
}

.exp-search-input:hover {
    background-color: var(--exp-color-surface);
}

.exp-search-input::placeholder {
    color: var(--exp-color-text-muted);
}

.exp-search-input:focus {
    border-color: var(--exp-color-brand-blue);
    outline: 2px solid var(--exp-color-brand-blue);
    outline-offset: 0;
}

/* Filtros opt-in. Layout da barra e consultas pertencem a cada tela. */
.exp-filter-field {
    display: flex; flex-direction: column; gap: var(--exp-filter-label-gap);
    min-width: 0; max-width: 100%; margin: 0;
}
.exp-filter-field > .exp-filter-label {
    color: var(--exp-color-text-secondary); font-size: var(--exp-filter-font-size);
    font-weight: 600; line-height: 1.5;
}
.exp-filter-field .exp-filter-input {
    box-sizing: border-box; width: 100%; min-width: 0; height: var(--exp-filter-control-height);
    padding: 8px 10px; border: 1px solid var(--exp-color-border); border-radius: var(--exp-radius-md);
    background: var(--exp-color-surface); color: var(--exp-color-ink);
    font: inherit; font-size: var(--exp-filter-font-size); line-height: 1.5;
}
/* O tema legado força cinza e remove a seta de todo select. */
.exp-filter-field select.exp-filter-input { color: var(--exp-color-ink) !important; appearance: none; cursor: pointer; }
.exp-filter-field .exp-filter-input::placeholder { color: var(--exp-color-text-muted); opacity: 1; }
.exp-filter-field .exp-filter-input:disabled { color: var(--exp-color-text-disabled) !important; cursor: default; background: var(--exp-color-surface-muted); }
.exp-filter-control { position: relative; display: block; min-width: 0; }
.exp-filter-control > select.exp-filter-input { padding-right: 34px; }
.exp-filter-control > .exp-filter-icon {
    position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
    color: var(--exp-color-text-muted); font-size: 10px; pointer-events: none;
}
.exp-filter-control > .exp-filter-icon--leading { left: 12px; right: auto; z-index: 1; font-size: 13px; }
.exp-filter-control--search .exp-filter-input { padding-left: 34px; }
.exp-filter-control:has(.select2-hidden-accessible) > .exp-filter-icon:not(.exp-filter-icon--leading) { display: none; }
.exp-filter-field .exp-filter-input:focus-visible,
.exp-filter-field .select2-selection:focus-visible { outline: 2px solid var(--exp-color-brand-blue); outline-offset: 2px; }
.exp-filter-actions { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 8px; }
.exp-filter-actions > .exp-btn { min-height: var(--exp-filter-control-height); font-size: var(--exp-filter-font-size); white-space: nowrap; }
.exp-filter-actions > .exp-btn[aria-disabled="true"] { opacity: .7; cursor: default; pointer-events: none; }
.exp-filter-chips { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; min-width: 0; }
.exp-filter-chips[hidden] { display: none; }
.exp-btn.exp-filter-chip {
    min-height: 36px; max-width: 100%; padding: 6px 10px; font-size: var(--exp-filter-font-size);
    border-color: var(--exp-color-border); background: var(--exp-color-info-subtle);
    color: var(--exp-color-primary-700); text-align: left; text-decoration: none;
}
.exp-filter-chip > span { min-width: 0; overflow-wrap: anywhere; }
.exp-filter-chip > i { flex-shrink: 0; color: inherit; }
.exp-filter-chip:focus-visible { outline: 2px solid var(--exp-color-brand-blue); outline-offset: 2px; }
.exp-filter-segment { display: flex; flex-wrap: wrap; align-items: stretch; gap: 2px; min-height: var(--exp-filter-control-height); padding: 3px; border: 1px solid var(--exp-color-border); border-radius: var(--exp-radius-md); background: var(--exp-color-surface-subtle); }
.exp-filter-segment > .exp-btn { flex: 1; padding: 4px 10px; font-size: var(--exp-filter-font-size); border-color: transparent; background: transparent; color: var(--exp-color-text-secondary); white-space: nowrap; }
.exp-filter-segment > .exp-btn[aria-pressed="true"] { background: var(--exp-color-surface); color: var(--exp-color-ink); box-shadow: var(--exp-shadow-soft); }
.exp-filter-segment > .exp-btn:focus-visible { outline: 2px solid var(--exp-color-brand-blue); outline-offset: 1px; }
.exp-filter-control .select2-container { min-width: 0; max-width: 100%; }
.exp-filter-control .select2-container .select2-selection--single {
    height: var(--exp-filter-control-height) !important; min-height: var(--exp-filter-control-height) !important;
    padding: 0 !important; border: 1px solid var(--exp-color-border) !important;
    border-radius: var(--exp-radius-md); background: var(--exp-color-surface) !important;
}
.exp-filter-control .select2-selection--single .select2-selection__rendered {
    width: 100%; padding: 0 28px 0 10px; line-height: calc(var(--exp-filter-control-height) - 2px);
    color: var(--exp-color-ink); font-size: var(--exp-filter-font-size);
}
.exp-filter-control--search .select2-selection--single .select2-selection__rendered { padding-left: 34px; }
.exp-filter-control .select2-selection--single:has(.select2-selection__clear) .select2-selection__rendered { padding-right: 52px; }
.exp-filter-control .select2-selection__placeholder { color: var(--exp-color-text-muted) !important; }
.exp-filter-control .select2-container .select2-selection--single .select2-selection__arrow {
    position: absolute; top: 0; right: 10px; height: var(--exp-filter-control-height); width: 12px; display: flex; align-items: center; pointer-events: none;
}
.exp-filter-control .select2-container .select2-selection--single .select2-selection__arrow b {
    position: static; width: 6px; height: 6px; margin: -3px 0 0; border: solid var(--exp-color-text-muted); border-width: 0 1.5px 1.5px 0; transform: rotate(45deg);
}
.exp-filter-control .select2-container .select2-selection--single .select2-selection__clear {
    position: absolute; top: 0; right: 24px; width: 28px; height: calc(var(--exp-filter-control-height) - 2px);
    margin: 0; padding: 0; transform: none; mask: none; -webkit-mask: none;
    background: transparent !important; color: var(--exp-color-text-muted); font-size: 18px;
}
.exp-filter-control .select2-container .select2-selection--single .select2-selection__clear span { display: inline; }

.exp-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--exp-button-gap);
    padding: var(--exp-button-padding-y) var(--exp-button-padding-x);
    border: 1px solid transparent;
    border-radius: var(--exp-button-radius);
    font: inherit;
    line-height: 1.5;
    cursor: pointer;
    transition: opacity var(--exp-transition-base),
                background-color var(--exp-transition-base),
                border-color var(--exp-transition-base);
}

.exp-btn:disabled,
.exp-btn.exp-btn-loading {
    cursor: not-allowed;
    opacity: 0.7;
    pointer-events: none;
}

.exp-btn-primary {
    background-color: var(--exp-button-bg-primary);
    color: var(--exp-button-text-primary);
}

.exp-btn-primary:hover {
    opacity: var(--exp-button-hover-opacity);
}

.exp-btn-green {
    background-color: var(--exp-button-bg-green);
    color: var(--exp-button-text-green);
}

.exp-btn-green:hover {
    background-color: var(--exp-button-bg-green-hover);
}

/* Densidade do header, compartilhada por links e botoes nativos. */
.exp-btn.exp-btn-header {
    font-size: var(--exp-shell-header-action-font-size);
    font-weight: var(--exp-shell-header-action-font-weight);
    text-decoration: none;
    white-space: nowrap;
    --exp-button-padding-x: var(--exp-button-padding-y);
}

.exp-btn.exp-btn-header.exp-btn-primary {
    color: var(--exp-button-text-primary);
}

.exp-btn.exp-btn-header.exp-btn-green {
    color: var(--exp-button-text-green);
}

/* Acao secundaria do header: separa-se da superficie sem competir com Novo. */
.exp-btn.exp-btn-header.exp-btn-secondary {
    background-color: var(--exp-color-surface-subtle);
    border-color: var(--exp-color-border);
}

.exp-btn.exp-btn-header.exp-btn-secondary:hover {
    background-color: var(--exp-color-surface-muted);
}

.exp-btn-header > i {
    color: inherit;
}

.exp-btn-header:focus-visible {
    outline: 2px solid var(--exp-color-brand-blue);
    outline-offset: 2px;
}

/* Acionador do perfil: reaproveita o gap da base e preserva o menu legado. */
.exp-btn.exp-profile-trigger {
    --exp-button-padding-x: var(--exp-shell-profile-padding-x);
    --exp-button-padding-y: var(--exp-shell-profile-padding-y);
    min-width: 0;
    background: transparent;
    color: var(--exp-shell-profile-text);
    font-size: var(--exp-shell-header-action-font-size);
    font-weight: var(--exp-shell-header-action-font-weight);
}

.exp-btn.exp-profile-trigger:hover {
    background: var(--exp-shell-profile-hover-bg);
}

.exp-profile-trigger:focus-visible {
    outline: 2px solid var(--exp-color-brand-blue);
    outline-offset: 2px;
}

.exp-profile-name {
    min-width: 0;
    max-width: var(--exp-shell-profile-name-max-width);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.exp-profile-trigger > i {
    flex-shrink: 0;
    font-size: 0.75em;
    color: inherit;
}

/* Indicador do timesheet; o estado e controlado pelo fluxo existente. */
.exp-btn-header .exp-header-focus-icon {
    display: inline-flex;
    color: inherit;
}

.exp-btn-header .exp-header-focus-icon.is-active {
    color: var(--exp-color-success);
}

.exp-header-focus-icon > i {
    color: inherit;
}

.exp-btn-header .exp-header-focus-chevron {
    font-size: 0.75em;
    color: var(--exp-color-text-muted);
}

@media (min-width: 640px) {
    .exp-btn.exp-btn-header {
        --exp-button-padding-x: var(--exp-shell-header-action-padding-x);
    }
}

.exp-btn-secondary {
    background-color: var(--exp-button-bg-secondary);
    border-color: var(--exp-button-border-secondary);
    color: var(--exp-button-text-secondary);
}

.exp-btn-secondary:hover {
    background-color: var(--exp-button-bg-secondary-hover);
}

.exp-btn-loading {
    position: relative;
}

/* Acao destrutiva de alta enfase (excluir definitivamente, confirmar remocao) */
.exp-btn-danger {
    background-color: var(--exp-button-bg-danger);
    color: var(--exp-button-text-danger);
}

.exp-btn-danger:hover {
    background-color: var(--exp-button-bg-danger-hover);
}

/* Acao destrutiva de baixa enfase (descartar em lista/rodape, sem competir com o CTA) */
.exp-btn-danger-ghost {
    background-color: transparent;
    color: var(--exp-color-text-secondary);
}

.exp-btn-danger-ghost:hover {
    background-color: var(--exp-button-ghost-danger-bg-hover);
    color: var(--exp-button-ghost-danger-text);
}

/* Botao somente com icone; o nome acessivel deve estar no HTML. */
.exp-icon-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    box-sizing: border-box;
    width: var(--exp-icon-button-size);
    height: var(--exp-icon-button-size);
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--exp-icon-button-color);
    font: inherit;
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--exp-transition-base), color var(--exp-transition-base);
}

.exp-icon-btn > i {
    font-size: var(--exp-icon-button-icon-size);
    color: inherit;
    line-height: 1;
}

.exp-icon-btn:hover {
    background: var(--exp-icon-button-hover-bg);
    color: var(--exp-icon-button-hover-color);
}

.exp-icon-btn:focus-visible {
    outline: 2px solid var(--exp-color-brand-blue);
    outline-offset: 2px;
}

.exp-icon-btn:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}

.exp-notification-badge {
    position: absolute;
    top: 0;
    right: -2px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-width: var(--exp-notification-badge-size);
    height: var(--exp-notification-badge-size);
    padding: 0 4px;
    border-radius: 9999px;
    background: var(--exp-notification-badge-bg);
    color: var(--exp-notification-badge-text);
    box-shadow: 0 0 0 1px var(--exp-notification-badge-ring);
    font-size: var(--exp-notification-badge-font-size);
    font-weight: 600;
    line-height: 1;
    pointer-events: none;
}

/* O fluxo legado alterna a classe hidden ao atualizar a contagem. */
.exp-notification-badge.hidden {
    display: none;
}

/* Dropdown: links e botoes em Light DOM, sem interferir nos handlers AJAX. */
exp-dropdown {
    position: relative;
    display: inline-flex;
    flex: 0 0 auto;
}

.exp-btn .exp-dropdown-chevron {
    font-size: 0.75em;
    color: inherit;
}

exp-dropdown > .exp-dropdown-panel {
    position: absolute;
    top: calc(100% + 0.5rem);
    right: 0;
    transform: translateX(var(--exp-dropdown-offset-x, 0px));
    z-index: var(--exp-dropdown-z-index);
    width: var(--exp-dropdown-width);
    max-width: calc(100vw - 1rem);
    max-height: 60vh;
    overflow-y: auto;
    padding: 0.375rem;
    background: var(--exp-dropdown-bg);
    border: 1px solid var(--exp-dropdown-border);
    border-radius: var(--exp-dropdown-radius);
    box-shadow: var(--exp-dropdown-shadow);
}

exp-dropdown > .exp-dropdown-panel[hidden] {
    display: none !important;
}

/* Compatibilidade com menus legados fechados por jQuery via .hidden. */
exp-dropdown > .exp-dropdown-panel.hidden {
    display: none !important;
}

.exp-dropdown-panel .exp-dropdown-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    padding: var(--exp-dropdown-item-padding-y) var(--exp-dropdown-item-padding-x);
    border: 0;
    border-radius: var(--exp-radius-sm);
    background: transparent;
    color: var(--exp-dropdown-text);
    font: inherit;
    font-size: var(--exp-dropdown-font-size);
    line-height: 1.5;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}

.exp-dropdown-panel .exp-dropdown-item:hover,
.exp-dropdown-panel .exp-dropdown-item:focus-visible {
    background: var(--exp-dropdown-hover-bg);
    color: var(--exp-dropdown-text);
}

.exp-dropdown-item:focus-visible {
    outline: 2px solid var(--exp-color-brand-blue);
    outline-offset: -2px;
}

.exp-dropdown-item > i {
    flex: 0 0 1rem;
    text-align: center;
    color: var(--exp-dropdown-icon);
}

.exp-dropdown-item--primary > i {
    color: var(--exp-button-bg-primary);
}

.exp-dropdown-panel .exp-dropdown-item--danger > i {
    color: var(--exp-dropdown-danger-text);
}

.exp-dropdown-panel .exp-dropdown-item--danger {
    color: var(--exp-dropdown-danger-text);
}

.exp-dropdown-panel .exp-dropdown-item--danger:hover,
.exp-dropdown-panel .exp-dropdown-item--danger:focus-visible {
    background: var(--exp-dropdown-danger-hover-bg);
    color: var(--exp-dropdown-danger-text);
}

.exp-dropdown-panel .exp-dropdown-divider {
    height: 1px;
    margin: 0.375rem 0;
    background: var(--exp-dropdown-border);
}

.exp-dropdown-item:disabled,
.exp-dropdown-item[aria-disabled="true"] {
    opacity: 0.7;
    cursor: not-allowed;
}

/* Avatar individual */
exp-avatar {
    --exp-avatar-size: var(--exp-avatar-size-md);
    --exp-avatar-font-size: 0.75rem;
    display: inline-flex;
    width: var(--exp-avatar-size);
    height: var(--exp-avatar-size);
    flex: 0 0 var(--exp-avatar-size);
    vertical-align: middle;
}

exp-avatar[data-size="xs"] {
    --exp-avatar-size: var(--exp-avatar-size-xs);
    --exp-avatar-font-size: 0.625rem;
}

exp-avatar[data-size="sm"] {
    --exp-avatar-size: var(--exp-avatar-size-sm);
    --exp-avatar-font-size: 0.6875rem;
}

exp-avatar[data-size="lg"] {
    --exp-avatar-size: var(--exp-avatar-size-lg);
    --exp-avatar-font-size: 1rem;
}

exp-avatar[data-size="xl"] {
    --exp-avatar-size: var(--exp-avatar-size-xl);
    --exp-avatar-font-size: 1.5rem;
}

exp-avatar[data-shape="rounded"] .exp-avatar-content {
    border-radius: var(--exp-radius-lg);
}

.exp-avatar-content {
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 9999px;
    background: var(--exp-avatar-bg, var(--exp-color-primary-600));
    color: var(--exp-avatar-text);
    font-size: var(--exp-avatar-font-size);
    font-weight: 700;
    line-height: 1;
    user-select: none;
}

.exp-avatar-content img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

exp-avatar[data-state="unassigned"] .exp-avatar-content {
    background: var(--exp-avatar-bg-unassigned);
    border: 1.5px dashed var(--exp-avatar-border-color, #d9b564);
    color: var(--exp-avatar-text-color, #c98a12);
}

exp-avatar[data-tone="danger"] .exp-avatar-content {
    --exp-avatar-bg-unassigned: var(--exp-color-danger-subtle);
    --exp-avatar-border-color: var(--exp-color-danger);
    --exp-avatar-text-color: #c2362f;
}

/* Grupo de avatares */
exp-avatar-group {
    display: inline-flex;
    align-items: center;
    padding-left: 0.5rem;
}

exp-avatar-group > exp-avatar {
    position: relative;
    margin-left: var(--exp-avatar-group-gap);
    border: 2px solid var(--exp-avatar-border);
    border-radius: 9999px;
}

exp-avatar-group > exp-avatar:first-child {
    margin-left: 0;
}

.exp-avatar-group-more {
    display: inline-flex;
    width: var(--exp-avatar-size, var(--exp-avatar-size-md));
    height: var(--exp-avatar-size, var(--exp-avatar-size-md));
    align-items: center;
    justify-content: center;
    margin-left: var(--exp-avatar-group-gap);
    border: 2px solid var(--exp-avatar-border);
    border-radius: 9999px;
    background: var(--exp-color-surface-muted);
    color: var(--exp-color-text-secondary);
    font-size: 0.6875rem;
    font-weight: 700;
}

/* Modal de filtros independente */
exp-modal-filtros {
    position: fixed;
    inset: 0;
    z-index: var(--exp-filtros-z-index);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: var(--exp-filtros-overlay);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

exp-modal-filtros[hidden] {
    display: none !important;
}

exp-modal-filtros:not([data-inicializado]) {
    display: none;
}

body.exp-modal-filtros-aberto {
    overflow: hidden;
}

.exp-modal-filtros__dialogo {
    display: flex;
    width: 100%;
    max-width: var(--exp-filtros-largura);
    max-height: calc(100vh - 2rem);
    flex-direction: column;
    overflow: hidden;
    border-radius: var(--exp-filtros-raio);
    background: var(--exp-color-surface);
    box-shadow: var(--exp-filtros-sombra);
}

.exp-modal-filtros__cabecalho,
.exp-modal-filtros__rodape {
    display: flex;
    align-items: center;
    padding: var(--exp-filtros-padding-y) var(--exp-filtros-padding-x);
}

.exp-modal-filtros__cabecalho {
    justify-content: space-between;
    border-bottom: 1px solid var(--exp-color-border);
}

.exp-modal-filtros__titulo {
    margin: 0;
    color: var(--exp-color-text-primary);
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.75rem;
}

.exp-modal-filtros__fechar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    border: 0;
    border-radius: var(--exp-radius-md);
    background: transparent;
    color: var(--exp-color-text-secondary);
    cursor: pointer;
}

.exp-modal-filtros__fechar:hover {
    background: #f3f4f6;
}

.exp-modal-filtros__corpo {
    min-height: 0;
    padding: var(--exp-filtros-padding-y) var(--exp-filtros-padding-x);
    overflow-y: auto;
}

.exp-modal-filtros__rodape {
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.75rem;
    border-top: 1px solid var(--exp-color-border);
}

.exp-modal-filtros__persistencia {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin-right: auto;
    color: var(--exp-color-text-muted);
    font-size: 0.875rem;
    cursor: pointer;
}

.exp-modal-filtros__persistencia input {
    width: 1rem;
    height: 1rem;
    accent-color: var(--exp-button-bg-primary);
}

.exp-filtros-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--exp-filtros-gap);
}

@media (min-width: 768px) {
    .exp-filtros-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .exp-filtros-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .exp-modal-filtros__rodape {
        align-items: stretch;
    }

    .exp-modal-filtros__persistencia {
        width: 100%;
        margin-bottom: 0.25rem;
    }

    .exp-modal-filtros__rodape .exp-btn {
        flex: 1 1 0;
    }
}

/* Feedback assíncrono global -------------------------------------------------
 * A percepção de andamento é específica ao contexto: navegação recebe uma
 * barra discreta após pequeno atraso; ações bloqueiam apenas o próprio
 * controle. Nunca reutilizar `body.loaded` para esse estado.
 */
.exp-feedback-navigation-progress {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1100;
    height: 3px;
    overflow: hidden;
    pointer-events: none;
    opacity: 0;
    transition: opacity 140ms ease;
}

.exp-feedback-navigation-progress__bar {
    display: block;
    width: 34%;
    height: 100%;
    border-radius: 0 999px 999px 0;
    background: var(--exp-button-bg-primary);
    box-shadow: 0 0 14px color-mix(in srgb, var(--exp-button-bg-primary) 48%, transparent);
    transform: translateX(-120%);
}

body.exp-feedback-navigation-visible .exp-feedback-navigation-progress {
    opacity: 1;
}

body.exp-feedback-navigation-visible .exp-feedback-navigation-progress__bar {
    animation: exp-feedback-progress 1.15s ease-in-out infinite;
}

@keyframes exp-feedback-progress {
    0% { transform: translateX(-120%); }
    100% { transform: translateX(360%); }
}

.exp-feedback-blocking {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: grid;
    place-items: center;
    background: color-mix(in srgb, var(--exp-color-surface-muted) 62%, transparent);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}

.exp-feedback-blocking[hidden] {
    display: none;
}

.exp-feedback-spinner {
    width: 2.25rem;
    height: 2.25rem;
    border: 3px solid color-mix(in srgb, var(--exp-button-bg-primary) 18%, transparent);
    border-top-color: var(--exp-button-bg-primary);
    border-radius: 999px;
    animation: exp-feedback-spin 700ms linear infinite;
}

@keyframes exp-feedback-spin {
    to { transform: rotate(360deg); }
}

.exp-feedback-action-pending {
    position: relative;
    pointer-events: none;
    cursor: wait !important;
    opacity: 0.68;
}

.exp-feedback-action-pending::after {
    content: '';
    display: inline-block;
    width: 0.75rem;
    height: 0.75rem;
    margin-left: 0.4rem;
    vertical-align: -0.08rem;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 999px;
    animation: exp-feedback-spin 700ms linear infinite;
}

@media (prefers-reduced-motion: reduce) {
    .exp-feedback-navigation-progress__bar,
    .exp-feedback-spinner,
    .exp-feedback-action-pending::after {
        animation-duration: 1.8s;
    }
}

/* =====================================================================
   Tema escuro: ajustes sobre FUNDOS de marca.
   No dark --exp-color-brand-navy vira azul solido (noturno-700), entao botoes
   primarios e tabs ativas ja ganham cor sozinhos. Aqui garantimos apenas:
   (1) texto branco sobre esses fundos (o DS usava color:surface, agora escuro);
   (2) botoes primarios de modal solidos; (3) scrims mais opacos.
   ===================================================================== */

/* botoes primarios de modal (fundo azul-claro da marca) ficam solidos + texto branco */
html.dark :is(.exp-modal, .exp-bootstrap-modal, .tailwind-modal.exp-modal) {
    --exp-button-bg-primary: var(--exp-color-brand-navy);
    --exp-button-text-primary: #fff;
}

/* Texto branco sobre os fundos de marca (tabs ativas, paginacao, KPIs, toast, apply).
   Esses trechos usam background:brand-navy + color:surface; no escuro surface ficou
   escuro, entao forcamos branco para manter o contraste do estado ativo. */
html.dark :is(
    .exp-grid nav button[aria-current="page"],
    .exp-grid-filters [data-action="apply"].exp-btn,
    .exp-agenda-page #kt_calendar_app .fc-button-active,
    .ci-page .op-filter[aria-pressed="true"],
    .reminder-tabs [aria-selected="true"],
    .reminder-status-filters .filter-tab[aria-pressed="true"],
    #documentosPage .documents-pagination nav > button[data-page],
    #pessoasPage .buttonsGraph.active,
    .atualizacao-navigation .exp-btn[aria-current="page"],
    .processos-page .processos-chart .filter-btn.active,
    .dashboard-processos .dp-kpi.dp-total,
    .crm-toast
) {
    color: #fff;
}

/* scrims de overlay (filtro do grid e modal tailwind) — mais opacos no escuro */
html.dark .exp-grid-filters,
html.dark .tailwind-modal.exp-modal {
    background: rgba(2, 7, 20, 0.64);
}

/* Standalone presentation: shared tokens/buttons, page-specific composition only. */
.nv-page{--exp-button-bg-primary:var(--exp-color-brand-navy);--exp-button-radius:var(--exp-radius-md);margin:0;background:var(--exp-color-surface);color:var(--exp-color-brand-navy);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
.nv-page *{box-sizing:border-box}.nv-page [hidden]{display:none!important}:where(.nv-page) a{color:inherit}.nv-page img{display:block;max-width:100%;height:auto}.nv-page button,.nv-page input{font:inherit}.nv-page :focus-visible{outline:3px solid var(--exp-color-primary-700);outline-offset:5px}.nv-page h1,.nv-page h2,.nv-page h3,.nv-page p{margin:0}.nv-page h2{font-size:clamp(30px,3.5vw,44px);line-height:1.18;letter-spacing:-1.7px;font-weight:650}.nv-page p{line-height:1.7}.nv-page .exp-btn{min-height:46px;padding:12px 20px;font-size:14px;font-weight:600;gap:16px;text-decoration:none;white-space:normal;text-align:center}.nv-page .exp-btn span{font-size:19px}.nv-container{width:min(1200px,calc(100% - 80px));margin-inline:auto}.nv-page section[id],.nv-module{scroll-margin-top:110px}.nv-skip{position:fixed;left:16px;top:-80px;z-index:60;background:var(--exp-color-surface);padding:14px;border:1px solid var(--exp-color-border);border-radius:var(--exp-radius-md)}.nv-skip:focus{top:10px}
.nv-header{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--exp-color-surface) 96%,transparent);border-bottom:1px solid var(--exp-color-border);backdrop-filter:blur(12px)}.nv-header-inner{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:28px}.nv-logo{display:block;flex-shrink:0}.nv-logo img{width:176px}.nv-header nav{display:flex;gap:32px}.nv-header nav a,.nv-footer a{font-size:13px;text-decoration:none}.nv-header nav a{color:var(--exp-color-text-secondary);padding-block:12px}.nv-header nav a:hover,.nv-footer a:hover{text-decoration:underline;text-underline-offset:5px}.nv-header .nv-access{font-size:12px;min-height:40px;padding:8px 15px}
.nv-hero{padding:70px 0 35px;background:radial-gradient(ellipse at 90% 25%,var(--exp-color-primary-100),transparent 55%),linear-gradient(var(--exp-color-surface),var(--exp-color-primary-50))}.nv-eyebrow{font-size:11px;font-weight:750;letter-spacing:1.6px;color:var(--exp-color-primary-700);line-height:1.6!important}.nv-mark{display:inline-block;width:8px;height:8px;margin-right:8px;background:var(--exp-color-brand-blue);border-radius:50%}.nv-hero-heading{display:grid;grid-template-columns:1.25fr 1fr;gap:70px;align-items:center;margin:24px 0 48px}.nv-hero h1{font-size:clamp(42px,5.1vw,68px);line-height:1.08;font-weight:650;letter-spacing:-3.5px}.nv-hero h1 span{color:var(--exp-color-primary-700)}.nv-hero-copy>p:first-child{font-size:19px;line-height:1.6;color:var(--exp-color-text-secondary);max-width:390px}.nv-hero-copy .nv-hero-reassurance{margin-top:12px;font-size:14px;font-weight:600;max-width:370px}.nv-hero-copy .exp-btn{margin-top:24px}.nv-hero-screen{max-width:1080px;margin-inline:auto;border:1px solid var(--exp-color-border-strong);border-radius:var(--exp-radius-xl);background:var(--exp-color-surface);padding:0 7px 7px;box-shadow:0 24px 64px -28px color-mix(in srgb,var(--exp-color-brand-navy) 30%,transparent)}.nv-window-bar{height:44px;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:0 16px;color:var(--exp-color-text-muted);font-size:11px}.nv-window-dots{display:flex;gap:5px}.nv-window-dots i{width:6px;height:6px;border-radius:50%;background:var(--exp-color-border-strong)}.nv-window-brand{font-size:15px;letter-spacing:-.6px;font-weight:750;color:var(--exp-color-brand-navy)}.nv-window-brand>span{color:var(--exp-color-brand-blue)}.nv-image-link{position:relative;display:block;border-radius:var(--exp-radius-lg);text-decoration:none;isolation:isolate}.nv-image-link img{width:100%;border-radius:inherit}.nv-enlarge{position:absolute;bottom:16px;right:16px;display:flex;align-items:center;gap:12px;font-size:12px;font-weight:600;padding:10px 15px;background:var(--exp-color-surface);color:var(--exp-color-brand-navy);border:1px solid var(--exp-color-border-strong);border-radius:var(--exp-radius-md);box-shadow:var(--exp-shadow-soft);transition:transform var(--exp-transition-base)}.nv-image-link:hover .nv-enlarge{transform:translateY(-3px)}.nv-demo-note{margin-top:18px!important;text-align:center;color:var(--exp-color-text-muted);font-size:11px}
.nv-changes{padding-block:100px}.nv-section-heading{max-width:720px}.nv-section-heading h2{margin-top:16px}.nv-section-heading>p:last-child{margin-top:20px;color:var(--exp-color-text-secondary);font-size:16px}.nv-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:45px;margin-top:44px}.nv-benefits article{border-top:1px solid var(--exp-color-border-strong);padding-top:25px}.nv-number{font-size:13px;letter-spacing:1px;color:var(--exp-color-primary-700);font-weight:700}.nv-benefits h3{font-size:18px;letter-spacing:-.4px;margin-top:20px;font-weight:650}.nv-benefits p{font-size:14px;color:var(--exp-color-text-secondary);margin-top:12px}.nv-continuity{background:var(--exp-color-brand-navy);color:var(--exp-color-surface);padding:48px 0}.nv-continuity-inner{display:flex;gap:36px;align-items:center}.nv-continuity-symbol{font-size:64px;font-weight:300;width:88px;height:88px;display:grid;place-items:center;flex:none;line-height:1;border:1px solid color-mix(in srgb,var(--exp-color-primary-200) 30%,transparent);border-radius:var(--exp-radius-xl);color:var(--exp-color-primary-300)}.nv-continuity .nv-eyebrow{color:var(--exp-color-primary-300)}.nv-continuity h2{font-size:30px;letter-spacing:-.8px;margin-top:8px}.nv-continuity p:last-child{margin-top:10px;font-size:14px;color:var(--exp-color-primary-100)}
.nv-gallery{padding-block:100px 80px}.nv-module-nav{display:flex;gap:8px;margin-top:32px;flex-wrap:wrap}.nv-module-nav a{display:block;padding:13px 22px;font-size:13px;font-weight:650;border:1px solid var(--exp-color-border-strong);border-radius:var(--exp-radius-md);text-decoration:none;transition:background var(--exp-transition-base)}.nv-module-nav a:hover{background:var(--exp-color-primary-50)}.nv-module-nav a[aria-current=true]{color:var(--exp-color-surface);background:var(--exp-color-brand-navy);border-color:var(--exp-color-brand-navy)}.nv-module{display:grid;grid-template-columns:300px minmax(0,1fr);gap:44px;align-items:center;margin-top:48px}.nv-module+.nv-module{padding-top:48px;border-top:1px solid var(--exp-color-border)}.nv-gallery.is-enhanced .nv-module{padding-top:0;border-top:0}.nv-module h3{font-size:30px;font-weight:650;line-height:1.22;letter-spacing:-1px;margin-top:16px}.nv-module-copy>p:not(.nv-eyebrow){color:var(--exp-color-text-secondary);font-size:14px;margin-top:18px}.nv-module ul{list-style:none;margin:22px 0;padding:0}.nv-module li{position:relative;padding-left:20px;font-size:13px;line-height:1.65;color:var(--exp-color-text-secondary);margin-top:12px}.nv-module li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;border-radius:50%;background:var(--exp-color-brand-blue)}.nv-module-copy p.nv-module-footnote{font-size:12px;border-top:1px solid var(--exp-color-border);padding-top:18px}.nv-module figure{margin:0;min-width:0;background:var(--exp-color-primary-50);padding:16px;border:1px solid var(--exp-color-primary-100);border-radius:var(--exp-radius-xl)}.nv-module figure img{border:1px solid var(--exp-color-border)}.nv-module figcaption{margin-top:12px;font-size:10px;text-align:center;color:var(--exp-color-text-secondary)}.nv-module .nv-enlarge{bottom:12px;right:12px;font-size:11px;padding:8px 12px}.nv-gallery-note{margin-top:32px!important;color:var(--exp-color-text-muted);font-size:12px;max-width:800px}
.nv-help{background:var(--exp-color-primary-50);border-block:1px solid var(--exp-color-primary-100);padding:58px 0}.nv-help-inner{display:grid;grid-template-columns:1.2fr 1fr;gap:100px;align-items:center}.nv-help h2{margin-top:14px}.nv-help p:last-child{margin-top:18px;font-size:15px;color:var(--exp-color-text-secondary);max-width:520px}.nv-help-actions{display:flex;align-items:flex-start;flex-direction:column;gap:20px}.nv-text-link{font-size:13px;font-weight:650;text-underline-offset:5px;line-height:1.8}.nv-small{font-size:11px;line-height:1.5;color:var(--exp-color-text-muted)}.nv-faq{display:grid;grid-template-columns:1fr 1.6fr;gap:90px;padding-block:100px}.nv-faq h2{margin-top:16px}.nv-questions{border-top:1px solid var(--exp-color-border-strong)}.nv-questions details{border-bottom:1px solid var(--exp-color-border-strong);padding:0 0 0 2px}.nv-questions summary{position:relative;cursor:pointer;font-size:15px;font-weight:650;line-height:1.6;padding:22px 32px 22px 0;list-style:none}.nv-questions summary::-webkit-details-marker{display:none}.nv-questions summary::after{content:"+";position:absolute;right:4px;top:19px;color:var(--exp-color-primary-700);font-size:24px;font-weight:400}.nv-questions details[open] summary::after{content:"−"}.nv-questions p{font-size:14px;color:var(--exp-color-text-secondary);padding:0 26px 24px 0}.nv-questions p a{color:var(--exp-color-primary-700);text-underline-offset:3px}.nv-closing{text-align:center;border-top:1px solid var(--exp-color-border);padding-block:66px 70px}.nv-closing h2{margin-top:16px}.nv-closing-actions{display:flex;justify-content:center;gap:12px;margin-top:30px;flex-wrap:wrap}.nv-share-status{font-size:13px;color:var(--exp-color-primary-700);min-height:23px;margin-top:14px!important}.nv-share-fallback{max-width:600px;margin:12px auto 0;text-align:left}.nv-share-fallback label{font-size:13px}.nv-share-fallback input{width:100%;padding:12px;margin-top:8px;border:1px solid var(--exp-color-border-strong);border-radius:var(--exp-radius-md);color:var(--exp-color-text-secondary);background:var(--exp-color-surface)}.nv-footer{border-top:1px solid var(--exp-color-border);padding:28px 0;background:var(--exp-color-surface-subtle)}.nv-footer>.nv-container{display:flex;align-items:center;justify-content:space-between;gap:24px}.nv-footer .nv-logo img{width:146px}.nv-footer span{font-size:12px;color:var(--exp-color-text-muted)}
.nv-dialog{max-width:min(1480px,calc(100vw - 40px));width:100%;max-height:calc(100dvh - 40px);padding:0;border:1px solid var(--exp-color-border);border-radius:var(--exp-radius-xl);color:var(--exp-color-brand-navy);background:var(--exp-color-surface);box-shadow:var(--exp-shadow-soft)}.nv-dialog::backdrop{background:color-mix(in srgb,var(--exp-color-brand-navy) 75%,transparent);backdrop-filter:blur(5px)}.nv-dialog-header{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 22px;background:var(--exp-color-surface);border-bottom:1px solid var(--exp-color-border);z-index:1}.nv-dialog .nv-dialog-header h2{font-size:18px;letter-spacing:-.3px}.nv-dialog-image{background:var(--exp-color-surface-subtle)}.nv-dialog-image img{width:100%;height:auto}.nv-dialog>p{font-size:12px;color:var(--exp-color-text-secondary);padding:16px 22px}.nv-page:has(.nv-dialog[open]){overflow:hidden}
/* Product information belongs to this public presentation, without changing app components. */
.nv-film{padding:24px;background:var(--exp-color-surface);border:1px solid var(--exp-color-border);border-radius:var(--exp-radius-xl);box-shadow:var(--exp-shadow-soft)}
.nv-film-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px}
.nv-film-heading h2{font-size:22px;letter-spacing:-.6px}.nv-film-heading>span{font-size:12px;color:var(--exp-color-text-secondary)}
.nv-film-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:24px;align-items:start}.nv-film-player{min-width:0}
.nv-film video{display:block;width:100%;aspect-ratio:16/9;background:var(--exp-color-brand-navy);border-radius:var(--exp-radius-lg)}
.nv-film-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:16px;font-size:12px;color:var(--exp-color-text-secondary)}
.nv-film-footer .nv-text-link{font-size:12px;flex-shrink:0}
.nv-film-chapters{border-left:1px solid var(--exp-color-border);padding-left:20px;min-width:0}.nv-film-chapters h3{font-size:15px;font-weight:650}.nv-film-chapters>p{font-size:11px;color:var(--exp-color-text-secondary);margin-top:8px}
.nv-film-chapters ol{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:4px}
.nv-film-chapters button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:42px;padding:9px 10px;text-align:left;font-size:12px;line-height:1.4;border:1px solid transparent;border-radius:var(--exp-radius-md);background:transparent;color:var(--exp-color-text-secondary);cursor:pointer}
.nv-film-chapters button:hover{background:var(--exp-color-primary-50)}.nv-film-chapters button[aria-current=true]{background:var(--exp-color-primary-50);border-color:var(--exp-color-primary-200);color:var(--exp-color-brand-navy);font-weight:650}.nv-film-chapters time{font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap}
.nv-film-transcript{border-top:1px solid var(--exp-color-border);margin-top:22px;padding-top:16px;font-size:12px}.nv-film-transcript summary{cursor:pointer;font-weight:600;line-height:1.7}.nv-film-transcript h3{font-size:15px;margin:20px 0 8px}.nv-film-transcript p{font-size:14px;max-width:850px;color:var(--exp-color-text-secondary)}.nv-film-error{font-size:13px;color:var(--exp-color-danger);margin-top:16px!important}
@media(max-width:1100px){.nv-film-layout{grid-template-columns:1fr}.nv-film-chapters{border-left:0;border-top:1px solid var(--exp-color-border);padding:18px 0 0}.nv-film-chapters ol{grid-template-columns:repeat(3,minmax(0,1fr))}.nv-film-chapters button{height:100%}}
@media(max-width:760px){.nv-film{padding:16px}.nv-film-heading{align-items:flex-start;flex-direction:column;gap:8px}.nv-film-heading h2{font-size:20px}.nv-film-chapters ol{grid-template-columns:repeat(2,minmax(0,1fr))}.nv-film-chapters button{padding:8px;font-size:11px;gap:6px;min-height:44px}.nv-film-footer{align-items:flex-start;flex-direction:column;gap:8px}.nv-page .nv-header nav{gap:8px 12px}}
@media(max-width:380px){.nv-page .nv-header nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));text-align:center}}
.nv-module-copy>.nv-text-link{display:inline-block;margin-top:18px}
.nv-header nav{flex-wrap:wrap;justify-content:center;min-width:0}
.nv-resources{padding:76px 0 80px;border-top:1px solid var(--exp-color-border);background:var(--exp-color-surface-subtle)}
.nv-resource-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:38px}
.nv-resource-card{display:flex;flex-direction:column;min-width:0;padding:30px 26px;background:var(--exp-color-surface);border:1px solid var(--exp-color-border);border-radius:var(--exp-radius-xl)}
.nv-resource-label{font-size:10px;font-weight:750;letter-spacing:1.2px;color:var(--exp-color-primary-700)}
.nv-resource-card h3{font-size:24px;line-height:1.25;letter-spacing:-.8px;font-weight:650;margin-top:16px}
.nv-resource-card h3 span{display:block;font-size:11px;font-weight:500;letter-spacing:.4px;margin-top:6px;color:var(--exp-color-primary-200)}
.nv-resource-card .nv-resource-promise{font-size:20px;font-weight:600;line-height:1.4;letter-spacing:-.4px;margin-top:24px}
.nv-resource-description{margin-top:16px!important;font-size:14px;color:var(--exp-color-text-secondary)}
.nv-resource-card ul{padding:22px 0 24px;margin:0;list-style:none}
.nv-resource-card li{position:relative;padding-left:18px;font-size:13px;line-height:1.7;color:var(--exp-color-text-secondary)}
.nv-resource-card li+li{margin-top:12px}
.nv-resource-card li::before{content:"";position:absolute;left:0;top:8px;width:5px;height:5px;border-radius:50%;background:var(--exp-color-brand-blue)}
.nv-resource-note{margin-top:auto!important;padding-top:20px;border-top:1px solid var(--exp-color-border);color:var(--exp-color-text-secondary);font-size:12px}
.nv-resource-card .nv-text-link{margin-top:22px;font-size:12px;text-decoration-thickness:1px}
.nv-resource-onepass{background:var(--exp-color-brand-navy);border-color:var(--exp-color-brand-navy);color:var(--exp-color-surface)}
.nv-resource-onepass .nv-resource-label{color:var(--exp-color-primary-300)}
.nv-resource-onepass :is(.nv-resource-description,li,.nv-resource-note){color:var(--exp-color-primary-100)}
.nv-resource-onepass .nv-resource-note{border-color:color-mix(in srgb,var(--exp-color-primary-200) 25%,transparent)}
.nv-resource-onepass :focus-visible{outline-color:var(--exp-color-primary-300)}
.nv-resources-availability{max-width:960px;font-size:12px;color:var(--exp-color-text-muted);margin-top:26px!important}
@media(max-width:1100px){.nv-resource-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.nv-resource-onepass{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;column-gap:36px}.nv-resource-onepass :is(.nv-resource-label,h3,.nv-resource-promise,.nv-resource-description){grid-column:1}.nv-resource-onepass ul{grid-column:2;grid-row:1/5;padding-top:0}.nv-resource-onepass .nv-resource-note{grid-column:1/-1;margin-top:22px!important}.nv-resource-onepass .nv-text-link{grid-column:1/-1}}
@media(max-width:760px){.nv-resources{padding-block:52px}.nv-resource-grid{grid-template-columns:1fr;gap:18px;margin-top:28px}.nv-resource-onepass{display:flex}.nv-resource-card{padding:26px 22px}.nv-resource-onepass ul{padding-top:22px}.nv-resource-onepass .nv-resource-note{margin-top:auto!important}.nv-page section[id],.nv-module{scroll-margin-top:164px}}
@media(min-width:1700px){.nv-container{width:min(1300px,calc(100% - 120px))}.nv-hero-heading{gap:110px}.nv-hero-screen{max-width:1160px}}
@media(max-width:1000px){.nv-container{width:calc(100% - 48px)}.nv-header nav{gap:20px}.nv-header nav a{font-size:12px}.nv-logo img{width:146px}.nv-hero-heading{gap:36px}.nv-hero h1{letter-spacing:-2px}.nv-hero-copy>p:first-child{font-size:17px}.nv-module{grid-template-columns:250px minmax(0,1fr);gap:24px}.nv-module h3{font-size:26px}.nv-module figure{padding:10px}.nv-benefits{gap:24px}.nv-help-inner{gap:40px}.nv-faq{gap:40px}.nv-header .nv-access{font-size:11px;padding-inline:10px}}
@media(max-width:760px){.nv-header-inner{min-height:76px;gap:12px;flex-wrap:wrap;padding-block:16px}.nv-header nav{order:3;width:100%;justify-content:center;gap:28px;border-top:1px solid var(--exp-color-border);padding-top:8px}.nv-header nav a{padding-block:4px}.nv-header .nv-access{font-size:11px;gap:8px}.nv-hero{padding-top:38px}.nv-hero-heading{grid-template-columns:1fr;gap:24px;margin:20px 0 32px}.nv-hero h1{font-size:clamp(37px,7.5vw,55px);letter-spacing:-2px}.nv-hero-copy>p:first-child{font-size:17px;max-width:520px}.nv-hero-copy .nv-hero-reassurance{max-width:100%}.nv-hero-copy .exp-btn{margin-top:22px}.nv-window-bar{height:36px;font-size:9px;padding-inline:8px}.nv-hero-screen{padding:0 4px 4px}.nv-window-brand{font-size:12px}.nv-enlarge{padding:8px 11px;bottom:10px;right:10px;font-size:10px}.nv-demo-note{font-size:10px}.nv-changes,.nv-gallery{padding-block:60px}.nv-benefits{grid-template-columns:1fr;gap:28px;margin-top:30px}.nv-benefits article{padding-top:20px}.nv-benefits h3{margin-top:10px}.nv-benefits p{margin-top:8px;max-width:520px}.nv-continuity{padding-block:32px}.nv-continuity-inner{align-items:flex-start;gap:18px}.nv-continuity-symbol{height:48px;width:48px;font-size:36px}.nv-continuity h2{font-size:25px;line-height:1.25}.nv-module{grid-template-columns:1fr;gap:24px;margin-top:30px}.nv-module h3{font-size:30px;max-width:460px}.nv-module-copy{max-width:580px}.nv-module-nav{gap:6px}.nv-module-nav a{padding:11px 13px;font-size:12px}.nv-module ul{margin-block:16px}.nv-module figure{padding:10px}.nv-gallery-note{font-size:11px}.nv-help{padding-block:40px}.nv-help-inner{grid-template-columns:1fr;gap:26px}.nv-faq{grid-template-columns:1fr;gap:28px;padding-block:60px}.nv-faq h2 br{display:none}.nv-questions summary{font-size:14px}.nv-closing{padding-block:45px}.nv-footer>.nv-container{flex-wrap:wrap;gap:22px}.nv-footer span{order:3;width:100%;font-size:11px}.nv-footer a{font-size:11px}.nv-dialog{max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}.nv-dialog-header{padding:12px;gap:12px}.nv-dialog .nv-dialog-header h2{font-size:15px}.nv-dialog .exp-btn{padding:8px 12px;min-height:40px;font-size:12px}.nv-dialog>p{padding:12px;font-size:11px}}
@media(max-width:380px){.nv-container{width:calc(100% - 32px)}.nv-header .nv-logo img{width:120px}.nv-header nav{gap:20px}.nv-header nav a{font-size:11px}.nv-module-nav a{font-size:11px;padding-inline:10px}.nv-window-dots{display:none}.nv-continuity-symbol{display:none}.nv-closing-actions .exp-btn{width:100%}}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
@media(prefers-reduced-motion:reduce){.nv-page *{transition:none!important;scroll-behavior:auto!important}}
@media print{.nv-header{position:static}.nv-header nav,.nv-access,.nv-module-nav,.nv-enlarge,.nv-closing-actions,.nv-share-status{display:none!important}.nv-container{width:100%}.nv-gallery.is-enhanced .nv-module[hidden]{display:grid!important}.nv-module{break-inside:avoid}.nv-hero,.nv-help{background:none}}