@import url('https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;1,6..72,400;1,6..72,500&family=Hanken+Grotesk:wght@400;500;600;700&display=swap');

:root {
  /* Fonts */
  --font-display: 'Newsreader', serif;
  --font-body: 'Hanken Grotesk', sans-serif;

  /* Type Scale */
  --text-4xl: 60px;
  --text-2xl: 36px;
  --text-xl: 28px;
  --text-md: 18px;
  --text-base: 16px;
  --text-sm: 14px;
  --text-xs: 12px;

  /* Lavender (Secondary) */
  --lavender-50:  #f6f4fb;
  --lavender-100: #ede9f5;
  --lavender-200: #ddd5ec;
  --lavender-300: #c5b8de;
  --lavender-400: #a896cd;
  --lavender-500: #8b76b8;
  --lavender-600: #6f5b9c;
  --lavender-700: #574878;
  --lavender-800: #3f3458;
  --lavender-900: #2a2340;

  /* Rose (Primary) */
  --rose-50:  #fbf1f2;
  --rose-100: #f7e2e5;
  --rose-200: #eec6cc;
  --rose-300: #e2a6b0;
  --rose-400: #d4808c;
  --rose-500: #c06d7a;
  --rose-600: #b85e6c;
  --rose-700: #9c4d59;
  --rose-800: #7d3e48;
  --rose-900: #5b2c34;

  /* Warm Neutrals */
  --neutral-0:   #ffffff;
  --neutral-50:  #faf7f5;
  --neutral-100: #f3eeea;
  --neutral-200: #e8e0d9;
  --neutral-300: #d6ccc3;
  --neutral-400: #b6a99f;
  --neutral-500: #8a7e74;
  --neutral-600: #6a5f56;
  --neutral-700: #4e453e;
  --neutral-800: #38302b;
  --neutral-900: #29221e;

  /* Semantic */
  --color-success: #4a7c5f;
  --color-warning: #b8860b;
  --color-danger:  #b84040;

  /* Chat Bubbles */
  --bubble-coach-bg:   var(--rose-400);
  --bubble-coach-text: #ffffff;
  --bubble-user-bg:    var(--lavender-100);
  --bubble-user-text:  var(--neutral-800);

  /* Radius */
  --radius-sm:   10px;
  --radius-md:   14px;
  --radius-lg:   20px;
  --radius-xl:   28px;
  --radius-pill: 999px;

  /* Spacing */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-6:  24px;
  --space-8:  32px;
  --space-12: 48px;
  --space-16: 64px;
}

/* Themes */
body.theme-sunset  { --theme-primary: #d4808c; --theme-accent: #e8c4c0; }
body.theme-classic { --theme-primary: #2c2c2c; --theme-accent: #e8e0d9; }
body.theme-warm    { --theme-primary: #c4784a; --theme-accent: #f0d8c0; }
body.theme-teal    { --theme-primary: #3a8a7c; --theme-accent: #e8f4f1; }
body.theme-romantic { --theme-primary: #c04060; --theme-accent: #fce8f0; }

/* Default theme */
body { --theme-primary: #d4808c; --theme-accent: #e8c4c0; }