/* Theme-agnostic scale tokens — apply to every theme.
   Per-theme overrides live in the data-theme blocks below. */
:root {
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 3rem;
  --space-8: 4.5rem;
  --space-9: 6.5rem;

  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 28px;
  --radius-xl: 40px;
  --radius-pill: 999px;

  --shadow-sm: 0 1px 2px rgba(20, 14, 8, 0.06);
  --shadow-md: 0 12px 32px -16px rgba(20, 14, 8, 0.18), 0 2px 4px rgba(20, 14, 8, 0.06);
  --shadow-lg: 0 28px 56px -20px rgba(20, 14, 8, 0.24), 0 4px 12px rgba(20, 14, 8, 0.08);

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-soft: cubic-bezier(0.34, 1.56, 0.64, 1);

  --content-narrow: 60ch;
  --content: 1180px;
}

:root[data-theme="warm-playful"] {
  --color-primary:      #F5B92F;   /* Sunshine yellow */
  --color-primary-dark: #D89A1F;
  --color-accent:       #FF6F5A;   /* Coral */
  --color-accent-dark:  #E0533F;
  --color-bg:           #FFF7E8;   /* Cream */
  --color-bg-deep:      #FBEACB;   /* Toasted cream for alternating sections */
  --color-surface:      #FFFFFF;
  --color-text:         #2A1F12;   /* Warm near-black */
  --color-text-muted:   #7A6648;
  --color-border:       #ECD9B0;
  --color-ink:          #1E160D;   /* Display headlines */
  --color-leaf:         #4FAE7A;   /* Green sticker accent */
  --color-sky:          #6FB8E0;   /* Blue sticker accent */

  --font-display: "Caprasimo", "Recoleta", "DM Serif Display", Georgia, serif;
  --font-body:    "Hanken Grotesk", system-ui, sans-serif;

  --focus-ring: 0 0 0 3px rgba(245, 185, 47, 0.45);
  --shadow-sticker: 6px 6px 0 0 var(--color-ink);
  --shadow-card-hover: 8px 10px 0 0 var(--color-ink);
}

:root[data-theme="soft-nurturing"] {
  --color-primary: #8FAE7F;
  --color-primary-dark: #6B8C5C;
  --color-accent: #F5B79D;
  --color-bg: #FAF6F0;
  --color-surface: #FFFFFF;
  --color-text: #2F3A2C;
  --color-text-muted: #7A857A;
  --color-border: #E0DCD3;
  --font-display: "Fraunces", Georgia, serif;
  --font-body: "Inter", system-ui, sans-serif;
  --focus-ring: 0 0 0 3px rgba(143, 174, 127, 0.4);
}

:root[data-theme="bright-fun"] {
  --color-primary: #2E86DE;
  --color-primary-dark: #1B5FA8;
  --color-accent: #FFCE3B;
  --color-bg: #FFFFFF;
  --color-surface: #F4F8FC;
  --color-text: #1A1A2E;
  --color-text-muted: #6B7280;
  --color-border: #D9E4F0;
  --font-display: "Fredoka", system-ui, sans-serif;
  --font-body: "Nunito", system-ui, sans-serif;
  --focus-ring: 0 0 0 3px rgba(46, 134, 222, 0.4);
}

:root[data-theme="modern-trust"] {
  --color-primary: #1B4965;
  --color-primary-dark: #0F2E42;
  --color-accent: #5FA8D3;
  --color-bg: #FFFFFF;
  --color-surface: #F7FAFC;
  --color-text: #1A1F2E;
  --color-text-muted: #5C6B7A;
  --color-border: #D6DEE6;
  --font-display: "Lora", Georgia, serif;
  --font-body: "Inter", system-ui, sans-serif;
  --focus-ring: 0 0 0 3px rgba(27, 73, 101, 0.4);
}

/* :root[data-theme="custom"] {
   Override tokens here. Don't edit the presets above.
} */
