/* ============================================================
   DairyForm brand tokens (consolidated for the Laravel/Blade app)
   Source: .claude/skills/dairyform-design (colors, typography,
   spacing, effects). Link this AFTER bootstrap so tokens win.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Schibsted+Grotesk:wght@400;500;600;700;800&family=Hanken+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');

:root {
  /* Brand green */
  --green-50:#EDF7F1; --green-100:#D2EBDC; --green-200:#A6D7BA; --green-300:#74BE92;
  --green-400:#45A06D; --green-500:#1F7A4D; --green-600:#186440; --green-700:#144F33;
  --green-800:#103D28; --green-900:#0B2A1C;
  /* Sprout accent */
  --sprout-300:#9FD8A2; --sprout-400:#7BC47F; --sprout-500:#5BAE63;
  /* Warm neutrals */
  --neutral-0:#FFFFFF; --neutral-50:#FAFAF7; --neutral-100:#F4F3ED; --neutral-200:#E8E6DC;
  --neutral-300:#D6D3C6; --neutral-400:#ABA89A; --neutral-500:#7C7A6E; --neutral-600:#585649;
  --neutral-700:#3D3C33; --neutral-800:#272620; --neutral-900:#161611;
  /* Cream */
  --cream-100:#F7F5EE; --cream-200:#F2EFE6; --cream-300:#ECE8DA;
  /* Status */
  --success-50:#E9F6EE; --success-500:#15863F; --success-700:#0E6230;
  --warning-50:#FCF3E2; --warning-500:#D9920A; --warning-700:#A66B05;
  --danger-50:#FBEDEC; --danger-500:#D14343; --danger-700:#A4302F;
  --info-50:#EAF1FC; --info-500:#2A6FDB; --info-700:#1E51A6;
  /* Charts */
  --chart-1:#1F7A4D; --chart-2:#2A6FDB; --chart-3:#E8A317; --chart-4:#14B8A6; --chart-5:#8B5CF6; --chart-6:#EC6A5E;

  /* Semantic aliases */
  --canvas:var(--cream-200); --surface:var(--neutral-0); --surface-subtle:var(--neutral-50);
  --surface-sunken:var(--cream-100); --surface-inverse:var(--green-800);
  --text-strong:var(--neutral-900); --text-body:var(--neutral-700); --text-muted:var(--neutral-500);
  --text-subtle:var(--neutral-400); --text-on-brand:var(--neutral-0); --text-on-cream:var(--green-800);
  --text-link:var(--green-600);
  --brand:var(--green-500); --brand-hover:var(--green-600); --brand-active:var(--green-700);
  --brand-subtle:var(--green-50); --brand-accent:var(--sprout-400);
  --border:var(--neutral-200); --border-strong:var(--neutral-300); --border-brand:var(--green-200); --divider:var(--neutral-200);
  --success:var(--success-500); --success-bg:var(--success-50);
  --warning:var(--warning-500); --warning-bg:var(--warning-50);
  --danger:var(--danger-500); --danger-bg:var(--danger-50);
  --info:var(--info-500); --info-bg:var(--info-50);
  --ring:rgba(31,122,77,0.30);

  /* Type */
  --font-display:'Schibsted Grotesk','Hanken Grotesk',system-ui,sans-serif;
  --font-sans:'Hanken Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,monospace;
  --text-2xs:0.6875rem; --text-xs:0.75rem; --text-sm:0.8125rem; --text-base:0.9375rem; --text-md:1rem;
  --text-lg:1.125rem; --text-xl:1.375rem; --text-2xl:1.75rem; --text-3xl:2.25rem;
  --weight-regular:400; --weight-medium:500; --weight-semibold:600; --weight-bold:700; --weight-extra:800;
  --leading-tight:1.12; --leading-snug:1.28; --leading-normal:1.5;
  --tracking-tight:-0.02em; --tracking-snug:-0.01em; --tracking-wide:0.04em; --tracking-caps:0.08em;

  /* Spacing & layout */
  --space-1:0.25rem; --space-2:0.5rem; --space-3:0.75rem; --space-4:1rem; --space-5:1.25rem;
  --space-6:1.5rem; --space-8:2rem; --space-10:2.5rem; --space-12:3rem; --space-16:4rem;
  --sidebar-w:248px; --topbar-h:64px; --container-max:1200px;

  /* Effects */
  --radius-xs:4px; --radius-sm:6px; --radius-md:8px; --radius-lg:12px; --radius-xl:16px; --radius-2xl:22px; --radius-full:9999px;
  --shadow-xs:0 1px 2px rgba(16,32,22,0.06);
  --shadow-sm:0 1px 3px rgba(16,32,22,0.08),0 1px 2px rgba(16,32,22,0.05);
  --shadow-md:0 4px 14px -3px rgba(16,32,22,0.12),0 2px 6px -2px rgba(16,32,22,0.06);
  --shadow-lg:0 14px 32px -8px rgba(16,32,22,0.18),0 4px 10px -4px rgba(16,32,22,0.08);
  --shadow-xl:0 28px 56px -12px rgba(16,32,22,0.24);
  --focus-ring:0 0 0 3px var(--ring);
  --ease-out:cubic-bezier(0.22,1,0.36,1); --dur-fast:120ms; --dur-base:200ms; --dur-slow:320ms;
}