/* =========================================================================
   TEMA DE MARCA — PROVISIONAL
   -------------------------------------------------------------------------
   Este archivo es la ÚNICA fuente de verdad visual del proyecto.
   Lo consumen la landing pública y las cuatro superficies del sistema
   (punto de venta, cocina, caja y administración).

   Para vestir el proyecto con la marca real basta con:
     1. Cambiar los valores de color y las dos tipografías de este archivo.
     2. Actualizar /assets/marca/marca.json (nombre, contacto, horarios).
     3. Dejar los logotipos en /assets/logos/ con los mismos nombres.

   Regla: ningún color literal debe existir fuera de este archivo.
   Paleta: dorado del logotipo LM sobre tinta cálida y papel hueso.
   El dorado está tomado del monograma que envió la Dirección; se afina
   cuando llegue el archivo vectorial del logotipo.
   ========================================================================= */

:root {
  /* ---------- Color: base ---------- */
  --c-tinta:        #16150f;  /* casi negro cálido: texto y fondos oscuros */
  --c-tinta-suave:  #3a382e;
  --c-hueso:        #f7f4ec;  /* blanco hueso, color de papel */
  --c-hueso-hondo:  #eee9dc;
  --c-piedra:       #8a8275;  /* texto secundario sobre claro */
  --c-piedra-clara: #c8c1b1;  /* texto secundario sobre oscuro */
  --c-linea:        #dcd5c4;

  /* ---------- Color: acento — dorado del logotipo LM ---------- */
  --c-acento:       #d6ad66;  /* el dorado exacto del logotipo que envió la Dirección */
  --c-acento-claro: #e3c288;
  --c-acento-hondo: #a07d40;

  /* ---------- Color: estado (lo usa sobre todo el sistema) ---------- */
  --c-ok:      #2e7d5b;
  --c-alerta:  #b8862b;
  --c-urgente: #b3402f;
  --c-info:    #3b6c93;

  /* ---------- Roles semánticos: superficie clara ---------- */
  --fondo:            var(--c-hueso);
  --fondo-elevado:    #ffffff;
  --fondo-hundido:    var(--c-hueso-hondo);
  --texto:            var(--c-tinta);
  --texto-suave:      var(--c-piedra);
  --texto-invertido:  var(--c-hueso);
  --borde:            var(--c-linea);
  --acento:           var(--c-acento);

  /* ---------- Tipografía ---------- */
  --f-display: "Cormorant Garamond", "Hoefler Text", Garamond, "Times New Roman", serif;
  --f-texto:   "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --f-mono:    ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  /* Cifras: en una cuenta las columnas de importes tienen que alinearse. */
  --f-cifra:   "Inter", ui-monospace, "SF Mono", Menlo, monospace;

  --peso-fino: 300;
  --peso-normal: 400;
  --peso-medio: 500;
  --peso-fuerte: 600;

  /* Escala fluida — móvil primero */
  --t-micro:  clamp(0.6875rem, 0.66rem + 0.14vw, 0.75rem);
  --t-menor:  clamp(0.8125rem, 0.78rem + 0.17vw, 0.875rem);
  --t-base:   clamp(0.9375rem, 0.90rem + 0.19vw, 1.0625rem);
  --t-mayor:  clamp(1.125rem, 1.05rem + 0.36vw, 1.375rem);
  --t-h3:     clamp(1.375rem, 1.20rem + 0.85vw, 2rem);
  --t-h2:     clamp(1.875rem, 1.45rem + 2.1vw, 3.25rem);
  --t-h1:     clamp(2.5rem, 1.60rem + 4.5vw, 5.5rem);
  --t-gigante:clamp(3.25rem, 1.80rem + 7.2vw, 8rem);

  --interlinea-apretada: 1.08;
  --interlinea-titulo:   1.16;
  --interlinea-texto:    1.65;
  --espaciado-versal:    0.18em;   /* para rótulos en versalitas tipo "LA CARTA" */

  /* ---------- Ritmo y espacio ---------- */
  --e-1: 0.25rem;  --e-2: 0.5rem;   --e-3: 0.75rem;  --e-4: 1rem;
  --e-5: 1.5rem;   --e-6: 2rem;     --e-7: 3rem;     --e-8: 4.5rem;
  --e-9: 7rem;     --e-10: 9rem;    --e-11: 11rem;

  --ancho-texto:  min(100% - 2.5rem, 62ch);
  --ancho-medio:  min(100% - 2.5rem, 60rem);
  --ancho-ancho:  min(100% - 2.5rem, 80rem);

  --radio-0: 0;
  --radio-1: 2px;   /* casi recto: en la landing lee más caro que el redondeado */
  --radio-2: 6px;
  --radio-3: 12px;
  --radio-redondo: 999px;

  /* ---------- Sombra ---------- */
  --sombra-1: 0 1px 2px rgba(22,21,15,.06), 0 2px 8px rgba(22,21,15,.05);
  --sombra-2: 0 2px 6px rgba(22,21,15,.08), 0 12px 32px rgba(22,21,15,.10);
  --sombra-3: 0 18px 50px -12px rgba(22,21,15,.30);

  /* ---------- Movimiento ---------- */
  --ms-rapido: 240ms;
  --ms-medio:  460ms;
  --ms-lento:  900ms;
  --ms-muy-lento: 1400ms;
  --curva:        cubic-bezier(.22,.61,.36,1);
  --curva-suave:  cubic-bezier(.33,0,.15,1);
  --curva-salida: cubic-bezier(.16,1,.3,1);

  /* ---------- Sistema (tableta y cocina): objetivo táctil ---------- */
  /* Un mesero con las manos ocupadas no atina a un botón de 32 px. */
  --toque-min: 48px;
  --toque-comodo: 64px;
}

/* Superficie oscura. La cocina y el punto de venta trabajan en oscuro:
   cansa menos en turnos de ocho horas y se lee mejor de lejos. */
.tema-oscuro,
:root[data-tema="oscuro"] {
  --fondo:           var(--c-tinta);
  --fondo-elevado:   var(--c-tinta-suave);
  --fondo-hundido:   #0e0d09;
  --texto:           var(--c-hueso);
  --texto-suave:     var(--c-piedra-clara);
  --texto-invertido: var(--c-tinta);
  --borde:           #46433a;
  --acento:          var(--c-acento-claro);
}

/* Respeto absoluto a quien pide menos movimiento. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --ms-rapido: 1ms; --ms-medio: 1ms; --ms-lento: 1ms; --ms-muy-lento: 1ms;
  }
  *, *::before, *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 1ms !important;
    scroll-behavior: auto !important;
  }
}