/* ── DESIGN TOKENS ─────────────────────────────────────────────
   Estos valores son sobreescritos en runtime por config-loader.js
   con los colores específicos de cada cliente.
   ─────────────────────────────────────────────────────────────── */
:root {
  /* Colores principales (sobreescritos por config/client.js) */
  --color-primary:       #2E4A28;
  --color-primary-light: #4A7040;
  --color-accent:        #C5B358;
  --color-burgundy-dark: #1C2E18;
  --color-burgundy-deep: #1C2E18;
  --color-bg:            #FAFAF5;
  --color-text:          #1C2A1A;

  /* Colores fijos de sistema */
  --color-surface:       #FFFFFF;
  --color-surface-alt:   #F0EDE2;
  --color-text-muted:    #5A6B52;
  --color-text-light:    #8A9980;
  --color-border:        #D4CFC4;
  --color-border-light:  #E8E4D8;
  --color-success:       #2E7D32;
  --color-error:         #C62828;
  --color-blocked:       #C62828;
  --color-available:     #2E7D32;
  --color-overlay:       rgba(20, 38, 18, 0.60);

  /* Tokens botánicos */
  --color-gold:            #C5B358;
  --color-gold-light:      rgba(197, 179, 88, 0.15);
  --color-forest-deep:     #1C2E18;
  --color-forest-overlay:  rgba(20, 46, 18, 0.65);

  /* Tipografía */
  --font-heading: 'Cormorant Garamond', 'Georgia', serif;
  --font-script:  'Great Vibes', 'Dancing Script', cursive;
  --font-body:    'Georgia', 'Times New Roman', serif;
  --font-size-xs:  0.75rem;   /* 12px */
  --font-size-sm:  0.875rem;  /* 14px */
  --font-size-md:  1rem;      /* 16px */
  --font-size-lg:  1.125rem;  /* 18px */
  --font-size-xl:  1.375rem;  /* 22px */
  --font-size-2xl: 1.75rem;   /* 28px */
  --font-size-3xl: 2.25rem;   /* 36px */
  --font-size-4xl: 3rem;      /* 48px */
  --font-size-5xl: 3.75rem;   /* 60px */

  /* Letter spacing */
  --ls-tight:  0.04em;
  --ls-normal: 0.08em;
  --ls-wide:   0.15em;
  --ls-wider:  0.22em;

  /* Espaciado */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-28: 7rem;
  --space-32: 8rem;

  /* Bordes — formas arquitectónicas, menos redondeadas */
  --radius-sm:   2px;
  --radius-md:   4px;
  --radius-lg:   8px;
  --radius-xl:   12px;
  --radius-full: 9999px;

  /* Sombras — tinte verde en lugar de negro puro */
  --shadow-sm:  0 1px 4px rgba(28, 42, 26, 0.08);
  --shadow-md:  0 4px 16px rgba(28, 42, 26, 0.10);
  --shadow-lg:  0 8px 32px rgba(28, 42, 26, 0.14);
  --shadow-xl:  0 16px 48px rgba(28, 42, 26, 0.18);

  /* Transiciones */
  --transition-fast:   0.15s ease;
  --transition:        0.25s ease;
  --transition-slow:   0.4s ease;

  /* Layout */
  --header-height:  72px;
  --max-width:      1200px;
  --max-width-text: 720px;

  /* Z-index */
  --z-base:     1;
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-modal:    300;
  --z-fab:      400;
  --z-toast:    500;
}