/* ============================================================
   DARK.CSS — Tema escuro do Escritório Virtual (ev-v2)
   Ativado por body.theme-dark (cookie "theme", igual ao layout atual).
   Carregado por ÚLTIMO no bundle ~/Content/ev-v2-css.

   Estratégia: o ev-v2 é dirigido por tokens (theme.css). Aqui
   redefinimos os tokens de SUPERFÍCIE/TEXTO/ESTADO para o escuro —
   isso já vira ~95% de todas as páginas. Abaixo, apenas os poucos
   pontos com cor fixa (ou que usam --text-strong como fundo, o que
   inverteria no escuro) recebem ajuste explícito.
   ============================================================ */

body.theme-dark {
  /* ----- Superfícies ----- */
  --body-bg: #0e1424;
  --card-bg: #161d33;
  --card-border: #263049;
  --card-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 8px 24px rgba(0, 0, 0, .5);

  /* ----- Texto ----- */
  --text-strong: #eef1fb;
  --text-body: #c3cae2;
  --text-muted: #8a93b4;

  /* ----- Gráficos ----- */
  --chart-grid: #263049;

  /* ----- Tints suaves: derivadas da própria marca/estado (color-mix),
     com fallback rgba p/ navegadores antigos. ----- */
  --brand-primary-soft: rgba(47, 107, 255, .20);
  --brand-primary-soft: color-mix(in srgb, var(--brand-primary) 24%, transparent);
  --success-soft: rgba(22, 163, 74, .20);
  --success-soft: color-mix(in srgb, var(--success) 22%, transparent);
  --danger-soft: rgba(225, 29, 72, .20);
  --danger-soft: color-mix(in srgb, var(--danger) 22%, transparent);
  --warning-soft: rgba(217, 119, 6, .22);
  --warning-soft: color-mix(in srgb, var(--warning) 24%, transparent);
  --info-soft: rgba(2, 132, 199, .20);
  --info-soft: color-mix(in srgb, var(--info) 22%, transparent);

  /* Faz os controles nativos (scrollbar, date/select, autofill) seguirem o escuro. */
  color-scheme: dark;
}

/* A Atlântica define --brand-accent como PRETO (#1c1c1c), usado em vários
   ícones/valores/badges "roxos". No escuro isso some. Redefinimos o accent
   para um roxo visível apenas nessa marca+tema — conserta todos de uma vez
   (cor E fundo). Nas demais marcas o accent já é uma cor viva. */
[data-theme="atlantica"] body.theme-dark { --brand-accent: #a978ff; }

/* ============================================================
   AJUSTES DE PONTOS FIXOS (shell / home / formulários)
   ============================================================ */

/* --- Usos de --text-strong como FUNDO (invertem no escuro) --- */
body.theme-dark .track-step.current .step-val { background: var(--brand-primary); color: #fff; }
body.theme-dark .kpi .ic.dark { background: rgba(255, 255, 255, .10); color: var(--text-strong); }
body.theme-dark .bonus-viagem .trip .thd { background: rgba(255, 255, 255, .07); }
body.theme-dark .bonus-viagem .bar > span { background: var(--brand-primary); }

/* --- Chips/faixas de pontos da trilha de qualificação --- */
body.theme-dark .track-step .step-val { background: rgba(255, 255, 255, .07); color: var(--text-strong); }
body.theme-dark .track-step.locked .step-val { background: rgba(255, 255, 255, .04); color: var(--text-muted); }

/* --- "Qualificação por nível" (mbox) e régua --- */
body.theme-dark .panel .mbox { background: var(--card-bg); }
body.theme-dark .panel .mbox .hd { background: rgba(255, 255, 255, .05); }
body.theme-dark .panel .rg-knob { background: var(--card-bg); border-color: var(--text-muted); }
body.theme-dark .bonus-viagem .bar { background: var(--chart-grid); }
body.theme-dark .bonus-viagem .trip { background: var(--card-bg); }
body.theme-dark .bonus-viagem .trip .thd span { color: var(--text-muted); }

/* --- KPIs (ic) --- */
body.theme-dark .kpi .ic { background: rgba(255, 255, 255, .06); }
body.theme-dark .kpi .ic.red { background: var(--danger-soft); }

/* --- Widget de links (patrocínio/loja) --- */
body.theme-dark .panel .share input.link { background: rgba(255, 255, 255, .04); color: var(--text-body); }
body.theme-dark .panel .share .btn-ghost { background: rgba(255, 255, 255, .04); color: var(--text-muted); }

/* --- Chips pastel de ícone: viram tint translúcido da própria cor --- */
body.theme-dark .p-icon.purple,
body.theme-dark .br-icon.purple,
body.theme-dark .mp-kpi__icon.purple { background: color-mix(in srgb, var(--brand-accent) 26%, transparent); }
body.theme-dark .br-icon.teal { background: color-mix(in srgb, #14b8a6 26%, transparent); }
body.theme-dark .br-icon.pink { background: color-mix(in srgb, #db2777 26%, transparent); }
body.theme-dark .br-icon.indigo { background: color-mix(in srgb, #6366f1 26%, transparent); }
body.theme-dark .br-icon.cyan,
body.theme-dark .ul-sc-icon.lvl-4 { background: color-mix(in srgb, var(--info) 26%, transparent); }
body.theme-dark .ul-sc-icon.lvl-1 { background: color-mix(in srgb, var(--brand-primary) 26%, transparent); }
body.theme-dark .ul-sc-icon.lvl-2 { background: color-mix(in srgb, var(--success) 26%, transparent); }
body.theme-dark .ul-sc-icon.lvl-3 { background: color-mix(in srgb, var(--brand-accent) 26%, transparent); }
body.theme-dark .ul-sc-icon.lvl-5 { background: color-mix(in srgb, var(--warning) 26%, transparent); }
body.theme-dark .ul-sc-icon.lvl-6 { background: color-mix(in srgb, var(--danger) 26%, transparent); }
body.theme-dark .ev-kpi-icon.safira { background: color-mix(in srgb, var(--gem-safira) 26%, transparent); }

/* --- Badges "inativo/off" com cinza claro fixo --- */
body.theme-dark .ul-status.inactive { background: rgba(255, 255, 255, .07); }

/* ============================================================
   PÁGINAS INTERNAS (checkout, financeiro, rede, vouchers, notícias)
   Chips/realces com cor fixa → tint translúcido da própria cor.
   Seletores com especificidade suficiente p/ vencer as regras .ev-v2.
   ============================================================ */

/* --- Chips roxos (#f1e8ff): usam --brand-accent, que na Atlântica é PRETO
   (some no escuro). Aqui recebem identidade roxa fixa e legível. --- */
body.theme-dark .pt-chip.vpq,
body.theme-dark .ci-icon.c-purple,
body.theme-dark .op-card-icon.purple,
body.theme-dark .op-unit-icon.evento,
body.theme-dark .origin-bar-icon.evento,
body.theme-dark .loc-auto-badge,
body.theme-dark .fin-kpi .fk-icon.purple,
body.theme-dark .fin-sum-icon.purple,
body.theme-dark .kpi-icon.purple,
body.theme-dark .vo-kpi__icon.purple,
body.theme-dark .pr-icon.c-purple,
body.theme-dark .cv-kpi__icon.purple,
body.theme-dark .news-cat-badge.treinamento { background: color-mix(in srgb, var(--brand-accent) 26%, transparent); }

/* --- Chips teal (#e0f5f3) --- */
body.theme-dark .pt-chip.pv,
body.theme-dark .ci-icon.c-teal,
body.theme-dark .vo-kpi__icon.teal { background: color-mix(in srgb, #14b8a6 26%, transparent); color: #2dd4bf; }

/* --- Ícones em gradiente claro (pré-visualização de produto no checkout) --- */
body.theme-dark .pc-img-icon.c-teal { background: color-mix(in srgb, #14b8a6 26%, transparent); color: #2dd4bf; }
body.theme-dark .pc-img-icon.c-emerald { background: color-mix(in srgb, var(--success) 26%, transparent); color: #34d399; }

/* --- Chip azul da financeira (#e0f2fe) --- */
body.theme-dark .fin-kpi .fk-icon.blue { background: color-mix(in srgb, var(--info) 26%, transparent); }
body.theme-dark .fa-card .bi.teal { color: #2dd4bf; }

/* --- Cupom de voucher (código em --brand-accent sobre #f1e8ff) --- */
body.theme-dark .vc-code { background: color-mix(in srgb, var(--brand-accent) 20%, transparent); border-color: color-mix(in srgb, var(--brand-accent) 45%, transparent); }

/* --- Botões escuros do checkout que usavam --text-strong como fundo --- */
body.theme-dark .coupon-row button,
body.theme-dark .cep-row button { background: rgba(255, 255, 255, .12); color: var(--text-strong); }

/* --- Alerta de sucesso: texto verde escuro fica ilegível no escuro --- */
body.theme-dark .pedido-alert.success { color: #4ade80; }

/* --- bootstrap-switch (BS3) reaproveitado: trilha/handle claros --- */
body.theme-dark .bootstrap-switch .bootstrap-switch-label { background: var(--card-bg); }
body.theme-dark .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-danger { background: rgba(255, 255, 255, .10); }

/* ============================================================
   BOTÃO DE ALTERNÂNCIA DE TEMA (topbar)
   ============================================================ */
.theme-switch-btn .bi-sun { display: none; }
body.theme-dark .theme-switch-btn .bi-moon-stars { display: none; }
body.theme-dark .theme-switch-btn .bi-sun { display: block; }
