/*
 * ─────────────────────────────────────────────────────────────
 *  DISEÑO DE ESTA TIENDA
 *  Colores, tipografías y bordes del cliente. Se carga después del CSS
 *  de grow-theme y reemplaza sus valores: no hay que recompilar nada,
 *  basta con guardar y recargar.
 *
 *  Lo que borres o dejes comentado usa el valor por defecto del tema.
 *  ("html:root" es a propósito: así siempre le gana al tema.)
 * ─────────────────────────────────────────────────────────────
 */

html:root {
  /* Marca Bess Clean */
  --color-brand-primary: #051c38; /* azul marino: botones, enlaces, footer */
  --color-brand-primary-hover: #031326; /* azul más oscuro */
  --color-brand-on-primary: #ffffff; /* texto sobre el azul */
  --color-brand-secondary: #082f60; /* azul de los íconos y títulos de beneficios */
  --color-brand-on-secondary: #ffffff;
  --color-brand-accent: #f8df00; /* amarillo: destacados, botones de acción */
  --color-brand-on-accent: #051c38; /* texto sobre el amarillo */
  --color-brand-tertiary: #0b4385;
  --color-brand-highlight: #1769d2;
  --color-brand-accent-hover: #ffe600;

  /* Superficies y texto */
  --color-surface-muted: #f8fafc;
  --color-ink-muted: #64748b;
  --color-line: #e2e8f0;
  --color-surface-muted: #f4f6f9;
  --color-ink-muted: #5b6b80;

  /* Footer: usa los colores de la marca */
  --color-footer: var(--color-brand-primary);
  --color-footer-bottom: var(--color-brand-primary-hover);
  --color-footer-accent: var(--color-brand-accent);
  --color-footer-on-accent: var(--color-brand-on-accent);

  /* Tipografía */
  --font-heading: Arial, Helvetica, sans-serif;
  --font-body: Arial, Helvetica, sans-serif;
  --color-gallery-active: var(--color-brand-secondary);
}