/* Tokens visuales de la marca: ÚNICA fuente de verdad de colores y tipografías.
   Se carga ANTES que base.css en cada página, así todo pinta desde el primer frame
   (sin flash blanco esperando a JavaScript). marca.js no toca colores: solo textos. */
@import url('https://fonts.googleapis.com/css2?family=Anton&family=Plus+Jakarta+Sans:wght@400;600;700;800&display=swap');

:root {
  /* Paleta */
  --color-primario: #F5A623;        /* naranja relleno: botones, acentos */
  --color-primario-texto: #B0670A;  /* naranja para texto sobre fondo claro */
  --color-exito: #23B45D;           /* verde: lista / entregado */
  --color-tarjeta: #FFF8EA;         /* fondo de tarjetas */
  --color-fondo: #FFFFFF;           /* fondo de página (cliente y cocina) */
  --color-texto: #2C2C2A;
  --color-error: #C62828;           /* rojo: errores de validación. PROPUESTA, ajustar. */

  /* Neutros derivados de la paleta (bordes, fondos sutiles, sombras). */
  --color-borde: #E3DCCB;
  --color-sutil: #F3EFE6;
  --sombra: 0 8px 28px rgba(44, 44, 42, 0.14);

  /* Tipografías */
  --fuente-titulos: 'Anton', 'Impact', 'Arial Narrow', sans-serif;
  --fuente-cuerpo: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;

  /* Panel de repartidor: tema oscuro. PROPUESTA derivada de la paleta, ajustar. */
  --oscuro-fondo: #1C1B19;
  --oscuro-tarjeta: #2A2926;
  --oscuro-texto: #FFF8EA;
}
