/* Gurukool — Design Tokens
   Fresh academic + warm undertones. Culturally Indian via subtle motifs, not stereotype. */

:root {
  /* Type */
  --font-sans: 'Plus Jakarta Sans', 'Noto Sans', system-ui, -apple-system, sans-serif;
  --font-display: 'Fraunces', 'Noto Serif', Georgia, serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;

  /* Brand — fresh academic green */
  --gk-green-50:  oklch(97% 0.02 155);
  --gk-green-100: oklch(93% 0.04 155);
  --gk-green-200: oklch(87% 0.07 155);
  --gk-green-300: oklch(78% 0.10 150);
  --gk-green-400: oklch(68% 0.12 150);
  --gk-green-500: oklch(58% 0.13 152);
  --gk-green-600: oklch(48% 0.13 152);
  --gk-green-700: oklch(40% 0.11 152);
  --gk-green-800: oklch(32% 0.08 152);
  --gk-green-900: oklch(22% 0.05 152);

  /* Lime accent — growth, energy */
  --gk-lime-300: oklch(86% 0.15 128);
  --gk-lime-400: oklch(80% 0.18 128);
  --gk-lime-500: oklch(72% 0.20 128);
  --gk-lime-600: oklch(60% 0.18 128);

  /* Warm neutrals (subtle warm undertone, not pure gray) */
  --gk-ivory:    oklch(98.5% 0.008 85);
  --gk-paper:    oklch(97% 0.012 85);
  --gk-stone-50:  oklch(96% 0.006 85);
  --gk-stone-100: oklch(92% 0.008 85);
  --gk-stone-200: oklch(86% 0.010 85);
  --gk-stone-300: oklch(75% 0.012 85);
  --gk-stone-400: oklch(60% 0.012 85);
  --gk-stone-500: oklch(48% 0.012 85);
  --gk-stone-600: oklch(38% 0.012 85);
  --gk-stone-700: oklch(28% 0.010 85);
  --gk-stone-800: oklch(20% 0.008 85);
  --gk-stone-900: oklch(14% 0.006 85);

  /* Semantic (status) — tuned to palette */
  --gk-success: oklch(65% 0.15 145);
  --gk-warn:    oklch(75% 0.14 75);
  --gk-danger:  oklch(60% 0.18 25);
  --gk-info:    oklch(60% 0.12 230);

  /* Light theme semantic surfaces */
  --bg:        var(--gk-ivory);
  --bg-alt:    var(--gk-paper);
  --surface:   #ffffff;
  --surface-2: var(--gk-stone-50);
  --border:    var(--gk-stone-200);
  --border-strong: var(--gk-stone-300);
  --text:      var(--gk-stone-900);
  --text-muted:var(--gk-stone-500);
  --text-soft: var(--gk-stone-600);
  --accent:    var(--gk-green-600);
  --accent-soft: var(--gk-green-100);
  --accent-ink:  var(--gk-green-800);
  --ring: color-mix(in oklch, var(--gk-green-500) 40%, transparent);

  /* Radii */
  --r-xs: 6px;
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 20px;
  --r-2xl: 28px;
  --r-full: 999px;

  /* Spacing */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px;
  --s-5: 20px; --s-6: 24px; --s-8: 32px; --s-10: 40px; --s-12: 48px;

  /* Shadows — soft, natural */
  --sh-xs: 0 1px 2px rgba(20, 30, 20, 0.04);
  --sh-sm: 0 1px 3px rgba(20, 30, 20, 0.05), 0 1px 2px rgba(20, 30, 20, 0.03);
  --sh-md: 0 4px 12px rgba(20, 30, 20, 0.06), 0 1px 3px rgba(20, 30, 20, 0.04);
  --sh-lg: 0 12px 32px rgba(20, 30, 20, 0.08), 0 2px 6px rgba(20, 30, 20, 0.04);
  --sh-xl: 0 24px 60px rgba(20, 30, 20, 0.12), 0 4px 12px rgba(20, 30, 20, 0.06);

  /* Motion */
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
  --dur-1: 120ms;
  --dur-2: 200ms;
  --dur-3: 320ms;
}

[data-theme="dark"] {
  --bg:        var(--gk-stone-900);
  --bg-alt:    oklch(17% 0.008 85);
  --surface:   var(--gk-stone-800);
  --surface-2: oklch(24% 0.010 85);
  --border:    oklch(30% 0.010 85);
  --border-strong: oklch(38% 0.012 85);
  --text:      oklch(96% 0.008 85);
  --text-muted:var(--gk-stone-400);
  --text-soft: var(--gk-stone-300);
  --accent:    var(--gk-green-400);
  --accent-soft: oklch(30% 0.08 152);
  --accent-ink:  var(--gk-green-100);
}

/* Accent themes (Tweaks) */
[data-accent="lime"]    { --accent: var(--gk-lime-600); --accent-soft: oklch(92% 0.10 128); --accent-ink: oklch(35% 0.12 128); --ring: color-mix(in oklch, var(--gk-lime-500) 40%, transparent); }
[data-accent="saffron"] { --accent: oklch(65% 0.17 55); --accent-soft: oklch(94% 0.05 55); --accent-ink: oklch(35% 0.13 55); --ring: color-mix(in oklch, oklch(65% 0.17 55) 40%, transparent); }
[data-accent="indigo"]  { --accent: oklch(52% 0.16 270); --accent-soft: oklch(94% 0.04 270); --accent-ink: oklch(32% 0.13 270); --ring: color-mix(in oklch, oklch(52% 0.16 270) 40%, transparent); }
[data-accent="teal"]    { --accent: oklch(55% 0.11 195); --accent-soft: oklch(94% 0.04 195); --accent-ink: oklch(32% 0.10 195); --ring: color-mix(in oklch, oklch(55% 0.11 195) 40%, transparent); }

/* Density */
[data-density="compact"] { --row-h: 36px; --pad-y: 8px; --pad-x: 12px; --gap: 8px; }
[data-density="cozy"],
:root                    { --row-h: 44px; --pad-y: 12px; --pad-x: 16px; --gap: 12px; }

html, body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

* { box-sizing: border-box; }

/* Jali motif — subtle 6-point lattice (used sparingly) */
.gk-jali {
  background-image:
    radial-gradient(circle at 50% 50%, var(--accent-soft) 1px, transparent 1.5px),
    radial-gradient(circle at 0 0, var(--accent-soft) 1px, transparent 1.5px),
    radial-gradient(circle at 100% 100%, var(--accent-soft) 1px, transparent 1.5px);
  background-size: 24px 24px;
  background-position: 0 0, 12px 12px, 12px 12px;
}
