/* ============================================================================
   Sistema visual — Mi Catálogo Digital de Liher (mitiendaenlinea.liher.shop) v1 · 24-oct-2026
   Requiere gt-tokens-v1.css (misma versión que Greentrac/DM/LHESH). Solo presentación.
   IDENTIDAD DE LA VENDEDORA INTACTA: los temas .tema-* (verde, azul, morado, naranja, rosa, gris), su logo, nombre, WhatsApp, precios
   y los archivos que genera para sus clientas no se tocan: toda regla de color de marca queda excluida dentro de .tienda-render y de
   cualquier contenedor/cuerpo con clase tema-*. Solo se unifican los neutros y los controles de la plataforma.
   ========================================================================== */
:root{
  --color-fondo:var(--gt-bg);--color-superficie:var(--gt-surface);--color-texto:var(--gt-ink);--color-texto-suave:var(--gt-muted);
  --color-borde:var(--gt-line);--color-exito:var(--gt-ok);--color-alerta:var(--gt-warn);--color-peligro:var(--gt-err);
  --color-marca:var(--gt-primary);--color-marca-oscuro:var(--gt-primary-h);--color-marca-texto:#fff;
  color-scheme:light}
/* el tablero de herramientas define sus propios tokens locales: se alinean a los compartidos */
:root:root{--lh-rojo:var(--gt-primary-h);--lh-tinta:var(--gt-ink);--lh-suave:var(--gt-muted);--lh-linea:var(--gt-line);--lh-fondo:var(--gt-bg)}
body{background:var(--gt-bg);color:var(--gt-ink)}
/* entrada: título en tinta del sistema y borde inferior del botón en el rojo hover (antes amarillo) */
html body .entrada h1{color:var(--gt-ink)}
html body .entradaBoton{border-bottom:4px solid var(--gt-primary-h)}
/* controles neutros de la plataforma */
body:not([class*="tema-"]) input:not([type=checkbox]):not([type=radio]):not([type=color]):not(.tienda-render input),body:not([class*="tema-"]) select:not(.tienda-render select),body:not([class*="tema-"]) textarea:not(.tienda-render textarea){border-color:var(--gt-line-ctl);border-radius:var(--gt-r-ctl)}
:focus-visible{outline:3px solid var(--gt-focus)!important;outline-offset:2px}
/* botones: principal roja (52px), secundaria blanca con borde */
body:not([class*="tema-"]) .boton-principal:not(.tienda-render .boton-principal){min-height:var(--gt-tap-main);border-radius:var(--gt-r-ctl)}
body:not([class*="tema-"]) .boton-secundario:not(.tienda-render .boton-secundario){background:var(--gt-surface);color:var(--gt-ink);border:1px solid var(--gt-line-ctl);border-radius:var(--gt-r-ctl);min-height:var(--gt-tap)}
.boton-principal:disabled,button:disabled{background:#e9ecef;color:#6b7680;border-color:#d5dadf;opacity:1;cursor:not-allowed}
/* tarjetas */
body:not([class*="tema-"]) .tarjeta:not(.tienda-render .tarjeta){border-radius:var(--gt-r-card);border-color:var(--gt-line)}
/* tablero (herramientas) */
.hMarca{color:var(--gt-primary-h)}
.hTarea{border-radius:var(--gt-r-card)}
/* estados: texto + icono, nunca solo color */
.boton-peligro,.error,.msg-error{color:var(--gt-err)}
/* La tienda pública de una vendedora que NO eligió tema conserva su verde de siempre (no se le impone el rojo de la plataforma) */
.tienda-render:not([class*="tema-"]){--color-marca:#1E6B33;--color-marca-oscuro:#144B23;--color-marca-texto:#FFFFFF}
html body .insignia{color:var(--gt-ink)}