/* Google Fonts: Plus Jakarta Sans for headings & brand, JetBrains Mono for code/tags, Inter for body */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Plus+Jakarta+Sans:wght@500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root {
  /* Fonts */
  --font-display: 'Plus Jakarta Sans', ui-sans-serif, system-ui, sans-serif;
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

  /* Typography Scale */
  --type-scale: 1;
  --grid: 64px;

  /* Dark Theme Palette (Default for Sekhoz) */
  --d-ink: #0a0b0e;
  --d-ink2: #0e1014;
  --d-ink3: #14171d;
  --d-fg: #e9ecf1;
  --d-fg-dim: #9aa3b2;
  --d-fg-faint: #6b7382;
  --d-teal: #00e5c7;
  --d-peri: #7c8cff;
  --d-lime: #a3e635;
  --d-amber: #ffb020;
  --d-rose: #ff6b8b;

  /* Light Theme Palette */
  --l-ink: #f8fafc;
  --l-ink2: #ffffff;
  --l-ink3: #f1f5f9;
  --l-fg: #0f172a;
  --l-fg-dim: #475569;
  --l-fg-faint: #94a3b8;
  --l-teal: #0ea5e9;
  --l-peri: #6366f1;
  --l-lime: #10b981;
  --l-amber: #f59e0b;
  --l-rose: #f43f5e;

  /* Layout dimensions */
  --max-w: 1200px;
  --nav-height: 64px;
}

/* Dark Theme Mapping */
:root, [data-mode="dark"] {
  --color-ink: var(--d-ink);
  --color-ink-2: var(--d-ink2);
  --color-ink-3: var(--d-ink3);
  --color-fg: var(--d-fg);
  --color-fg-dim: var(--d-fg-dim);
  --color-fg-faint: var(--d-fg-faint);

  --color-teal: var(--d-teal);
  --color-peri: var(--d-peri);
  --color-lime: var(--d-lime);
  --color-amber: var(--d-amber);
  --color-rose: var(--d-rose);

  --color-line: rgba(233, 236, 241, 0.12);
  --color-line-soft: rgba(233, 236, 241, 0.06);

  --btn-cta-bg: #e9ecf1;
  --btn-cta-fg: #05070a;
  --btn-outline-border: rgba(0, 229, 199, 0.35);
  --btn-outline-fg: var(--color-fg);

  --panel-bg: linear-gradient(180deg, rgba(233, 236, 241, 0.045), rgba(233, 236, 241, 0.015));
  --panel-highlight: linear-gradient(90deg, transparent, rgba(233, 236, 241, 0.32), transparent);
}

/* Light Theme Mapping */
[data-mode="light"] {
  --color-ink: var(--l-ink);
  --color-ink-2: var(--l-ink2);
  --color-ink-3: var(--l-ink3);
  --color-fg: var(--l-fg);
  --color-fg-dim: var(--l-fg-dim);
  --color-fg-faint: var(--l-fg-faint);

  --color-teal: var(--l-teal);
  --color-peri: var(--l-peri);
  --color-lime: var(--l-lime);
  --color-amber: var(--l-amber);
  --color-rose: var(--l-rose);

  --color-line: rgba(15, 23, 42, 0.1);
  --color-line-soft: rgba(15, 23, 42, 0.05);

  --btn-cta-bg: #0f172a;
  --btn-cta-fg: #ffffff;
  --btn-outline-border: rgba(14, 165, 233, 0.45);
  --btn-outline-fg: var(--color-fg);

  --panel-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(241, 245, 249, 0.6));
  --panel-highlight: linear-gradient(90deg, transparent, rgba(14, 165, 233, 0.35), transparent);
}