/* ============================================================================
   BASEFLY — TEMA ESCURO (etapa 6)
   Carrega por último, depois de charts.css.

   Por que um arquivo só: o tema escuro antigo era uma segunda paleta (roxo
   #5B4EDC) espalhada por 84 regras `body.dark` dentro do styles.css, quase
   todas com cor literal e gradiente — exatamente o que a seção 8 proíbe. Elas
   saíram de lá e voltam aqui reescritas em token. Quem for mexer no escuro
   agora abre um arquivo, não caça 84 pontos em 11 mil linhas.

   Três decisões que governam tudo o que vem abaixo:

   1. O fundo é o Azul Base da marca (#070E24), não um cinza. O escuro do
      BaseFly já existe — é a cor da identidade, não uma invenção da interface.

   2. O azul de ação vira o Azul Céu. A seção 2.5 é explícita: o azul primário
      sobre o Azul Base dá 3,4:1 e reprova. Todo --blue-500 no escuro é Céu.
      Como o Céu é claro, o texto SOBRE preenchimento azul passa a ser escuro —
      e isso acontece sozinho, porque --n-0 aqui é a superfície escura.

   3. --n-0 deixa de ser branco. Ele é "a superfície do cartão" em 95% dos usos
      e "tinta sobre preenchimento colorido" no resto; virando escuro, os dois
      papéis continuam certos. Os poucos lugares que usavam --n-0 como texto
      sobre fundo ESCURO (barra lateral, cabeçalho de tabela — escuros nos dois
      temas) foram trocados por --on-dark na etapa 0 desta rodada.

   Contraste medido sobre a superfície #101A33 (WCAG 2.1):
     --n-900 #F2F5FC .... 15,8:1     --n-600 #B4C0DA .... 9,4:1
     --n-500 #8E9BB8 ....  6,2:1     Céu     #6E92FA .... 5,9:1
   ============================================================================ */

/* ---------------------------------------------------------------------------
   1. ESCALA BASEFLY NO ESCURO
   A escala clara é uma rampa de claro para escuro; aqui ela inverte de papel,
   mas mantém o nome. --n-0 continua sendo "a superfície mais próxima de você",
   --n-900 continua sendo "o texto de maior contraste".
   --------------------------------------------------------------------------- */
body.dark{
  /* marca — o Azul Base não muda; ele deixa de ser detalhe e vira o chão */
  --brand-air:#1B2C58;                 /* bloco de destaque, agora escuro */

  /* superfícies */
  --n-0:#101A33;                       /* cartão, modal, campo */
  --n-25:#16203C;                      /* linha alternada, hover de superfície */
  --n-50:#070E24;                      /* fundo de página — Azul Base */
  --n-100:#1B2745;                     /* superfície desabilitada, trilho */
  --n-200:#26355A;                     /* borda padrão */
  --n-300:#3D4C70;                     /* borda em hover, texto desabilitado */
  --n-500:#8E9BB8;                     /* texto terciário */
  --n-600:#B4C0DA;                     /* texto secundário */
  --n-900:#F2F5FC;                     /* texto primário */

  /* azul — deslocado uma parada para o claro (seção 2.5) */
  --blue-50:#16244A;                   /* fundo de seleção suave */
  --blue-100:#1B2C58;
  --blue-200:#A9C0FC;                  /* anel de foco: precisa brilhar aqui */
  --blue-300:#6E92FA;
  --blue-500:#6E92FA;                  /* Céu no lugar do primário */
  --blue-600:#8CA9FC;                  /* hover: mais claro, não mais escuro */
  --blue-700:#A9C0FC;                  /* pressionado */
  --blue-900:#C7D6FF;                  /* alto contraste */

  /* semânticas — preenchimento clareado para aceitar tinta escura por cima,
     fundo suave virando tinta da mesma matiz, texto na variante clara */
  --success:#3ECF9B;   --success-bg:#0B2A21;  --success-text:#5FDDAC;
  --warning:#FF9E1B;   --warning-bg:#33230A;  --warning-text:#FFC062;
  --danger:#F08A8A;    --danger-bg:#331414;   --danger-text:#FF9A9A;
  --info:#6E92FA;      --info-bg:#16244A;

  /* sombra — no escuro, sombra não é penumbra colorida, é preto de verdade */
  --sh-card:0 1px 3px rgba(0,0,0,.45);
  --sh-menu:0 4px 12px rgba(0,0,0,.55);
  --sh-modal:0 12px 32px rgba(0,0,0,.65);
  --overlay:rgba(0,0,0,.72);
  --sidebar-hover-bg:rgba(255,255,255,.08);
}

/* ---------------------------------------------------------------------------
   2. CAMADA DE COMPATIBILIDADE NO ESCURO
   Os nomes antigos são declarados no :root de tokens.css, e propriedade
   personalizada resolve no lugar onde é DECLARADA — trocar --n-50 aqui não
   mexeria no --bg que já foi calculado lá em cima. Por isso a lista inteira é
   redeclarada, com as mesmas expressões: o valor muda porque o token por baixo
   mudou, e nenhuma cor literal precisa aparecer duas vezes.
   --------------------------------------------------------------------------- */
body.dark{
  --bg:            var(--n-50);
  --bg-dark:       var(--n-100);
  --white:         var(--n-0);
  --text:          var(--n-900);
  --text-muted:    var(--n-600);
  --text-light:    var(--n-500);
  --border:        var(--n-200);
  --border-light:  var(--n-100);

  --primary:       var(--blue-500);
  --primary-light: var(--blue-50);

  /* a lateral é o único bloco que precisa descer ABAIXO do fundo da página:
     no claro ela se destaca por ser escura, no escuro, por ser mais escura */
  --sidebar-bg:     #04091A;
  --sidebar-hover:  var(--sidebar-hover-bg);
  --sidebar-active: var(--blue-500);

  --k-yellow:    var(--warning);
  --k-yellow-bg: var(--warning-bg);
  --k-purple:    var(--blue-500);
  --k-purple-bg: var(--blue-50);
  --k-white:     var(--n-0);
  --k-green:     var(--success-text);
  --k-green-bg:  var(--success-bg);
  --k-red:       var(--danger-text);
  --k-red-bg:    var(--danger-bg);
  --k-blue:      var(--blue-700);
  --k-blue-bg:   var(--blue-50);
  --k-violet:    var(--blue-900);
  --k-violet-bg: var(--blue-50);

  --v-turnbim:    var(--blue-500);
  --v-asbuilt:    var(--warning-text);
  --v-coord:      var(--blue-700);
  --v-learning:   var(--blue-900);
  --v-gestartech: var(--n-600);
  --v-inovatech:  var(--success-text);

  --shadow:    var(--sh-card);
  --shadow-md: var(--sh-menu);

  --border-strong: var(--n-300);
  --bg-light:      var(--n-25);
  --bg-subtle:     var(--n-25);
  --primary-bg:    var(--blue-50);
  --k-orange:      var(--warning-text);
  --shadow-sm:     var(--sh-card);
  --shadow-lg:     var(--sh-modal);

  --v-turnbim-bg:    var(--blue-50);
  --v-asbuilt-bg:    var(--warning-bg);
  --v-coord-bg:      var(--blue-50);
  --v-learning-bg:   var(--blue-50);
  --v-gestartech-bg: var(--n-100);
  --v-inovatech-bg:  var(--success-bg);
}

/* ---------------------------------------------------------------------------
   3. BARRA LATERAL
   A lateral já era escura no claro. No escuro ela só afunda um pouco e o
   rótulo de grupo troca de neutro: --n-300 aqui é cor de borda e reprovaria
   como texto (2,3:1 sobre a lateral); --n-500 dá 7,1:1 e continua cinza.
   --------------------------------------------------------------------------- */
body.dark .sidebar{ background:var(--sidebar-bg); }
body.dark .sidebar::-webkit-scrollbar-track{ background:var(--sidebar-bg); }
body.dark .sidebar::-webkit-scrollbar-thumb{ background:var(--n-300); }
body.dark .sidebar::-webkit-scrollbar-thumb:hover{ background:var(--n-500); }
body.dark .sidebar-group-title{ color:var(--n-500); }

/* ---------------------------------------------------------------------------
   4. CAMPOS, MENUS E SOBREPOSIÇÕES
   --------------------------------------------------------------------------- */
body.dark input,
body.dark textarea,
body.dark select,
body.dark .form-input,
body.dark .form-select{
  background:var(--bg-dark);
  color:var(--text);
  border-color:var(--border);
}
body.dark .form-input::placeholder,
body.dark textarea::placeholder{ color:var(--n-500); }

body.dark .modal-overlay{ background:var(--overlay); }
body.dark .col-sort-menu{ box-shadow:var(--sh-menu); }
body.dark .user-dropdown{ box-shadow:var(--sh-menu); }
body.dark .notifications-dropdown{ box-shadow:var(--sh-modal); }
body.dark .toast{ box-shadow:var(--sh-modal); }
body.dark .notif-item.unread{ background:var(--blue-50); }

/* o ícone do alternador continua girando — comportamento, não cor */
body.dark .theme-toggle-icon{ transform:rotate(180deg); }

/* ---------------------------------------------------------------------------
   5. TELAS DE ENTRADA
   Eram três paradas de gradiente roxo. Viraram o Azul Base: bloco nítido,
   assinatura da marca (seção 8).
   --------------------------------------------------------------------------- */
body.dark .login-screen,
body.dark .twofa-screen{ background:var(--brand-base); }
body.dark .market-banner{ background:var(--brand-base); }
body.dark .opp-detail-header{ background:var(--bg-dark); }

/* ---------------------------------------------------------------------------
   6. AVISOS, BANNERS E CALLOUTS
   Cada um destes tinha um gradiente de duas tintas escuras. Agora é a tinta
   suave da própria cor semântica, que no escuro já vem escura.
   --------------------------------------------------------------------------- */
body.dark .alert{ background:var(--danger-bg); }
body.dark .alert-title{ color:var(--danger-text); }
body.dark .alert-desc{ color:var(--n-600); }

body.dark .alert-info{ background:var(--info-bg); }
body.dark .alert-info-title{ color:var(--blue-900); }
body.dark .alert-info-desc{ color:var(--n-600); }

body.dark .callout{ background:var(--warning-bg); color:var(--warning-text); }
body.dark .callout strong{ color:var(--warning-text); }
body.dark .callout.info{ background:var(--info-bg); color:var(--blue-900); }
body.dark .callout.info strong{ color:var(--blue-900); }

body.dark .modal-success-banner{ background:var(--success-bg); }
body.dark .modal-success-banner.perdido{ background:var(--danger-bg); }
body.dark .modal-success-title{ color:var(--success-text); }
body.dark .modal-success-banner.perdido .modal-success-title{ color:var(--danger-text); }

body.dark .schedule-required-banner{ background:var(--warning-bg); color:var(--warning-text); }
body.dark .confirm-qualify-banner{ background:var(--success-bg); }
body.dark .confirm-qualify-info strong{ color:var(--success-text); }
body.dark .confirm-warning{ background:var(--warning-bg); color:var(--warning-text); }
body.dark .twofa-demo-banner{ background:var(--warning-bg); color:var(--warning-text); }
body.dark .twofa-demo-banner strong{ color:var(--warning-text); }
body.dark .import-template-card{ background:var(--blue-50); }
body.dark .contract-fields-section{ background:var(--success-bg); }
body.dark .contract-fields-title{ color:var(--success-text); }
body.dark .week-filter-row{ background:var(--blue-50); }
body.dark .active-filters-bar{ background:var(--primary-light); border-color:var(--primary); }

body.dark .gcal-status{ background:var(--success-bg); color:var(--success-text); }
body.dark .gcal-status-title{ color:var(--success-text); }
body.dark .gcal-add-btn{ background:var(--bg-dark); color:var(--success-text); }

/* ---------------------------------------------------------------------------
   7. CARTÕES DO KANBAN E TEMPERATURA
   O gradiente lateral de 25% que marcava a temperatura no escuro não voltou:
   a etapa 0 já trocou essa faixa por uma borda esquerda de 4 px em token, que
   vale nos dois temas. Sobrou aqui só o que é específico do escuro.
   --------------------------------------------------------------------------- */
body.dark .card-lead-temp.hot{ box-shadow:0 0 0 2px var(--white), 0 2px 6px rgba(0,0,0,.5); }
body.dark .card-lead-temp.warm,
body.dark .card-lead-temp.cold{ box-shadow:0 0 0 2px var(--white); }
body.dark .card-lead-temp.hot{ animation-name:hot-pulse-dark; }

body.dark .card-lead-sister{ background:var(--k-violet-bg); color:var(--k-violet); }
body.dark .card-lead-followup-tag{ background:var(--warning-bg); color:var(--warning-text); }
body.dark .card-lead-origin-tag{ background:var(--success-bg); color:var(--success-text); }

body.dark .opp-detail-temp-badge.hot{ background:var(--warning-bg); color:var(--warning-text); border-color:var(--warning); }
body.dark .opp-detail-temp-badge.warm{ background:var(--warning-bg); color:var(--warning-text); border-color:var(--warning-text); }
body.dark .opp-detail-temp-badge.cold{ background:var(--info-bg); color:var(--blue-900); border-color:var(--blue-500); }

body.dark .temp-filter-chip.active[data-temp="hot"]{ background:var(--warning-bg); color:var(--warning-text); border-color:var(--warning); }
body.dark .temp-filter-chip.active[data-temp="warm"]{ background:var(--warning-bg); color:var(--warning-text); border-color:var(--warning-text); }
body.dark .temp-filter-chip.active[data-temp="cold"]{ background:var(--info-bg); color:var(--blue-900); border-color:var(--blue-500); }
body.dark .temp-filter-count{ background:var(--bg-dark); border-color:var(--border); }
body.dark .temp-filter-chip.active .temp-filter-count{ background:rgba(0,0,0,.35); }

/* ---------------------------------------------------------------------------
   8. LISTAS, TABELAS E ESTADOS DE CONTRATO
   --------------------------------------------------------------------------- */
body.dark .col-count{ background:var(--bg-dark); color:var(--text); }
body.dark .checklist-row > div{ background:transparent; }
body.dark .checklist-tiered-head{ background:var(--bg-dark); }
body.dark .seller-filter-avatar.all-sellers{ background:var(--bg-dark); color:var(--text); }
body.dark .calendar-cell.is-weekend{ background:var(--n-25); }

body.dark .reason-option.selected.ganho{ background:var(--success-bg); border-color:var(--k-green); }
body.dark .reason-option.selected.perdido{ background:var(--danger-bg); border-color:var(--k-red); }

body.dark .contract-status-pill.ativo,
body.dark .contract-status-pill.finalizado{ background:var(--success-bg); color:var(--success-text); }
body.dark .contract-status-pill.assinatura{ background:var(--warning-bg); color:var(--warning-text); }
body.dark .contract-status-pill.desenvolvimento,
body.dark .contract-status-pill.rascunho{ background:var(--blue-50); color:var(--blue-900); }

body.dark #opp-table tbody tr.selected-row{ background:var(--blue-50) !important; }
body.dark .cronograma-table .crono-cell.has-value{ background:var(--blue-100); }
body.dark .cronograma-table tr.crono-row-group .crono-cell.has-value{ background:var(--blue-500); color:var(--n-0) !important; }

/* faixas que terminavam em gradiente lateral viram tinta chapada */
body.dark .turnbim-feature-row.cortesia{ background:var(--warning-bg); }
body.dark .recurrence-row.passthrough{ background:var(--warning-bg); }

/* ---------------------------------------------------------------------------
   9. PREENCHIMENTOS DE MARCA
   No escuro o preenchimento azul é o Céu, e a tinta por cima é a superfície —
   --n-0, que aqui já é escuro. Estas duas regras existiam com cor literal e
   sobrevivem só para trocar o gradiente por bloco.
   --------------------------------------------------------------------------- */
body.dark .plan-total-card.premium{ background:var(--primary); }
body.dark .setup-side[style*="gradient"]{ background:var(--primary) !important; }
body.dark .meta-box.highlight{ background:var(--primary); }
body.dark .kpi-purple{ background:var(--primary); color:var(--n-0); }
body.dark .kpi-yellow{ background:var(--warning); color:var(--brand-base); }
body.dark .kpi-yellow .kpi-big-icon{ color:var(--brand-base); }
body.dark .kpi-white{ background:var(--white); color:var(--text); }
body.dark .wa-card{ background:var(--success); color:var(--brand-base); }