/* ============================================================
   GVenue — Theme overrides (claro / oscuro / blue-cut)
   Cargar DESPUÉS de tokens.css. Oscuro = default (tokens :root).
   Solo se sobreescriben superficies, tinta y líneas; los acentos
   (signal/violet/status) se mantienen salvo ajuste de legibilidad.
   ============================================================ */

/* ---- CLARO (fondo blanco, tinta oscura) ---- */
:root[data-theme="light"] {
  --bg:           #F7F7F4;
  --bg-deep:      #ECECE7;
  --surface:      #FFFFFF;
  --surface-2:    #F2F2ED;
  --surface-3:    #E8E8E1;
  --line:         #DCDCD3;
  --line-soft:    #E6E6DF;
  --line-strong:  #C4C4B9;

  --ink:          #15151A;
  --ink-soft:     #3A3A42;
  --ink-mute:     #62626C;
  --ink-fade:     #9A9AA2;

  /* teal más oscuro: legible como texto Y como fondo de botón (texto #001813) */
  --signal:       #0E9C88;
  --signal-soft:  #0E9C8818;
  --signal-line:  #0E9C8855;
  --violet:       #6E47E0;

  --shadow-1: 0 1px 0 rgba(0,0,0,.02) inset, 0 1px 2px rgba(0,0,0,.10);
  --shadow-2: 0 1px 0 rgba(0,0,0,.03) inset, 0 8px 24px rgba(0,0,0,.12);
  --glow-signal: 0 0 0 1px var(--signal-line);
  --glow-violet: 0 0 0 1px #6E47E055;
}

/* ---- BLUE CUT (navy profundo, descansa la vista de noche) ---- */
:root[data-theme="blue"] {
  --bg:           #0A1020;
  --bg-deep:      #070B16;
  --surface:      #111A2E;
  --surface-2:    #16213A;
  --surface-3:    #1E2B48;
  --line:         #243353;
  --line-soft:    #1A2540;
  --line-strong:  #324466;

  --ink:          #EAF0FB;
  --ink-soft:     #BDC8DE;
  --ink-mute:     #8290AC;
  --ink-fade:     #545F78;
}

/* ============================================================
   Switcher flotante (inyectado por theme.js). Usa las variables
   activas → se ve bien en los 3 temas.
   ============================================================ */
#gv-theme {
  position: fixed; right: 14px; bottom: 14px; z-index: 9999;
  display: flex; gap: 2px; padding: 4px;
  background: var(--surface-2); border: 1px solid var(--line-strong);
  border-radius: var(--r-full); box-shadow: var(--shadow-2);
  font-family: var(--font-mono); font-size: 11px;
}
#gv-theme button {
  all: unset; cursor: pointer; padding: 6px 11px; border-radius: var(--r-full);
  color: var(--ink-mute); line-height: 1; letter-spacing: .04em;
  display: inline-flex; align-items: center; gap: 5px;
}
#gv-theme button:hover { color: var(--ink-soft); }
#gv-theme button[aria-pressed="true"] {
  background: var(--signal); color: #001813; font-weight: 600;
}
/* Inputs/controles: usar la superficie de control (no el fondo de página) en TODAS las
   pantallas → así no quedan desfasados sobre las tarjetas (sobre todo en tema claro). El
   selector `body X` gana a las reglas `input{background:var(--bg)}` inline de cada página
   sin !important; los inputs con estilo propio (clase o inline) quedan intactos. */
body input, body select, body textarea { background: var(--surface-2); }

@media print { #gv-theme { display: none; } }
/* Mobile: achicar el switcher y dejar aire bajo el pie para que no tape el texto del footer. */
@media (max-width: 600px) {
  #gv-theme { bottom: 10px; right: 10px; padding: 3px; font-size: 10px; }
  #gv-theme button { padding: 5px 9px; }
  footer { padding-bottom: 60px; }
}

/* ============================================================
   Vidriera (landing.css) — puntos con color OSCURO hardcodeado que
   no salen de las variables. Solo overrides para claro/blue; el dark
   default queda intacto (riesgo cero sobre el look actual de prod).
   ============================================================ */
:root[data-theme="light"] .lp-nav { background: rgba(247,247,244,0.85); }
:root[data-theme="light"] .lp-price.featured { background: linear-gradient(180deg, #E6FAF4 0%, var(--surface) 60%); }
:root[data-theme="light"] .lp-final { background: linear-gradient(180deg, #E6FAF4 0%, #F0F0EA 100%); }
:root[data-theme="light"] .lp-preview-bar .dots i { background: #C6C6BC; }

:root[data-theme="blue"] .lp-nav { background: rgba(10,16,32,0.85); }
:root[data-theme="blue"] .lp-price.featured { background: linear-gradient(180deg, #0E2138 0%, var(--surface) 60%); }
:root[data-theme="blue"] .lp-final { background: linear-gradient(180deg, #0E2138 0%, #070B16 100%); }
:root[data-theme="blue"] .lp-preview-bar .dots i { background: #324466; }