/* ===========================================================================
   Get It Done - Canonical design tokens
   Source of truth: "Get It Done Design System" (tokens/*.css).
   Shared verbatim by the WordPress theme AND the plugin app - keep in sync.
   Fonts (Nunito / Nunito Sans / JetBrains Mono) are enqueued separately.
   =========================================================================== */
:root{
  /* ---- Brand primary: leaf green ---- */
  --green-50:#f0f9ed; --green-100:#dcf1d4; --green-200:#bce5ad; --green-300:#92d57f;
  --green-400:#6cc356; --green-500:#4fae3e; --green-600:#3d9330; --green-700:#327526;
  --green-800:#2b5d21; --green-900:#254d1d;

  /* ---- Brand secondary: deep teal-green ---- */
  --teal-50:#e6f4ef; --teal-100:#c2e6da; --teal-200:#8ed3bd; --teal-300:#4fbb9c;
  --teal-400:#1a9c79; --teal-500:#00805e; --teal-600:#006b4f; --teal-700:#00553f;
  --teal-800:#004332; --teal-900:#003527;

  /* ---- Neutrals ---- */
  --neutral-0:#ffffff; --neutral-50:#f6f8f7; --neutral-100:#eef1ef; --neutral-200:#e1e6e3;
  --neutral-300:#cbd3ce; --neutral-400:#a3aea8; --neutral-500:#79857f; --neutral-600:#57625c;
  --neutral-700:#3e4843; --neutral-800:#28302c; --neutral-900:#18201c;

  /* ---- Semantic status ---- */
  --success-500:#4fae3e; --success-50:#f0f9ed;
  --warning-500:#f5a524; --warning-50:#fef6e7;
  --danger-500:#e5484d;  --danger-50:#fdedee;
  --info-500:#2f7fed;    --info-50:#eaf2fe;

  /* ---- Gradients (signature green→teal) ---- */
  --gradient-brand:linear-gradient(90deg,var(--green-500) 0%,var(--teal-500) 100%);
  --gradient-brand-soft:linear-gradient(135deg,var(--green-50) 0%,var(--teal-50) 100%);

  /* ---- Semantic aliases ---- */
  --brand:var(--green-500); --brand-hover:var(--green-600); --brand-active:var(--green-700);
  --brand-contrast:var(--neutral-0); --brand-secondary:var(--teal-500);
  --text-strong:var(--neutral-900); --text-body:var(--neutral-700); --text-muted:var(--neutral-500);
  --text-on-brand:var(--neutral-0); --text-link:var(--teal-600);
  --surface-page:var(--neutral-50); --surface-card:var(--neutral-0); --surface-sunken:var(--neutral-100);
  --surface-inverse:var(--neutral-900); --surface-brand-soft:var(--green-50);
  --border-subtle:var(--neutral-200); --border-default:var(--neutral-300); --border-strong:var(--neutral-400);
  --border-brand:var(--green-500);
  --focus-ring:color-mix(in srgb, var(--green-500) 45%, transparent);

  /* ---- Typography ---- */
  --font-display:'Nunito',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-body:'Nunito Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;
  --weight-regular:400; --weight-medium:500; --weight-semibold:600; --weight-bold:700;
  --weight-extrabold:800; --weight-black:900;
  --text-xs:0.75rem; --text-sm:0.875rem; --text-base:1rem; --text-md:1.125rem; --text-lg:1.375rem;
  --text-xl:1.75rem; --text-2xl:2.25rem; --text-3xl:3rem; --text-4xl:3.75rem;
  --leading-tight:1.1; --leading-snug:1.25; --leading-normal:1.5; --leading-relaxed:1.65;
  --tracking-tight:-0.02em; --tracking-normal:0; --tracking-wide:0.04em; --tracking-caps:0.08em;

  /* ---- Spacing (4px grid) ---- */
  --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;
  --space-20:5rem; --space-24:6rem;
  --container-max:1200px; --container-pad:var(--space-6); --section-gap:var(--space-20);

  /* ---- Radius ---- */
  --radius-xs:4px; --radius-sm:8px; --radius-md:12px; --radius-lg:16px; --radius-xl:24px;
  --radius-2xl:32px; --radius-pill:999px; --radius-circle:50%;

  /* ---- Shadows (soft, faint green undertone) ---- */
  --shadow-xs:0 1px 2px rgba(24,32,28,.06);
  --shadow-sm:0 1px 3px rgba(24,32,28,.08),0 1px 2px rgba(24,32,28,.04);
  --shadow-md:0 4px 12px rgba(24,32,28,.08),0 2px 4px rgba(24,32,28,.04);
  --shadow-lg:0 12px 28px rgba(24,32,28,.10),0 4px 8px rgba(24,32,28,.05);
  --shadow-xl:0 24px 48px rgba(24,32,28,.14);
  --shadow-brand:0 8px 20px rgba(79,174,62,.30);
  --shadow-brand-sm:0 4px 10px rgba(79,174,62,.22);

  /* ---- Motion ---- */
  --ease-standard:cubic-bezier(0.2,0,0.2,1); --ease-out:cubic-bezier(0.16,1,0.3,1);
  --ease-spring:cubic-bezier(0.34,1.56,0.64,1);
  --duration-fast:120ms; --duration-base:200ms; --duration-slow:320ms;

  /* =========================================================================
     BACK-COMPAT ALIASES - old variable names used by existing theme + app CSS,
     remapped onto the new palette so legacy rules instantly adopt the new brand.
     ========================================================================= */
  --green:var(--green-500);
  --green-mid:var(--green-600);
  --green-dark:var(--teal-900);
  --green-light:var(--green-50);
  --green-tint:var(--green-50);
  --gold:#f1b434;          /* old gold accent → brand teal */
  --gold-light:var(--teal-50);
  --ink:var(--neutral-900);
  --mist:var(--neutral-50);
  --white:var(--neutral-0);
  --border:var(--border-subtle);
  --error:var(--danger-500);
  --error-bg:var(--danger-50);
  --radius:var(--radius-md);
  /* --radius-lg already 16px above (was 20px) */
  --shadow:var(--shadow-md);
  /* legacy app/theme font aliases */
  --sans:var(--font-body);
  --serif:var(--font-display);
}