/* ==========================================================================
   LUCREI — CONTRASTE E CARTÕES (16/09/2026)
   Cada regra aqui é um par texto/fundo que o Playwright mediu abaixo do
   mínimo da WCAG (4,5:1 no texto normal, 3:1 no grande) depois da troca de
   identidade. Só cor: nenhuma medida, peso ou componente muda. Esta folha
   entra por ÚLTIMO em toda página e usa !important de propósito — ela existe
   para vencer regras antigas mais específicas, não para criar estilo novo.
   Tinta de texto no claro: #102C36 · secundária #46626C · verde #007C68.
   No escuro: #F2F7F8 · secundária #C2D7DB · menta #34D6B5.
   ========================================================================== */

/* --- 1. menta clara como TEXTO em fundo claro (era 1,4:1) ---------------- */
.eyebrow,
.escopo-selo,
.selo-topo,
.link-busca,
.product-body small,
.course-copy small,
.inicio-pe .link,
#rodape a,
button.link,
.kicker{ color:#007C68 !important; }

/* --- 2. texto secundário claro demais no papel (2,3 a 4,5:1) ------------ */
.inner-hero p,
.section-heading > p,
.product-body p,
.agent-card small,
.decision-tabs button,
.action-list .rank,
.porta-topo .volta,
.caixa #subtitulo,
.caixa #avisoML,
.caixa .ou,
.caixa #rodape,
.abas button,
.entrada span,
.cab .lado,
.wrap > nav > a,
.agent-chat-form label,
#chat-agent-role,
.esc-resumo-card small,
.atd-filtros button,
.inicio-topo small,
#inSub,
.inicio-pe,
.grafvazio,
.trust-row,
.floating-kpi small,
.plan-foot{ color:#46626C !important; }

/* --- 3. texto sobre a menta cheia: Atlântico ----------------------------- */
.waterfall .profit,
.card.lima .lab,
.cta-lime{ color:#102C36 !important; }

/* --- 4. sobre fundo Atlântico quem marca é a menta ----------------------- */
.dashboard-feature .kicker,
.dashboard-heading .kicker,
.final-cta .kicker,
.site-footer .kicker,
.porta-prova .kicker{ color:#34D6B5 !important; }

/* --- 5. cartão de plano em destaque é escuro: tinta clara ---------------- */
.plan-card.featured .plan-purpose,
.plan-card.featured .plan-foot,
.plan-card.featured small,
.plan-card.featured p{ color:#C2D7DB !important; }

/* --- 6. a coluna escura do Escritório ------------------------------------ */
body.v5-escritorio .sidebar .conta-lado.sem-conta .entrar,
body.v5-escritorio .sidebar .back-site,
body.v5-escritorio .sidebar nav .abre-grupo,
body.v5-escritorio .sidebar .grupo > button{ color:#C2D7DB !important; }

/* o botão "Criar conta grátis" na coluna escura ficava tinta sobre tinta */
body.v5-escritorio .sidebar .conta-lado.sem-conta .primary,
body.v5-escritorio .sidebar .conta-lado.sem-conta .full-button{
  background:#34D6B5 !important;
  color:#102C36 !important;
  border-color:#34D6B5 !important;
}

/* --- 7. quando a coluna é clara, a mesma tinta volta a ser escura -------- */
body.v5-app-topo:not(.v5-escritorio) .app-page .sidebar .conta-lado.sem-conta .entrar,
body.v5-app-topo:not(.v5-escritorio) .app-page .sidebar .back-site,
body.v5-app-topo:not(.v5-escritorio) .app-page .sidebar nav .abre-grupo,
.office-panel .back-site,
.olho-btn{ color:#46626C !important; }

/* --- 8. os mesmos textos quando caem sobre faixa escura ------------------ */
.dashboard-heading p,
.dashboard-feature p,
.decision-tabs button.active,
.wrap > nav > a.primary,
.ferr-head .abas button.on,
.plan-card .plan-foot,
.plan-card small,
#escada .section-heading p{ color:#C2D7DB !important; }
#escada .kicker,
.comparison .kicker{ color:#34D6B5 !important; }

/* --- 9. o botão da coluna: menta serve no claro e no escuro -------------- */
.sidebar .conta-lado.sem-conta .primary,
.sidebar .conta-lado.sem-conta .full-button{
  background:#34D6B5 !important;
  color:#102C36 !important;
  border-color:#34D6B5 !important;
}

/* --- 10. tinta sobre menta ---------------------------------------------- */
.atd-filtros button.ativo,
.atd-filtros button[aria-pressed="true"]{ color:#102C36 !important; }

/* --- 11. a bandeirinha do gráfico é uma pílula escura -------------------- */
.linhadia .bandeira u{ color:#BBD0D5 !important; }

/* --- 12. últimos dois pares medidos ------------------------------------- */
.floating-kpi em{ color:#007C68 !important; }
.comparison .section-heading p{ color:#C2D7DB !important; }

/* ==========================================================================
   CARTÕES DO SITE — uma escala só (16/09/2026)
   Medido antes: 7 raios diferentes (11, 12, 14, 16, 18, 22, 24, 26, 32, 34px),
   5 cores de borda e 4 sombras convivendo na mesma tela. A escala agora é:
   pílula 999px · peça de dentro 14px · CARTÃO 24px · faixa grande 32px.
   Borda #D7E4E7 no claro, #28505B no escuro. Uma sombra só.
   O !important é de propósito: esta folha entra por último para vencer regra
   antiga mais específica, não para criar estilo novo.
   ========================================================================== */
.product-card,
.plan-card,
.course-card,
.prompt-card,
.agent-card,
.agent-card-art,
.escopo-item,
.member-aside,
.decision-board,
.calculator-shell,
.profit-card,
.continue-card,
.floating-kpi,
.esc-resumo-card,
.atd-card,
.ferr-card,
.hud-card,
.chat-agent-summary,
.chat-vazio,
.placar,
.bloco,
.caixa{
  border-radius:24px !important;
  border:1px solid #D7E4E7;
  box-shadow:0 2px 4px rgba(16,44,54,.03),0 12px 26px rgba(16,44,54,.05);
}

/* o mesmo cartão quando o fundo dele é Atlântico */
.plan-card.featured,
.profit-card,
.continue-card,
.calc-result,
.dashboard-feature,
body.v5-escritorio .sidebar .esc-resumo-card{
  border-color:#28505B;
  box-shadow:0 2px 6px rgba(5,26,33,.18),0 18px 40px rgba(5,26,33,.22);
}

/* faixa grande (não é cartão: é seção) */
.final-cta,
.comparison,
.office-art,
.dashboard-shot,
.office-live-shell .office-map{ border-radius:32px !important; }

/* peça de dentro do cartão e botão */
.search-box,
.calculator-shell input,
.campo input,
.campo select,
.prompt-card .prompt-icon,
.agent-card span,
.member-aside li > span,
.product-meta span,
.floating-kpi span,
.final-cta-action,
.plan-button,
.toggle,
.btn,
.primary,
.ghost,
.light-button{ border-radius:14px !important; }

/* pílula continua pílula */
.eyebrow,
.plan-badge,
.status-pill,
.selo,
.selo-topo,
.escopo-selo,
.chip,
.live-dot,
.avatar-dot{ border-radius:999px !important; }

/* o cartão acaba onde o conteúdo acaba — nada de esticar até o vizinho */
.product-grid,
.plan-grid,
.course-grid,
.prompt-grid,
.agent-grid,
.member-grid,
.escopo-grid,
.metric-grid{ align-items:start; }

/* ==========================================================================
   16/09/2026 — CONTRASTE DO ESCRITÓRIO, medido nos dois temas
   Esta é a ÚLTIMA folha da página: o que precisa vencer a cascata mora aqui.
   Tentei antes em v5-escritorio-claro.css e as regras perdiam para as daqui —
   registrado para a próxima pessoa não repetir o caminho.
   ========================================================================== */
/* o HUD do topo: a superfície continuava escura no tema claro e o número já
   estava com a tinta clara — "457" saiu com 1,04 de contraste, invisível */
html:not([data-tema="escuro"]) body.v5-escritorio .hud .hud-card{
  background:#ffffff!important;
  border:1px solid #D7E4E7!important;
}
html:not([data-tema="escuro"]) body.v5-escritorio .hud .hud-card b,
html:not([data-tema="escuro"]) body.v5-escritorio .hud .hud-card strong{
  color:#102c36!important;
}
html:not([data-tema="escuro"]) body.v5-escritorio .hud .hud-card small,
html:not([data-tema="escuro"]) body.v5-escritorio .hud .hud-card span{
  color:#46626c!important;
}
/* a caixa de entrada: hora, prazo e nota vinham no cinza de fundo escuro */
html:not([data-tema="escuro"]) body.v5-escritorio .atd-meta,
html:not([data-tema="escuro"]) body.v5-escritorio .atd-nota{ color:#46626c!important; }
html:not([data-tema="escuro"]) body.v5-escritorio .atd-prazo{ color:#8d5100!important; }
html:not([data-tema="escuro"]) body.v5-escritorio .esc-conta{ color:#2a4a55!important; }

/* -- o modo noturno (a folha clara fica desligada nele) ------------------- */
html[data-tema="escuro"] body.v5-escritorio .office-panel,
html[data-tema="escuro"] body.v5-escritorio .office-panel *,
html[data-tema="escuro"] body.v5-escritorio .esc-atalho *,
html[data-tema="escuro"] body.v5-escritorio .atd-aba,
html[data-tema="escuro"] body.v5-escritorio .esc-lendo{
  color:#a9c2c8;
}
html[data-tema="escuro"] body.v5-escritorio .office-panel h1,
html[data-tema="escuro"] body.v5-escritorio .office-panel h2,
html[data-tema="escuro"] body.v5-escritorio .office-panel b,
html[data-tema="escuro"] body.v5-escritorio .esc-atalho b,
html[data-tema="escuro"] body.v5-escritorio .esc-atalho strong{ color:#f4fbfc; }

/* o HUD tem uma variante de cor por cartão (.cor-azul, .cor-lima…) e é ELA
   que pinta o fundo — por isso a regra anterior, mirando só .hud-card, não
   alcançava o cartão azul */
html:not([data-tema="escuro"]) body.v5-escritorio .hud [class*="cor-"],
html:not([data-tema="escuro"]) body.v5-escritorio .hud .hud-card[class*="cor-"]{
  background:#ffffff!important;
}
html:not([data-tema="escuro"]) body.v5-escritorio .hud [class*="cor-"] b{
  color:#102c36!important;
}
/* modo noturno: o que ainda vinha na tinta do tema claro */
html[data-tema="escuro"] body.v5-escritorio .esc-atalho p,
html[data-tema="escuro"] body.v5-escritorio .esc-atalho small,
html[data-tema="escuro"] body.v5-escritorio .atd-abas button,
html[data-tema="escuro"] body.v5-escritorio .atd-aba,
html[data-tema="escuro"] body.v5-escritorio .esc-lendo,
html[data-tema="escuro"] body.v5-escritorio .office-chat-panel small{
  color:#a9c2c8!important;
}
/* o atalho destacado é menta cheia: a tinta em cima dele é escura */
html[data-tema="escuro"] body.v5-escritorio .esc-atalho.forte,
html[data-tema="escuro"] body.v5-escritorio .esc-atalho.forte *,
html[data-tema="escuro"] body.v5-escritorio .esc-atalho[class*="destaque"] *{
  color:#09262d!important;
}
