/* its-komori.com — TEMA (claro / escuro / automático), 2026-10-30.
   Fonte única dos TOKENS do site. Doc para outras frentes (/kocad, wiki): /opt/koreos-ai-shared/SITE-TEMA-TOKENS.md
   - <html data-theme="light|dark" data-theme-pref="light|dark|auto"> é aplicado no <head> antes da pintura (includes/header.php).
   - Este arquivo: tokens + seletor + ajustes feitos à mão. O grosso do escuro das páginas antigas é GERADO em
     site-theme-dark.css (não editar à mão; regerar com qa/gen-dark.js). */

/* ── Tokens ─────────────────────────────────────────────────────────────── */
:root{
  --ks-bg:#ffffff; --ks-bg-soft:#f2f6f8; --ks-surface:#ffffff; --ks-surface-2:#f5f8fb; --ks-overlay:rgba(255,255,255,.92);
  --ks-ink:#102e4a; --ks-ink-2:#3f5a70; --ks-muted:#5b7186; --ks-line:#dce5eb; --ks-line-2:#c3d2de;
  --ks-accent:#076fa7; --ks-accent-2:#0b8fd0; --ks-accent-ink:#ffffff; --ks-link:#0a64a0; --ks-focus:#0ea5e9;
  --ks-ok:#13805a; --ks-warn:#9a6200; --ks-danger:#b42318;
  --ks-shadow:0 18px 44px -18px rgba(16,46,74,.28); --ks-radius:12px;
  --ks-hero-ink:#ffffff;            /* texto sobre foto/faixa escura: igual nos dois temas */
}
html[data-theme="dark"]{
  --ks-bg:#0b1220; --ks-bg-soft:#0f1a2b; --ks-surface:#111c2e; --ks-surface-2:#16233a; --ks-overlay:rgba(11,18,32,.92);
  --ks-ink:#e6eef7; --ks-ink-2:#b9c9da; --ks-muted:#93a7bc; --ks-line:#22344d; --ks-line-2:#2e4664;
  --ks-accent:#5cc1f0; --ks-accent-2:#86d3f6; --ks-accent-ink:#04121f; --ks-link:#7cccf3; --ks-focus:#7cccf3;
  --ks-ok:#46d39a; --ks-warn:#f0bf5a; --ks-danger:#ff8a80;
  --ks-shadow:0 18px 44px -18px rgba(0,0,0,.6);
  color-scheme:dark; background:var(--ks-bg);
}
/* variáveis antigas do site apontam para os tokens no escuro (style.css usa --text-color/--white/...) */
html[data-theme="dark"] body{
  --text-color:var(--ks-ink); --light-text:var(--ks-ink-2); --border-color:var(--ks-line);
  background-color:var(--ks-bg); color:var(--ks-ink);
}
html.ks-theme-switching,html.ks-theme-switching *,html.ks-theme-switching *::before,html.ks-theme-switching *::after{transition:none!important}

/* ── Seletor (na faixa azul do topo, ao lado do idioma) ─────────────────── */
.ks-theme{display:inline-flex;align-items:center;gap:2px;margin:0 10px 0 0;padding:3px;border:1px solid rgba(255,255,255,.28);border-radius:999px;background:rgba(0,0,0,.14)}
html:not([data-theme]) .ks-theme{display:none}
.ks-theme__btn{display:inline-grid;place-items:center;width:30px;height:28px;padding:0;border:0;border-radius:999px;background:transparent;color:rgba(255,255,255,.82);cursor:pointer;transition:background .15s,color .15s}
.ks-theme__btn svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ks-theme__btn[data-theme-set="dark"] svg path{fill:currentColor;stroke:none}
.ks-theme__btn .ks-theme__half{fill:currentColor;stroke:none;opacity:.55}
.ks-theme__btn:hover{background:rgba(255,255,255,.14);color:#fff}
.ks-theme__btn[aria-checked="true"]{background:#fff;color:#0b4f86}
.ks-theme__btn:focus-visible{outline:2px solid #fff;outline-offset:2px}
html[data-theme="dark"] .ks-theme{border-color:rgba(255,255,255,.18);background:rgba(0,0,0,.25)}
html[data-theme="dark"] .ks-theme__btn[aria-checked="true"]{background:#e6eef7;color:#0b1220}
@media (max-width:640px){.ks-theme{margin-right:6px}.ks-theme__btn{width:30px;height:30px}}

/* ── Logo: versão clara no escuro ───────────────────────────────────────── */
.site-brand-image--on-dark{display:none!important}
html[data-theme="dark"] .site-brand-image--on-light{display:none!important}
html[data-theme="dark"] .site-brand-image--on-dark{display:block!important}

/* ── Base do escuro ─────────────────────────────────────────────────────── */
html[data-theme="dark"] ::selection{background:#1d4f7a;color:#fff}
html[data-theme="dark"] input,html[data-theme="dark"] select,html[data-theme="dark"] textarea{color-scheme:dark}
html[data-theme="dark"] input::placeholder,html[data-theme="dark"] textarea::placeholder{color:#8196ac;opacity:1}
html[data-theme="dark"] img[src$=".svg"].ks-invert-dark{filter:invert(1) hue-rotate(180deg)}

/* ── Contraste AA (vale nos DOIS temas) ─────────────────────────────────── */
/* botão principal: o gradiente antigo #0ea5e9→#38bdf8 dava 2,4:1 com texto branco */
.btn:not(.btn-secondary):not(.btn-light):not(.btn-outline){background-image:linear-gradient(135deg,#0369a1 0%,#0676b3 100%)}
.btn:not(.btn-secondary):not(.btn-light):not(.btn-outline):hover{color:#fff}

/* ── Fotos de produto com fundo branco (mix-blend multiply): no escuro ganham "estúdio" claro ── */
html[data-theme="dark"] .kbf-hero-media,html[data-theme="dark"] .kf-product-feature figure,html[data-theme="dark"] .ke-catalog-picture{background:radial-gradient(120% 90% at 50% 35%,#f7f9fb 0%,#dfe6ee 100%);border-radius:10px}
/* rodapé: card "Relatório de segurança" (#94a3b8 sobre #143d64 dava 4,3:1) */
.footer-trust-report,.footer-trust-report strong,.footer-trust-report small{color:#dbe5f0!important}
.footer-trust-report small{opacity:.92}
/* números dos artigos legais, cabeçalho da tabela de vagas, avatar do CEO, selo/botão do KoLite: fundos mais fundos p/ texto branco */
.privacy-article__num{background:#0b7f86!important}
.vagas-strategy-table__head{background:#0a6fa3!important}
.about-ceo-card__avatar{background:#0b6aa0!important;color:#fff!important}
.klp-gtag{background-color:#0b7a70!important}

/* ── Ajustes do escuro (o que o gerador não alcança: estilo inline, cor por produto) ── */
html[data-theme="dark"] .kf-product-feature figure figcaption,html[data-theme="dark"] .ke-catalog-picture figcaption{color:#3f5a70}
html[data-theme="dark"] .klp-btn--primary{color:#fff!important}
html[data-theme="dark"] .ks-btn--primary{background:#5cc9e8!important;border-color:#5cc9e8!important;color:#04121f!important}
html[data-theme="dark"] .ks-btn--primary *{color:inherit!important}
html[data-theme="dark"] .kgy-btn-primary{background:#2c6690!important}
html[data-theme="dark"] .kgy-btn-primary{color:#fff!important}
html[data-theme="dark"] .klp-plan__feats li{color:var(--ks-ink-2)}
html[data-theme="dark"] .klp-badge{color:var(--ks-accent-2)!important}
html[data-theme="dark"] a[href*="koreos-company"][style*="--kd"]{color:var(--ks-accent-2)!important}
html[data-theme="dark"] [style*="--ksw-accent"] .material-icons,html[data-theme="dark"] .ksw-kicker,html[data-theme="dark"] [style*="--ksw-accent"]>small{color:color-mix(in srgb,var(--ksw-accent,#5cc1f0) 40%,#fff)!important}
html[data-theme="dark"] .commerce-office-photo figcaption,html[data-theme="dark"] .commerce-office-photo figcaption strong{color:var(--ks-muted)}
/* cores escritas direto no HTML (style="…") */
html[data-theme="dark"] [style*="color:#0f172a"],html[data-theme="dark"] [style*="color: #444"],html[data-theme="dark"] [style*="color: #666"]{color:var(--ks-ink-2)!important}
html[data-theme="dark"] [style*="color:#64748b"],html[data-theme="dark"] [style*="color: #999"]{color:var(--ks-muted)!important}
html[data-theme="dark"] [style*="color:#b42318"]{color:var(--ks-danger)!important}
html[data-theme="dark"] [style*="background: white"],html[data-theme="dark"] [style*="background:#f4f6f9"]{background:var(--ks-surface)!important}
html[data-theme="dark"] [style*="color:var(--kd)"]{color:var(--ks-accent-2)!important}
html[data-theme="dark"] [style*="color: #3b5998"],html[data-theme="dark"] [style*="color: #0077b5"]{color:#8fb4ff!important}
/* ícones/logos de app com fundo transparente: no escuro ganham uma base clara (o "K" azul-marinho não some) */
html[data-theme="dark"] .ks-card__icon,html[data-theme="dark"] img[src*="/brands/"]:not(.ks-keep-dark){background:#f4f7fa;border-radius:22%;box-shadow:0 0 0 1px rgba(255,255,255,.08)}
/* logo dentro do menu aberto (img colocada pelo JS) */
html[data-theme="dark"] .ke-menu-head>a img{filter:brightness(0) invert(1)}
html[data-theme="dark"] .ke-menu-head>a{color:#e6eef7}

/* ── Contraste AA no CLARO (problemas que já existiam: azul-céu #0ea5e9 / cinza #94a3b8 como texto sobre branco) ── */
html:not([data-theme="dark"]) .header-panel-link,html:not([data-theme="dark"]) .header-panel-link .material-icons{color:#0369a1}
html:not([data-theme="dark"]) .privacy-doc li a,html:not([data-theme="dark"]) .privacy-doc li .material-icons,html:not([data-theme="dark"]) .privacy-doc dd a,
html:not([data-theme="dark"]) .privacy-cta .btn-outline{color:#0369a1}
html:not([data-theme="dark"]) .privacy-updated,html:not([data-theme="dark"]) .commerce-price-break,html:not([data-theme="dark"]) td.is-no{color:#5b6b80}
html:not([data-theme="dark"]) .about-jp-timeline__year,
html:not([data-theme="dark"]) .vagas-strategy-table__cell strong,html:not([data-theme="dark"]) .jp-card__icon .material-icons,
html:not([data-theme="dark"]) .jp-card__icon-wrap .material-icons{color:#0369a1}
html:not([data-theme="dark"]) .legal-hub-card small{color:#5b7186}
