/* =============================================
   MANNA INSTITUTE — Design Tokens
   CSS Custom Properties (replaces Tailwind config)
   ============================================= */

:root {
  /* ── Preserved Manna Coins palette ── */
  --color-pine:   #2f6a4f;
  --color-leaf:   #4a9469;
  --color-gold:   #e4a72f;
  --color-cream:  #f7f4ea;
  --color-ink:    #1c1c1e;

  /* ── New Institute palette ── */
  --color-scroll: #fff9ec;
  --color-cedar:  #1f4e3a;
  --color-bronze: #b7791f;
  --color-stone:  #6b7280;
  --color-linen:  #fbf7ed;

  /* ── Semantic colours ── */
  --color-white:      #ffffff;
  --color-success:    var(--color-leaf);
  --color-error:      #dc2626;
  --color-warning:    #d97706;
  --color-info:       #334155;

  /* ── Surface colours (Glassmorphism) ── */
  --color-bg-mesh:    linear-gradient(135deg, #f7f4ea 0%, #ede6d6 100%);
  --color-surface:    rgba(255, 255, 255, 0.4);
  --color-surface-hover: rgba(255, 255, 255, 0.6);
  --color-border:     rgba(255, 255, 255, 0.5);
  --color-border-strong: rgba(47, 106, 79, 0.15);

  /* ── Avatar colours ── */
  --avatar-emerald-bg:  #d1fae5; --avatar-emerald-fg: #065f46;
  --avatar-indigo-bg:   #e0e7ff; --avatar-indigo-fg:  #3730a3;
  --avatar-rose-bg:     #ffe4e6; --avatar-rose-fg:    #9f1239;
  --avatar-amber-bg:    #fef3c7; --avatar-amber-fg:   #92400e;
  --avatar-sky-bg:      #e0f2fe; --avatar-sky-fg:     #0c4a6e;
  --avatar-violet-bg:   #ede9fe; --avatar-violet-fg:  #4c1d95;

  /* ── Typography ── */
  --font-heading: 'Lora', Georgia, serif;
  --font-ui:      'Manrope', system-ui, sans-serif;

  /* ── Spacing ── */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-7:  28px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-14: 56px;
  --space-16: 64px;

  /* ── Radii ── */
  --radius-sm:   8px;
  --radius-md:   12px;
  --radius-lg:   16px;
  --radius-xl:   20px;
  --radius-2xl:  24px;
  --radius-card: 28px;
  --radius-full: 9999px;

  /* ── Shadows ── */
  --shadow-sm:   0 1px 3px rgba(31, 78, 58, 0.08);
  --shadow-md:   0 4px 12px rgba(31, 78, 58, 0.10);
  --shadow-card: 0 20px 50px rgba(31, 78, 58, 0.12);
  --shadow-pine: 0 8px 24px rgba(47, 106, 79, 0.20);

  /* ── Transitions ── */
  --transition-fast:   0.15s ease;
  --transition-normal: 0.25s ease;

  /* ── Layout ── */
  --max-content: 1200px;
  --sidebar-w:   72px;
}