/* =============================================================================
   Visual novo (card 978926), ondas 5 a 11 — telas com layout próprio

   Complementa as camadas globais (air-next, air-next-listing, air-next-form)
   com o que cada grupo do menu tem de específico. Uma seção por onda. Age sob
   <html data-ui="next">, que os layouts fixam. As cores de
   identificação ficam (DESIGN.md, The Identity Color Rule).
   ============================================================================= */

/* ── Onda 5 — Dashboards e o casco "projects-list" (page-shell.css) ─────────
   Usado por Project Health Check, Delivery Check, Dashboard de Alocações
   (atual), Detalhamento de Projetos, Customer Success, pendências de Delivery
   Check e solicitações de ciclo de vida. */
html[data-ui="next"] body[data-theme="air"] .projects-list-shell {
    padding: 0;
    border: 0;
    background: transparent;
}

html[data-ui="next"] body[data-theme="air"] .projects-list-heading {
    align-items: center;
}

html[data-ui="next"] body[data-theme="air"] .projects-list-title {
    font-size: var(--air-fs-h1);
    line-height: 1.1;
    letter-spacing: -0.02em;
    color: var(--air-ink-strong);
}

html[data-ui="next"] body[data-theme="air"] .projects-list-subtitle {
    font-size: 13px;
    color: var(--air-ink-muted);
}

html[data-ui="next"] body[data-theme="air"] .projects-filters-panel {
    border: 1px solid var(--air-border-color);
    border-radius: var(--air-radius-lg);
    background: var(--air-surface-alt);
    box-shadow: none;
}

html[data-ui="next"] body[data-theme="air"] .projects-filter-label {
    font-size: var(--air-ui-fs-label);
    letter-spacing: var(--air-ui-ls-label);
    color: var(--air-ink-muted);
}

@media (max-width: 767.98px) {
    html[data-ui="next"] body[data-theme="air"] .projects-list-title {
        font-size: 24px;
    }}

/* ── Onda 6 — Projetos ──────────────────────────────────────────────────────
   /projects, /details-projects, Delivery Check, Aderência de Qualidade e os
   cadastros do grupo. */

/* Códigos em tabela (slug, chave): o rosa do Velzon fica, mais escuro para passar 4,5:1. */
html[data-ui="next"] body[data-theme="air"] td > code {
    color: #c2185b;
}

/* Botões de contorno coloridos (Exportar PDF, Guia de Margens…): mesma cor, tom que passa 4,5:1. */
html[data-ui="next"] body[data-theme="air"] .btn-outline-success {
    border-color: #1e7e5a;
    color: #1e7e5a;
}

html[data-ui="next"] body[data-theme="air"] .btn-outline-info {
    border-color: #1f6fb8;
    color: #1f6fb8;
}

html[data-ui="next"] body[data-theme="air"] .btn-outline-success:hover {
    background: #1e7e5a;
    color: #fff;
}

html[data-ui="next"] body[data-theme="air"] .btn-outline-info:hover {
    background: #1f6fb8;
    color: #fff;
}

html[data-ui="next"][data-bs-theme="dark"] body[data-theme="air"] .btn-outline-success {
    border-color: #7bd494;
    color: #7bd494;
}

html[data-ui="next"][data-bs-theme="dark"] body[data-theme="air"] .btn-outline-info {
    border-color: #8fb6e8;
    color: #8fb6e8;
}

html[data-ui="next"][data-bs-theme="dark"] body[data-theme="air"] td > code {
    color: #f48fb1;
}

/* ── Onda 7 — Clientes & CS ─────────────────────────────────────────────────
   /customer-success, /customer-success/journeys, /customers, /stakeholders. */

/* Rótulos de filtro em caixa normal, como os rótulos de formulário (onda 4):
   em maiúsculas, rótulos longos ("Justificativa de Inelegibilidade") viram
   bloco difícil de ler. */
html[data-ui="next"] body[data-theme="air"] .listing-filter-label,
html[data-ui="next"] body[data-theme="air"] .projects-filter-label {
    font-size: var(--air-ui-fs-small);
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none;
    color: var(--air-ink);
}

/* Jornadas: KPIs e pílulas no piso de 11px; mesmas cores. */
html[data-ui="next"] body[data-theme="air"] .cj-kpi-label,
html[data-ui="next"] body[data-theme="air"] .cj-pill,
html[data-ui="next"] body[data-theme="air"] .cj-mono {
    font-size: var(--air-ui-fs-label);
}

html[data-ui="next"] body[data-theme="air"] .cj-kpi-hint {
    font-size: var(--air-ui-fs-small);
}

/* Aba ativa em pílula azul (#556ee6, 4,4:1): mesmo azul, um tom abaixo. */
html[data-ui="next"] body[data-theme="air"] .nav-pills .nav-link.active {
    background-color: #4458c9;
    color: #fff;
}

html[data-ui="next"] body[data-theme="air"] .nav-pills .nav-link:not(.active) {
    color: #4458c9;
}

html[data-ui="next"][data-bs-theme="dark"] body[data-theme="air"] .nav-pills .nav-link:not(.active) {
    color: #9fb0f5;
}

/* ── Onda 8 — Pessoas & Alocações ───────────────────────────────────────────
   /employees, /details-employees, férias, ausências, horas extras, licenças. */

/* Utilitários de cor do Bootstrap em texto (text-success, text-danger…): a mesma
   cor em tom que passa 4,5:1 sobre o fundo claro. Fundo (bg-*) não muda. */
html[data-ui="next"]:not([data-bs-theme="dark"]) body[data-theme="air"] .text-success { color: #1e7e5a !important; }
html[data-ui="next"]:not([data-bs-theme="dark"]) body[data-theme="air"] .text-danger { color: #c43030 !important; }
html[data-ui="next"]:not([data-bs-theme="dark"]) body[data-theme="air"] .text-info { color: #1f6fb8 !important; }
html[data-ui="next"]:not([data-bs-theme="dark"]) body[data-theme="air"] .text-warning { color: #9a5b00 !important; }
html[data-ui="next"]:not([data-bs-theme="dark"]) body[data-theme="air"] .text-primary { color: #4458c9 !important; }

/* Cartões-resumo de colaboradores: contagem na cor do cartão, tom legível; rótulo no muted do AI/R. */
html[data-ui="next"] body[data-theme="air"] .employees-dashboard-card-label {
    color: var(--air-ink-muted);
}

html[data-ui="next"]:not([data-bs-theme="dark"]) body[data-theme="air"] .employees-dashboard-card.color-success .employees-dashboard-card-count { color: #1e7e5a; }
html[data-ui="next"]:not([data-bs-theme="dark"]) body[data-theme="air"] .employees-dashboard-card.color-danger .employees-dashboard-card-count { color: #c43030; }
html[data-ui="next"]:not([data-bs-theme="dark"]) body[data-theme="air"] .employees-dashboard-card.color-info .employees-dashboard-card-count { color: #1f6fb8; }
html[data-ui="next"]:not([data-bs-theme="dark"]) body[data-theme="air"] .employees-dashboard-card.color-warning .employees-dashboard-card-count { color: #9a5b00; }
html[data-ui="next"]:not([data-bs-theme="dark"]) body[data-theme="air"] .employees-dashboard-card.color-primary .employees-dashboard-card-count { color: #4458c9; }
html[data-ui="next"] body[data-theme="air"] .employees-dashboard-card.color-secondary .employees-dashboard-card-count { color: var(--air-ink-muted); }

/* Textos de apoio longos (importação de férias e afins) na medida de leitura. */
html[data-ui="next"] body[data-theme="air"] .form-page p.small,
html[data-ui="next"] body[data-theme="air"] .form-page p.text-muted {
    max-width: 80ch;
}

/* ── Onda 10 — Relatórios & Central de Tickets ──────────────────────────────
   Relatórios de alocação, evidências, One Page, Engineering Health (a folha do
   relatório segue a decisão vigente e não muda), rateio de liderança, tickets. */

/* Engineering Health: controles acima da folha no piso de 11/12px. */
html[data-ui="next"] body[data-theme="air"] #ehr-app .ctl label {
    font-size: var(--air-ui-fs-label);
    letter-spacing: var(--air-ui-ls-label);
}

html[data-ui="next"] body[data-theme="air"] #ehr-app .hint {
    font-size: var(--air-ui-fs-small);
}

/* Gestão de Tickets: rótulos dos indicadores de tempo (10,9px) no piso. */
html[data-ui="next"] body[data-theme="air"] #indicators-panel .indicator-card-label {
    font-size: var(--air-ui-fs-label);
}

/* Badge rosa de status (branco sobre #e83e8c, 3,8:1): mesmo rosa, um tom abaixo. */
html[data-ui="next"] body[data-theme="air"] .badge.bg-pink {
    background-color: #c2185b !important;
}

/* Subtítulos e textos de apoio longos (rateio de liderança) na medida de leitura. */
html[data-ui="next"] body[data-theme="air"] .page-content p.text-muted {
    max-width: 80ch;
}

/* Texto de apoio centralizado (estado vazio, avisos) continua no centro com a medida. */
html[data-ui="next"] body[data-theme="air"] .page-content .text-center p {
    margin-inline: auto;
}

/* ── Onda 11 — Cadastros de Apoio & Administração ───────────────────────────
   Áreas, cargos, níveis, divisões, tribos, squads, marcas, indústrias,
   produtos, geografias, usuários, perfis de acesso e notas de atualização. */

/* Links em tabela no azul do Velzon (#556ee6, 4,4:1): mesmo azul, um tom abaixo. */
html[data-ui="next"]:not([data-bs-theme="dark"]) body[data-theme="air"] td > a:not(.btn) {
    color: #4458c9;
}

/* Badge suave informativo (texto #50a5f1 sobre fundo claro, 2,6:1): mesmo azul, tom legível. */
html[data-ui="next"]:not([data-bs-theme="dark"]) body[data-theme="air"] .badge-soft-info {
    color: #1f6fb8;
}

/* ── Onda 12 — Portal do Colaborador ────────────────────────────────────────
   /employee/*: home, apontamento de horas, ausências, horas extras, perfil,
   solicitações, tickets e novidades (login e senha foram na onda 1). */

/* Calendário de apontamento: dia sem lançamento em vermelho (#f46a6a sobre
   #fff8f8, 2,8:1) — mesmo vermelho, tom legível. */
html[data-ui="next"]:not([data-bs-theme="dark"]) body[data-theme="air"] .calendar-day.day-missing-entry:not(.day-missing):not(.day-pending):not(.day-distributed) .day-number {
    color: #c43030;
}

/* Nome do feriado no dia (10px) no piso de 11px. */
html[data-ui="next"] body[data-theme="air"] .holiday-badge {
    font-size: var(--air-ui-fs-label);
}

/* Home: selo "atenção" (branco sobre #f1b44c, 1,8:1) — mesmo amarelo, texto escuro. */
html[data-ui="next"]:not([data-bs-theme="dark"]) body[data-theme="air"] .home-pending-attention {
    color: #3d2a00;
}

/* ── Detalhe de projeto: Visão Geral (app/details/partials/overview-details) ── */
html[data-ui="next"] body[data-theme="air"] .pdx-overview {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
    gap: 16px;
    margin-bottom: 16px;
}

html[data-ui="next"] body[data-theme="air"] .pdx-overview .air-card {
    padding: 20px 24px;
}

html[data-ui="next"] body[data-theme="air"] .pdx-overview .air-section-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
}

html[data-ui="next"] body[data-theme="air"] .pdx-notes {
    max-width: 75ch;
    margin: 0 0 18px;
    font-size: 14px;
    line-height: 1.55;
    color: var(--air-ink);
}

html[data-ui="next"] body[data-theme="air"] .pdx-dl {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 16px 24px;
    margin: 0;
}

html[data-ui="next"] body[data-theme="air"] .pdx-dl dt {
    margin-bottom: 2px;
    font-size: var(--air-ui-fs-small);
    font-weight: 400;
    color: var(--air-ink-muted);
}

html[data-ui="next"] body[data-theme="air"] .pdx-dl dd {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--air-ink-strong);
    overflow-wrap: anywhere;
}

html[data-ui="next"] body[data-theme="air"] .pdx-dl dd.is-empty {
    font-weight: 400;
    color: var(--air-ink-muted);
}

html[data-ui="next"] body[data-theme="air"] .pdx-dl__wide {
    grid-column: 1 / -1;
}

html[data-ui="next"] body[data-theme="air"] .pdx-dl__wide dd {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

html[data-ui="next"] body[data-theme="air"] .pdx-side {
    display: grid;
    gap: 16px;
    align-content: start;
}

html[data-ui="next"] body[data-theme="air"] .pdx-people,
html[data-ui="next"] body[data-theme="air"] .pdx-docs__list {
    max-height: 320px;
    margin: 0;
    padding: 0;
    overflow-y: auto;
    list-style: none;
}

html[data-ui="next"] body[data-theme="air"] .pdx-people li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 0;
    font-size: 13px;
    color: var(--air-ink-strong);
}

html[data-ui="next"] body[data-theme="air"] .pdx-docs__list li {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
    border-bottom: 1px solid var(--air-border-soft);
    font-size: 13px;
}

html[data-ui="next"] body[data-theme="air"] .pdx-docs__list li:last-child {
    border-bottom: 0;
}

html[data-ui="next"] body[data-theme="air"] .pdx-docs__icon {
    font-size: 18px;
    color: var(--air-accent-danger);
}

html[data-ui="next"] body[data-theme="air"] .pdx-docs__name {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

html[data-ui="next"] body[data-theme="air"] .pdx-docs__name a {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: var(--air-ink-strong);
}

@media (max-width: 991.98px) {
    html[data-ui="next"] body[data-theme="air"] .pdx-overview {
        grid-template-columns: 1fr;
    }}

/* ── Ciclo de vida do projeto: as setas da clássica, refinadas ─────────────────
   Revisão do José (24/09): a régua fina perdeu para as setas. Ficam o recorte e as
   cores de estado da clássica (verde concluído, azul atual, amarelo parado, cinza
   cancelado); muda a etapa pendente, que usa a superfície do tema (a cinza clara
   da clássica acendia no escuro), a altura fixa e o texto, que quebra em vez de cortar
   ("Aguardando Contrato"). */
html[data-ui="next"] body[data-theme="air"] .project-lifecycle-timeline {
    gap: 4px;
    padding: 4px 0 10px;
}

html[data-ui="next"] body[data-theme="air"] .lifecycle-step {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 32px; /* setas mais finas (card 982877; eram 40px) */
    padding: 4px 16px 4px 22px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.15;
    white-space: normal;
    text-align: center;
    transition: background-color 150ms var(--air-ui-ease-out), color 150ms var(--air-ui-ease-out);
}

html[data-ui="next"] body[data-theme="air"] .lifecycle-step:first-child {
    padding-left: 10px;
}

html[data-ui="next"] body[data-theme="air"] .lifecycle-step--pending,
html[data-ui="next"] body[data-theme="air"] .project-lifecycle-timeline--readonly .lifecycle-step--pending:hover {
    background-color: var(--air-surface-hover);
    color: var(--air-ink-muted);
}

html[data-ui="next"] body[data-theme="air"] .lifecycle-step--pending:hover {
    background-color: var(--air-border-strong);
    color: var(--air-ink-strong);
}

html[data-ui="next"] body[data-theme="air"] .lifecycle-step--active {
    font-weight: 600;
}

html[data-ui="next"] body[data-theme="air"] .lifecycle-timeline--invalid .lifecycle-step--pending {
    background-color: var(--bs-danger-bg-subtle, #f8d7da);
    color: var(--bs-danger-text-emphasis, #842029);
}

html[data-ui="next"] body[data-theme="air"] .lifecycle-step .step-check {
    font-size: 15px;
}

/* ── Faixa de indicadores genérica (onda A, 24/09) ──────────────────────────
   Linhas de cartões de número (painel de horas dos apontamentos do time e as telas
   que usam o mesmo cartão) viram uma peça só, dividida por fio — o arranjo aprovado
   em colaboradores. O fio de cada célula é uma sombra de 1px: a da borda externa
   fica cortada pelo overflow, então não importa quantas colunas couberem. */
html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .hours-panel-stat-card),
html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .card.bg-light .avatar-sm),
html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .survey-kpi) {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    margin: 0 0 16px;
    border: 1px solid var(--air-border-color);
    border-radius: var(--air-radius-lg);
    background: var(--air-surface-raised);
    overflow: hidden;
}

html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .hours-panel-stat-card) > [class*="col"],
html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .card.bg-light .avatar-sm) > [class*="col"],
html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .survey-kpi) > [class*="col"] {
    width: auto;
    max-width: none;
    margin: 0;
    padding: 0;
    box-shadow: 1px 0 0 var(--air-border-color), 0 1px 0 var(--air-border-color);
}

html[data-ui="next"] body[data-theme="air"] .row > [class*="col"] > .card.hours-panel-stat-card,
html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .card.bg-light .avatar-sm) > [class*="col"] > .card.bg-light,
html[data-ui="next"] body[data-theme="air"] .row > [class*="col"] > .survey-kpi {
    height: 100%;
    margin: 0;
    border: 0 !important;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

html[data-ui="next"] body[data-theme="air"] .hours-panel-stat-card h4 {
    font-size: 22px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

/* Cartão de número do Velzon (texto + ícone em quadrado colorido à direita): o número ganha
   peso de indicador e o ícone encolhe, mantendo a cor de cada um. */
html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .card.bg-light .avatar-sm) h5 {
    font-size: 20px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .card.bg-light .avatar-sm) .avatar-sm {
    width: 36px;
    height: 36px;
}

html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .card.bg-light .avatar-sm) p {
    font-size: var(--air-ui-fs-small) !important;
    color: var(--air-ink-muted);
}

html[data-ui="next"] body[data-theme="air"] .row > [class*="col"] > .survey-kpi .survey-kpi-label {
    font-size: var(--air-ui-fs-small);
    letter-spacing: 0;
    text-transform: none;
}

html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .card.bg-light .avatar-sm) > [class*="col"] > .card.bg-light {
    background-color: transparent !important;
}

/* O quadrado colorido do ícone vira só o glifo na cor do indicador (revisão do José,
   24/09: "Receitas do Projeto ainda com visual antigo"). A cor de cada um continua. */
html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .card.bg-light .avatar-sm) .avatar-title {
    background: transparent !important;
    color: var(--air-ink-muted);
}

html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .card.bg-light .avatar-sm) .avatar-title.bg-primary { color: rgb(var(--bs-primary-rgb)); }
html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .card.bg-light .avatar-sm) .avatar-title.bg-success { color: rgb(var(--bs-success-rgb)); }
html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .card.bg-light .avatar-sm) .avatar-title.bg-danger { color: rgb(var(--bs-danger-rgb)); }
html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .card.bg-light .avatar-sm) .avatar-title.bg-warning { color: rgb(var(--bs-warning-rgb)); }
html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .card.bg-light .avatar-sm) .avatar-title.bg-info { color: rgb(var(--bs-info-rgb)); }
html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .card.bg-light .avatar-sm) .avatar-title.bg-dark { color: var(--air-ink-strong); }

html[data-ui="next"] body[data-theme="air"] .row:has(> [class*="col"] > .card.bg-light .avatar-sm) .avatar-sm .font-size-24 {
    font-size: 22px !important;
}

/* Receitas do Projeto (aba Financeiro): os botões do cabeçalho seguem o visual novo. O
   restante da seção (status e ações da tabela) continua com as cores clássicas, que
   foram pedido do negócio (17/08) — ver financial-project-detail.css. */
html[data-ui="next"] body[data-theme="air"] #revenues-section > [class*="col"] > .card > .card-header .btn-primary {
    background: var(--air-accent-solid);
    border-color: var(--air-accent-solid);
    color: var(--air-on-accent);
    font-family: var(--air-font-mono);
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 6px 14px;
}

html[data-ui="next"] body[data-theme="air"] #revenues-section > [class*="col"] > .card > .card-header .btn-primary:hover,
html[data-ui="next"] body[data-theme="air"] #revenues-section > [class*="col"] > .card > .card-header .btn-primary:focus {
    background: var(--air-accent-solid-hover);
    border-color: var(--air-accent-solid-hover);
    color: var(--air-on-accent);
}

/* ── Detalhe do colaborador: aba Observações (app/details/partials/employee-observations) ── */
html[data-ui="next"] body[data-theme="air"] .edx-facts + .edx-facts {
    margin-top: 16px;
}

html[data-ui="next"] body[data-theme="air"] .edx-facts__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

html[data-ui="next"] body[data-theme="air"] .edx-facts__head .air-section-title {
    margin: 0;
}

html[data-ui="next"] body[data-theme="air"] .edx-facts > .air-section-title {
    margin-bottom: 12px;
}

/* Piso de 11px (DESIGN.md) para as utilidades de fonte pequena do Velzon e dicas de campo
   que ainda descem abaixo disso (badges font-size-10, dica de senha do colaborador). */
html[data-ui="next"] body[data-theme="air"] .font-size-10,
html[data-ui="next"] body[data-theme="air"] .employee-password-tip {
    font-size: var(--air-ui-fs-label) !important;
}

/* Badge herda 0,75em do texto em volta: dentro de texto pequeno cai para menos de 11px. */
html[data-ui="next"] body[data-theme="air"] .badge {
    font-size: max(var(--air-ui-fs-label), 0.75em);
}

/* ── Formulário de Delivery Check (criar/editar) — onda D ─────────────────
   Rótulos e cabeçalhos em caixa da frase, salvar no preto de ação principal
   (era um degradê índigo com sombra), cartões internos planos. As cores de
   saúde (bolinhas e pílulas de CS status) continuam. */
html[data-ui="next"] body[data-theme="air"] :is(
    .delivery-check-editor-title,
    .delivery-check-editor-subtitle,
    .delivery-check-health-label,
    .delivery-check-quality-label,
    .delivery-check-quadrant-header,
    .delivery-check-inner-card .card-title,
    .delivery-check-action-plan-header .card-title,
    .delivery-check-action-plan-table thead th,
    .delivery-check-action-edit-table thead th
) {
    letter-spacing: 0;
    text-transform: none;
}

html[data-ui="next"] body[data-theme="air"] .delivery-check-editor-title {
    font-size: 22px;
    font-weight: 600;
    color: var(--air-ink-strong);
}

html[data-ui="next"] body[data-theme="air"] :is(.delivery-check-health-label, .delivery-check-quality-label, .delivery-check-quadrant-header) {
    font-size: var(--air-ui-fs-small);
    font-weight: 600;
    color: var(--air-ink-muted);
}

html[data-ui="next"] body[data-theme="air"] .delivery-check-toolbar-save {
    background: var(--air-ink-strong);
    box-shadow: none;
    color: var(--air-surface-raised) !important;
}

html[data-ui="next"] body[data-theme="air"] .delivery-check-inner-card {
    box-shadow: none;
}

/* ── Grupos recolhíveis: um desenho só (revisão do José, 24/09) ──────────────────
   Padrão = o grupo do "Detalhamento de colaboradores" do dashboard de alocações
   (AirGroup): cada grupo com moldura própria e 10px entre eles, cabeçalho inteiro
   clicável em superfície levemente elevada, título 14px em negrito, contagem e
   métricas ao lado, seta à direita — para baixo aberto, para a direita fechado.
   Aqui: os acordeões do Bootstrap. Os demais recolhíveis montados à mão (cartão com
   cabeçalho que abre, painéis de comando, grupos de jornadas, ACL por módulo…)
   recebem as mesmas classes pelo air-collapse.init.js (.air-collapse, abaixo). */
html[data-ui="next"] body[data-theme="air"] .accordion {
    display: flex;
    flex-direction: column;
    gap: 10px;
    border: 0;
    background: transparent;
}

html[data-ui="next"] body[data-theme="air"] .accordion > .accordion-item {
    margin: 0;
    border: 1px solid var(--air-border-color);
    border-radius: var(--air-radius-lg);
    background: var(--air-surface-raised);
    overflow: hidden;
}

html[data-ui="next"] body[data-theme="air"] .accordion > .accordion-item .accordion-header.d-flex {
    gap: 8px;
    padding: 0 12px 0 0;
    background: var(--air-surface-alt);
}

html[data-ui="next"] body[data-theme="air"] .accordion > .accordion-item .accordion-button,
html[data-ui="next"] body[data-theme="air"] .accordion > .accordion-item .accordion-button:not(.collapsed) {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border-radius: 0;
    background: var(--air-surface-alt);
    box-shadow: none;
    font-size: 14px;
    font-weight: 600;
    color: var(--air-ink-strong);
    transition: background-color 160ms var(--air-ui-ease-out);
}

html[data-ui="next"] body[data-theme="air"] .accordion > .accordion-item .accordion-header.d-flex .accordion-button {
    background: transparent;
}

html[data-ui="next"] body[data-theme="air"] .accordion > .accordion-item .accordion-button:hover,
html[data-ui="next"] body[data-theme="air"] .accordion > .accordion-item .accordion-header.d-flex:hover {
    background: var(--air-surface-hover);
}

html[data-ui="next"] body[data-theme="air"] .accordion > .accordion-item .accordion-button::after {
    width: auto;
    height: auto;
    margin-left: auto;
    background: none;
    font-family: "Material Design Icons";
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    content: "\F0140";
    color: var(--air-ink-muted);
    transform: none;
    transition: transform 200ms var(--air-ui-ease-out);
}

html[data-ui="next"] body[data-theme="air"] .accordion > .accordion-item .accordion-button.collapsed::after {
    transform: rotate(-90deg);
}

html[data-ui="next"] body[data-theme="air"] .accordion-button:focus-visible {
    outline: 2px solid var(--air-ink-strong);
    outline-offset: -2px;
}

html[data-ui="next"] body[data-theme="air"] .accordion-header .btn-primary.btn-sm {
    border-color: var(--air-border-strong);
    background: transparent;
    color: var(--air-ink-strong);
}

html[data-ui="next"] body[data-theme="air"] .accordion-header .btn-primary.btn-sm:hover {
    border-color: var(--air-ink-strong);
    background: var(--air-surface-hover);
}

html[data-ui="next"] body[data-theme="air"] .accordion-header .btn-danger.btn-sm {
    border-color: transparent;
    background: color-mix(in srgb, #c43030 12%, transparent);
    color: #c43030;
}

html[data-ui="next"][data-bs-theme="dark"] body[data-theme="air"] .accordion-header .btn-danger.btn-sm {
    color: #f46a6a;
}

html[data-ui="next"] body[data-theme="air"] .accordion > .accordion-item .accordion-body {
    padding: 16px;
    border-top: 1px solid var(--air-border-color);
}

/* Recolhíveis montados à mão, normalizados pelo air-collapse.init.js. */
html[data-ui="next"] body[data-theme="air"] .air-collapse {
    margin-bottom: 10px;
    border: 1px solid var(--air-border-color) !important;
    border-radius: var(--air-radius-lg) !important;
    background: var(--air-surface-raised);
    box-shadow: none;
    overflow: hidden;
}

html[data-ui="next"] body[data-theme="air"] .air-collapse {
    padding: 0 !important;
}

html[data-ui="next"] body[data-theme="air"] .air-collapse + .air-collapse {
    margin-top: 0 !important;
}

html[data-ui="next"] body[data-theme="air"] .air-collapse > .air-collapse__inner {
    padding: 0;
}

/* Conteúdo sem invólucro próprio com respiro (ex.: grade de permissões da ACL por módulo). */
html[data-ui="next"] body[data-theme="air"] .air-collapse > .air-collapse__body:not(:has(> :is([class*="-body"], .table-responsive, table))) {
    padding: 12px 16px 4px;
}

html[data-ui="next"] body[data-theme="air"] .air-collapse .air-collapse__head {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    width: 100%;
    margin: 0;
    padding: 12px 16px;
    border: 0;
    border-radius: 0;
    background: var(--air-surface-alt) !important;
    font-size: 14px;
    font-weight: 600;
    color: var(--air-ink-strong);
    text-align: left;
    cursor: pointer;
    transition: background-color 160ms var(--air-ui-ease-out);
}

html[data-ui="next"] body[data-theme="air"] .air-collapse .air-collapse__head:hover {
    background: var(--air-surface-hover) !important;
}

html[data-ui="next"] body[data-theme="air"] .air-collapse .air-collapse__head > .d-flex {
    flex: 1 1 auto;
    min-width: 0;
}

html[data-ui="next"] body[data-theme="air"] .air-collapse .air-collapse__head :is(h1, h2, h3, h4, h5, h6, strong, b) {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--air-ink-strong);
}

/* Botão de abrir que é só uma parte do cabeçalho: vira o clique do cabeçalho inteiro. */
html[data-ui="next"] body[data-theme="air"] .air-collapse .air-collapse__trigger {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0;
    border: 0;
    background: transparent;
    font: inherit;
    color: inherit;
    text-align: left;
}

html[data-ui="next"] body[data-theme="air"] .air-collapse .air-collapse__trigger::after {
    content: "";
    position: absolute;
    inset: 0;
}

html[data-ui="next"] body[data-theme="air"] .air-collapse .air-collapse__trigger--icon {
    position: static;
    width: 0;
    overflow: visible;
}

html[data-ui="next"] body[data-theme="air"] .air-collapse .air-collapse__trigger--icon > * {
    display: none;
}

html[data-ui="next"] body[data-theme="air"] .air-collapse .air-collapse__head :is(a, button, input, select, .btn):not(.air-collapse__trigger) {
    position: relative;
    z-index: 1;
}

html[data-ui="next"] body[data-theme="air"] .air-collapse .air-collapse__chevron {
    order: 50;
    float: none !important;
    margin: 0 0 0 auto !important;
    font-size: 16px !important;
    line-height: 1;
    color: var(--air-ink-muted) !important;
    transform: none !important;
    transition: transform 200ms var(--air-ui-ease-out);
}

html[data-ui="next"] body[data-theme="air"] .air-collapse.is-collapsed .air-collapse__chevron {
    transform: rotate(-90deg) !important;
}

html[data-ui="next"] body[data-theme="air"] .air-collapse .air-collapse__body {
    border-top: 1px solid var(--air-border-color);
}

@media (prefers-reduced-motion: reduce) {
    html[data-ui="next"] body[data-theme="air"] :is(.accordion-button, .accordion-button::after, .air-collapse__head, .air-collapse__chevron) {
        transition: none !important;
    }}

/* Painel de filtros do histórico de dados: sempre aberto, sem botão de recolher (filtros
   sempre à vista — revisão do José, 24/09). */
html[data-ui="next"] body[data-theme="air"] .history-filter-header [data-bs-toggle="collapse"] {
    display: none;
}

html[data-ui="next"] body[data-theme="air"] #filterPanel.collapse:not(.show) {
    display: block;
}

/* ── Sub-navegação de Pesquisas e Jornadas: as mesmas pílulas dos atalhos do Customer
   Success (.csx-link), para as duas linhas de botões irmãos não parecerem de sistemas
   diferentes (revisão do José, 24/09). A página atual fica preenchida. */
html[data-ui="next"] body[data-theme="air"] .surveys-subnav-list {
    gap: 8px;
}

html[data-ui="next"] body[data-theme="air"] .surveys-subnav[data-cy] .surveys-subnav-list.nav-pills .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 32px;
    margin: 0;
    padding: 4px 12px;
    border: 1px solid var(--air-border-strong);
    border-radius: 999px;
    background: transparent;
    font-size: 13px;
    font-weight: 400;
    color: var(--air-ink);
    transition: background-color 140ms ease-out, border-color 140ms ease-out;
}

html[data-ui="next"] body[data-theme="air"] .surveys-subnav[data-cy] .surveys-subnav-list.nav-pills .nav-link .mdi {
    margin: 0 !important;
    font-size: 16px;
    color: var(--air-ink-strong);
}

html[data-ui="next"] body[data-theme="air"] .surveys-subnav[data-cy] .surveys-subnav-list.nav-pills .nav-link:hover,
html[data-ui="next"] body[data-theme="air"] .surveys-subnav[data-cy] .surveys-subnav-list.nav-pills .nav-link:focus-visible {
    border-color: var(--air-ink-strong);
    background: var(--air-surface-hover);
    color: var(--air-ink-strong);
}

html[data-ui="next"] body[data-theme="air"] .surveys-subnav[data-cy] .surveys-subnav-list.nav-pills .nav-link.active,
html[data-ui="next"] body[data-theme="air"] .surveys-subnav[data-cy] .surveys-subnav-list.nav-pills .nav-link.active .mdi {
    border-color: var(--air-accent-solid);
    background: var(--air-accent-solid);
    color: var(--air-on-accent);
}

@media (prefers-reduced-motion: reduce) {
    html[data-ui="next"] body[data-theme="air"] .surveys-subnav[data-cy] .surveys-subnav-list.nav-pills .nav-link {
        transition: none;
    }}

/* ── Configurações: abas Feature Flags e Alíquotas de Imposto (app/settings) ── */
html[data-ui="next"] body[data-theme="air"] .ffx-name {
    display: block;
    font-weight: 600;
    color: var(--air-ink-strong);
}

html[data-ui="next"] body[data-theme="air"] .ffx-key {
    display: block;
    margin-top: 2px;
    font-family: var(--air-font-mono);
    font-size: 12px;
    color: var(--air-ink-muted);
}

html[data-ui="next"] body[data-theme="air"] .ffx-description {
    max-width: 70ch;
    color: var(--air-ink);
}

html[data-ui="next"] body[data-theme="air"] .txx-table .txx-num {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* Portal — Solicitações de Hora Extra: tabela encostada na moldura do cartão, como as
   demais listagens (o título e o botão de criar ficam no cabeçalho da página). */
html[data-ui="next"] body[data-theme="air"] .overtime-list-card > .card-body:has(> .table-responsive) {
    padding: 0;
}

/* Configurações — Calendário de Horas Mensais: campos de filtro na largura padrão dos
   painéis (220px+), não no tamanho do texto da opção. */
html[data-ui="next"] body[data-theme="air"] .mwc-filters .row > .col-sm-auto:has(> select) {
    min-width: 220px;
}

/* Aba Extrato de Uso (AMS): filtros, ação em massa e contagem ficavam colados na borda do cartão
   (card 982877). A listagem zera o respiro do corpo do cartão para a tabela encostar na moldura;
   aqui o respiro volta só nos blocos que não são a tabela. */
html[data-ui="next"] body[data-theme="air"] .ams-tab-card > .card-body > :not(.table-responsive) {
    margin-inline: 20px;
}

html[data-ui="next"] body[data-theme="air"] .ams-tab-card > .card-body > form:first-child {
    margin-top: 16px;
}

html[data-ui="next"] body[data-theme="air"] .ams-tab-card > .card-body > :last-child:not(.table-responsive) {
    margin-bottom: 14px;
}

/* Base Line: os ícones de ordenação alargam o cabeçalho; o texto quebra em vez de empurrar a tabela. */
html[data-ui="next"] body[data-theme="air"] #ams-baseline-table thead th {
    padding-inline: 10px;
}

html[data-ui="next"] body[data-theme="air"] #ams-baseline-table thead th .air-sort {
    white-space: normal;
    text-align: inherit;
}

/* Excluir (alocações do mês) no cabeçalho do acordeão: no escuro o vermelho sólido gritava ao lado do
   "Editar alocações do mês" (card 982877). Mesmo desenho do botão soft de perigo, sólido no hover. */
html[data-bs-theme="dark"] body[data-theme="air"] .accordion-header > .btn-danger {
    background: color-mix(in srgb, var(--air-pill-cancel-fg) 24%, transparent);
    border-color: transparent;
    color: var(--air-pill-cancel-fg) !important;
}

html[data-bs-theme="dark"] body[data-theme="air"] .accordion-header > .btn-danger:hover,
html[data-bs-theme="dark"] body[data-theme="air"] .accordion-header > .btn-danger:focus {
    background: var(--air-pill-cancel-fg);
    color: var(--air-on-accent) !important;
}