/* styles.css — tema de Shahi Indian (oscuro, rojo de marca + melocotón) */
/* Custom properties */
:root {
  /* Fondo de las páginas interiores (base + logo flotante). Se elige con tokens: */
  --fondo-interior: none;
  --fondo-index-img: none;
  --logo-fondo: url(/images/logo_fondo.webp);
  /* Aside: 5rem superior es ya el estándar de flota (vive en la base) */
  /* Degradado de marca de siempre en las superficies de cristal */
  --color-degradado2: linear-gradient(-45deg, #8e1d15 0%, transparent 45%);
  --blanco: #ffffff;
  --negro: #111111; /* negro de marca (sombras, textos): NO es negro puro */
  --fondo-negro: #000;
  /* Carta: nombres en blanco (tema oscuro), descripciones/precios en amarillo */
  --color-nombre-plato: var(--blanco);
  --color-acento-carta: var(--color-titulo);
  /* Acento del footer (estándar estilo Hippie): en El Ancla, el amarillo de título */
  --color-footer-acento: var(--color-titulo);
  /* Fondo de la app para Safari/iOS (barras y rebote) y tinte de headers */
  --fondo-app: #000; /* negro PURO del fondo de página (evita destellos al cargar) */

  /* TOKENS SEMÁNTICOS DE TEMA — el "interruptor" claro/oscuro */
  --color-texto-tema: var(--blanco); /* texto sobre el fondo de página */
  --color-icono-nav: var(--blanco); /* iconos .icono del aside/headers */
  --halo-texto: 0 0 0.25rem var(--negro), 0 0 0.625rem var(--negro),
    0 0 1.25rem var(--negro); /* halo de legibilidad sobre el cristal */
  /* Rojo del logo (blanco encima 9:1) y melocotón de siempre para títulos y precios (13:1 sobre negro) */
  --color-primario: #8e1d15;
  --color-secundario: #5a120d;
  --color-titulo: #ffbf8f;
  --color-form-borde: rgba(255, 255, 255, 0.4);
  --color-form-borde-focus: rgba(255, 255, 255, 0.3);
  /* Formulario de reservas — tema-aware (el panel y sus textos derivan */
  /* Sin --form-fondo: la base pone el degradado de marca */
  --form-texto: var(--blanco);
  --form-input-fondo: rgba(255, 255, 255, 0.08);
  --form-placeholder: rgba(249, 239, 218, 0.4);
  --form-warning: color-mix(in srgb, var(--color-primario) 55%, #fff);
  --form-datepicker-filtro: invert(1); /* icono del date picker en blanco (oscuro) */
  /* Liquid Glass (cristal estilo Apple Vision Pro — ver biblioteca */
  --lg-bg-color: rgba(0, 0, 0, 0.4); /* tinte del cristal (ahumado/oscuro) */
  --lg-highlight: rgba(255, 255, 255, 0.75); /* brillo especular interno */
  --lg-blur: 0.25rem; /* desenfoque del fondo */

  /* Sombras */
  --sombra: 0.1875rem 0.1875rem 0.25rem #fff, -0.1875rem -0.1875rem 0.25rem var(--negro);
  /* Botones */
  --border-radius: 1.25rem;
  /* Tipografía */
  --tipo-principal: "Roboto", sans-serif;
}

/* TEMA CLARO — ESTÁNDAR DE FLOTA (Manu, 9 ago 2026, criterio The Vu) */

/* Las REGLAS de componentes (formulario de reservas, botones, WhatsApp, luces, */