/* ==========================================================================
   Timoteo — design tokens (fuente: proyecto "Identidad Visual Tienda Timoteo"
   en Google Stitch + su DESIGN.md). Los valores no se reinterpretan.
   ========================================================================== */

:root {
  /* --- Paleta de marca (pantallas "Boutique": Home, Catálogo, Crea, Producto) --- */
  --cream: #FBF6F1;            /* Warm Ivory */
  --cream-light: #FDFBF9;
  --espresso: #342725;         /* Warm Espresso */
  --burgundy: #713E48;         /* Burgundy Noble */
  --burgundy-dark: #4A252D;    /* Black Cherry */
  --burgundy-hover: #5c313a;
  --blush: #C98F91;            /* Antique Blush */
  --blush-soft: #F2E4DE;
  --powder-rose: #E8D5D0;
  --oat: #F5EFE9;
  --border-light: #EEDFD5;
  --haze: #EADBDA;
  --champagne: #C9AB78;
  --sage: #A3AA98;
  --muted: #7E6C68;
  --cocoa: #5C4D4A;

  /* --- Paleta del design system (pantallas "Atelier" y "App": tokens Material) --- */
  --surface: #fff8f6;
  --surface-dim: #ebd5d2;
  --surface-bright: #fff8f6;
  --surface-container-lowest: #ffffff;
  --surface-container-low: #fff0ee;
  --surface-container: #ffe9e6;
  --surface-container-high: #fae3e0;
  --surface-container-highest: #f4deda;
  --surface-variant: #f4deda;
  --background: #fff8f6;
  --on-surface: #241917;
  --on-surface-variant: #514345;
  --on-background: #241917;
  --inverse-surface: #3b2d2b;
  --inverse-on-surface: #ffedea;
  --outline: #837375;
  --outline-variant: #d6c2c4;
  --surface-tint: #854f59;
  --primary: #562832;
  --on-primary: #ffffff;
  --primary-container: #713e48;
  --on-primary-container: #f0acb7;
  --inverse-primary: #f9b4bf;
  --primary-fixed: #ffd9de;
  --primary-fixed-dim: #f9b4bf;
  --on-primary-fixed: #350d17;
  --on-primary-fixed-variant: #6a3842;
  --secondary: #825153;
  --on-secondary: #ffffff;
  --secondary-container: #ffbfc1;
  --on-secondary-container: #7b4b4d;
  --secondary-fixed: #ffdada;
  --secondary-fixed-dim: #f5b7b9;
  --on-secondary-fixed: #331013;
  --on-secondary-fixed-variant: #673a3c;
  --tertiary: #47330b;
  --on-tertiary: #ffffff;
  --tertiary-container: #604a20;
  --on-tertiary-container: #d9ba86;
  --tertiary-fixed: #ffdea7;
  --tertiary-fixed-dim: #e2c28d;
  --on-tertiary-fixed: #271900;
  --on-tertiary-fixed-variant: #59431a;
  --error: #ba1a1a;
  --on-error: #ffffff;
  --error-container: #ffdad6;
  --on-error-container: #93000a;
  --success: #3f7d5b;

  /* --- Tipografía --- */
  --font-serif: "Playfair Display", Georgia, "Times New Roman", serif;
  --font-sans: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-script: "Caveat", cursive;

  /* --- Radios --- */
  --r-sm: 0.5rem;
  --r: 1rem;
  --r-md: 1.5rem;
  --r-lg: 2rem;
  --r-xl: 3rem;
  --r-2xl: 1rem;       /* tailwind rounded-2xl */
  --r-3xl: 1.5rem;     /* tailwind rounded-3xl */
  --r-card: 2rem;      /* rounded-[2rem] */
  --r-panel: 2.5rem;   /* rounded-[2.5rem] */
  --r-full: 9999px;

  /* --- Espaciado (design system) --- */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2.5rem;
  --gutter: 1.5rem;
  --gutter-mobile: 0.75rem;
  --margin: 3rem;
  --margin-mobile: 1rem;

  /* --- Sombras (Elevation & Depth) --- */
  --shadow-warm-sm: 0 4px 20px -2px rgba(113, 62, 72, 0.06);
  --shadow-warm-md: 0 12px 30px -4px rgba(74, 37, 45, 0.10);
  --shadow-warm-lg: 0 20px 45px -8px rgba(52, 39, 37, 0.16);
  --shadow-tier2: 0 8px 24px -4px rgba(74, 37, 45, 0.07), 0 2px 6px -1px rgba(74, 37, 45, 0.04);
  --shadow-tier3: 0 20px 48px -8px rgba(52, 39, 37, 0.16);

  /* --- Movimiento --- */
  --ease: cubic-bezier(0.4, 0, 0.2, 1);

  /* --- Layout --- */
  --container: 80rem;      /* max-w-7xl = 1280px */
  --bottom-nav-h: 64px;
}