/* =====================================================================
   Platyca · versión oscura (botón ◐). Sólo colores del manual de marca:
   Navy #0B1F33 de fondo, Crema #F8F7F4 de texto, Teal/Amarillo/Mandarina/Lila de acento.
   Se activa con <html data-theme="dark"> (tema.js) y se recuerda en este navegador.
   ===================================================================== */
html[data-theme="dark"]{
  color-scheme:dark;
  --navy:#F8F7F4; --navy-80:#E2E7EC; --navy-60:#AEBBC8; --navy-40:#8494A6; --navy-15:#2A4560;
  --crema:#0B1F33; --teal-50:#0F3A47; --teal-700:#41D4DA; --ok:#4FD1A0; --mal:#FF9466;
  --sombra:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.35);
  --sup:#132B44; --sup-2:#18344F; --hondo:#06121F;
}
html[data-theme="dark"] body{background:var(--crema);color:var(--navy)}
/* superficies que eran blancas */
html[data-theme="dark"] :is(.tarjeta,.pasos li,.caja.clara,.sellos li,details,.tarjeta-form,.perfil,.docs,.confirmar,.grupo-op .chk,
  .login-card,.panel,.kpi,.b,.chip,.tabs button.on,.lado a.on .cnt,dialog,#dlg-f){background:var(--sup);color:var(--navy)}
html[data-theme="dark"] :is(input,select,textarea){background:var(--sup-2);color:var(--navy);border-color:var(--navy-15)}
html[data-theme="dark"] input::placeholder{color:var(--navy-40)}
html[data-theme="dark"] .segm .op:has(input:checked){background:var(--teal-50)}
/* superficies que eran navy: más hondas que el fondo para seguir contrastando */
html[data-theme="dark"] :is(.franja,.caja.oscura,.form-sec,.lado,.login,#toast){background:var(--hondo);color:#F8F7F4}
html[data-theme="dark"] :is(.btn-osc,.b.osc,.chip.on){background:var(--teal);color:#0B1F33}
html[data-theme="dark"] .btn-sec{color:var(--navy);box-shadow:inset 0 0 0 1.5px var(--navy)}
html[data-theme="dark"] .btn-pri{color:#0B1F33}
/* avisos, bandas y etiquetas (pasteles → tintes oscuros de la misma familia) */
html[data-theme="dark"] :is(.aviso,.banda){background:#3A3112;border-color:var(--amarillo);color:var(--navy)}
html[data-theme="dark"] :is(.aviso.mal,.banda.mal,.b.mal){background:#3E2216;border-color:var(--mandarina);color:#FFB596}
html[data-theme="dark"] .banda.ok{background:#12352A;border-color:#2F7D62}
html[data-theme="dark"] .tag{background:#22405C;color:var(--navy-80)}
html[data-theme="dark"] :is(.tag.ok,.pill.ok){background:#12352A;color:var(--ok)}
html[data-theme="dark"] .tag.mal{background:#3E2216;color:var(--mal)}
html[data-theme="dark"] .tag.ate{background:#3A3112;color:var(--amarillo)}
html[data-theme="dark"] .tag.lila{background:#2A2150;color:#C3B3FF}
html[data-theme="dark"] :is(th,.check li,.resumen){background:var(--sup-2)}
html[data-theme="dark"] :is(th,td){border-color:var(--navy-15)}
html[data-theme="dark"] tr.clic:hover td{background:#1B3A57}
html[data-theme="dark"] .progreso-w{background:var(--crema)}
html[data-theme="dark"] .doc-vista{border-color:var(--navy-15)}
/* logos: versión clara sobre fondo oscuro */
html[data-theme="dark"] .marca img{content:url(../logo-platyca-claro.svg?v=2)}
/* el botón */
.tema-btn{position:fixed;right:14px;bottom:14px;z-index:50;width:44px;height:44px;border-radius:50%;border:0;cursor:pointer;
  background:var(--navy);color:var(--crema);font-size:20px;line-height:44px;text-align:center;box-shadow:var(--sombra)}
.tema-btn:focus-visible{outline:3px solid var(--teal);outline-offset:2px}
@media print{.tema-btn{display:none}}
html[data-theme="dark"] .top{background:rgba(11,31,51,.92)}
.tema-btn{font-size:18px}
