/* ============================================================
   Ajustes que os tokens sozinhos não resolvem no tema claro:
   elementos desenhados para brilhar sobre fundo escuro.
   ============================================================ */

:root[data-theme="light"] .nav{color:#4a5170}
:root[data-theme="light"] .nav .ic{color:#7a819f}
:root[data-theme="light"] .nav:hover{background:rgba(19,22,40,.05);color:var(--txt)}
:root[data-theme="light"] .nav:hover .ic{color:var(--txt)}
:root[data-theme="light"] .nav.on{
  color:#fff;background:linear-gradient(95deg,var(--acc),var(--acc2));border-color:transparent;
  box-shadow:0 6px 16px -6px rgba(125,92,255,.6)}
:root[data-theme="light"] .nav.on .ic{color:#fff}
:root[data-theme="light"] .navgrp{color:#9098b4}
:root[data-theme="light"] .side .foot small{color:#8a90ab}

/* título em gradiente: o branco do dark vira grafite */
:root[data-theme="light"] .hero h2{
  background:linear-gradient(96deg,#1b1f36 10%,#5a3fd6 55%,#1f57c9 95%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* botões e controles */
:root[data-theme="light"] .btn{background:#fff;border-color:var(--line2);color:#2a2f4a}
:root[data-theme="light"] .btn:hover{background:#f4f5fb;border-color:rgba(19,22,40,.3)}
:root[data-theme="light"] .iconbtn{background:#fff;border-color:var(--line2);color:#5a6180}
:root[data-theme="light"] .iconbtn:hover{background:#f4f5fb;color:var(--txt)}
:root[data-theme="light"] .btn.pri{
  background:linear-gradient(120deg,var(--acc),var(--acc2));border-color:transparent;color:#fff}
:root[data-theme="light"] .btn.ok{
  background:linear-gradient(120deg,#18b877,#2fd48f);border-color:transparent;color:#04231a}
:root[data-theme="light"] .btn.dang{
  background:linear-gradient(120deg,#d33c50,#ff6b7d);border-color:transparent;color:#fff}
:root[data-theme="light"] .btn.pri:hover,
:root[data-theme="light"] .btn.ok:hover,
:root[data-theme="light"] .btn.dang:hover{filter:brightness(1.08)}
:root[data-theme="light"] input,
:root[data-theme="light"] select,
:root[data-theme="light"] textarea{background-color:#fff;border-color:var(--line2)}
:root[data-theme="light"] input:focus,
:root[data-theme="light"] select:focus,
:root[data-theme="light"] textarea:focus{background-color:#fff}
:root[data-theme="light"] select option{background-color:#fff;color:var(--txt)}
:root[data-theme="light"] select{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235a6180' stroke-width='2.4' stroke-linecap='round'><path d='m6 9 6 6 6-6'/></svg>");
  background-repeat:no-repeat;background-position:right 12px center}
:root[data-theme="light"] .fbar select{background-position:right 11px center}

/* superfícies que no dark eram brancas translúcidas */
:root[data-theme="light"] .card,
:root[data-theme="light"] .kpi,
:root[data-theme="light"] .mini,
:root[data-theme="light"] .steps{background-color:#fff}
:root[data-theme="light"] .kcol{background:rgba(19,22,40,.035)}
:root[data-theme="light"] .pc,
:root[data-theme="light"] .cl,
:root[data-theme="light"] .route,
:root[data-theme="light"] .next,
:root[data-theme="light"] .radio{background-color:#fff}
:root[data-theme="light"] .pc:hover{background-color:#fbfbff}
:root[data-theme="light"] .mdl{box-shadow:0 40px 90px -34px rgba(30,38,70,.45)}
:root[data-theme="light"] .ovl{background:rgba(230,232,244,.72)}
:root[data-theme="light"] .fpop{box-shadow:0 20px 50px rgba(30,38,70,.22)}
:root[data-theme="light"] .notif pre{background:#f4f5fb;color:#2a2f4a}

/* chips e pílulas: no claro o texto escurece, o tint fica */
:root[data-theme="light"] .tag,
:root[data-theme="light"] .pc .met span,
:root[data-theme="light"] .kh .n{background:rgba(19,22,40,.055);color:#5a6180;border-color:var(--line)}
:root[data-theme="light"] .p-draft{background:rgba(19,22,40,.06);color:#5a6180}
:root[data-theme="light"] tbody tr:hover{background:rgba(19,22,40,.035)}
:root[data-theme="light"] .kempty{color:#8a90ab}

/* chips com cor própria voltam a ter cor — a regra neutra acima é só para os sem classe */
:root[data-theme="light"] .pc .met span.nf{background:var(--acc-bg);border-color:var(--acc-bd);color:var(--acc-fg)}
:root[data-theme="light"] .pc .met span.late{background:var(--dang-bg);border-color:var(--dang-bd);color:var(--dang-fg)}
:root[data-theme="light"] .pc .met span.cmp{background:var(--ok-bg)!important;border-color:var(--ok-bd)!important;color:var(--ok-fg)!important}
:root[data-theme="light"] .pc .met span.ontime{background:var(--ok-bg);border-color:var(--ok-bd);color:var(--ok-fg)}
:root[data-theme="light"] .pc .met span.rec{background:rgba(61,123,255,.13)!important;border-color:rgba(31,87,201,.3)!important;color:var(--acc2-fg)!important}
:root[data-theme="light"] .pc .met span.cc{font-weight:650}
:root[data-theme="light"] .tag.fix{background:var(--ok-bg);border-color:var(--ok-bd);color:var(--ok-fg)}

/* verdes/amarelos vivos do dark não têm contraste sobre branco */
:root[data-theme="light"] .step.done,
:root[data-theme="light"] .step.done b,
:root[data-theme="light"] .trk div.done i{color:var(--ok-fg)}
:root[data-theme="light"] .step.on{background:var(--acc-bg);border-color:var(--acc-bd);color:var(--txt)}
:root[data-theme="light"] .step.on b{color:var(--acc-fg)}
:root[data-theme="light"] .badge{color:var(--acc-fg)}
:root[data-theme="light"] .note{color:#3d2f8c}
:root[data-theme="light"] .warnbox{color:#8c1f30}
:root[data-theme="light"] .warnbox b{color:#5c0f1c}
:root[data-theme="light"] .mini.glow{background:linear-gradient(160deg,rgba(125,92,255,.12),rgba(255,255,255,.6))}
:root[data-theme="light"] .route.rec{background:linear-gradient(160deg,rgba(125,92,255,.10),#fff)}
:root[data-theme="light"] .imp{background:linear-gradient(150deg,rgba(125,92,255,.09),rgba(255,255,255,.5))}
:root[data-theme="light"] .doc{border-color:rgba(19,22,40,.14)}

/* textos fixos em branco que só funcionavam sobre fundo escuro
   (os que ficam sobre gradiente de marca — botões, avatares, ícone ativo — seguem brancos) */
:root[data-theme="light"] .trk div.on{color:var(--txt)}
:root[data-theme="light"] .note b,
:root[data-theme="light"] .criado b,
:root[data-theme="light"] .mdl .infobox b{color:var(--txt)}
:root[data-theme="light"] .pc .act button:hover{color:var(--txt)}
:root[data-theme="light"] .esch:hover,
:root[data-theme="light"] .esch.open{color:var(--acc-fg);background:var(--acc-bg)}
:root[data-theme="light"] .tk .mt a.lk:hover{color:#fff;background:var(--acc2)}
