/* ============================================================
   GrowMint Media — Design Tokens  ("Mint & Ink" system)
   Single source of truth. Re-theme the whole brand from here.
   ============================================================ */

:root {
  /* ---- Brand core ---- */
  --gm-mint:            #2BE8A8;  /* primary / hero accent            */
  --gm-emerald:         #0E9E72;  /* primary brand color              */
  --gm-gold:            #E7C26B;  /* champagne gold — restrained luxe */
  --gm-mint-rgb:        43, 232, 168;
  --gm-emerald-rgb:     14, 158, 114;
  --gm-gold-rgb:        231, 194, 107;

  /* Signature gradient (mint -> emerald) */
  --gm-gradient:        linear-gradient(135deg, #2BE8A8 0%, #0E9E72 100%);
  --gm-gradient-soft:   linear-gradient(135deg, rgba(43,232,168,.16) 0%, rgba(14,158,114,.16) 100%);
  --gm-gold-gradient:   linear-gradient(135deg, #F0D690 0%, #E7C26B 55%, #C9A24E 100%);

  /* ---- Mint tints / shades ---- */
  --gm-mint-50:  #E9FCF5;
  --gm-mint-100: #C9F7E6;
  --gm-mint-200: #97F0D0;
  --gm-mint-300: #5FE9B9;
  --gm-mint-400: #2BE8A8;  /* = mint */
  --gm-mint-500: #18C892;
  --gm-mint-600: #0E9E72;  /* = emerald */
  --gm-mint-700: #0B7E5B;
  --gm-mint-800: #0A5F46;
  --gm-mint-900: #084233;

  /* ---- Dark UI base (default theme) ---- */
  --gm-bg:        #0B1410;
  --gm-surface:   #12201A;
  --gm-surface-2: #1A2C23;
  --gm-border:    #26382E;
  --gm-text:      #ECF6F0;
  --gm-muted:     #8FA89C;

  /* ---- Light theme (print / PDF / docs) ---- */
  --gm-l-bg:      #F7FAF8;
  --gm-l-surface: #FFFFFF;
  --gm-l-border:  #E2EBE6;
  --gm-l-text:    #0B1410;
  --gm-l-muted:   #5A6B62;

  /* ---- Status (kept distinct from mint brand color) ---- */
  --gm-success: #34D399;
  --gm-info:    #38BDF8;
  --gm-warning: #F5B544;
  --gm-danger:  #F26D6D;
  --gm-purple:  #9B8CFA;

  /* ---- Typography ---- */
  --gm-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --gm-font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* Type scale (1.250 major-third, 16px base) */
  --gm-text-xs:   0.75rem;   /* 12 */
  --gm-text-sm:   0.875rem;  /* 14 */
  --gm-text-base: 1rem;      /* 16 */
  --gm-text-md:   1.125rem;  /* 18 */
  --gm-text-lg:   1.25rem;   /* 20 */
  --gm-text-xl:   1.5rem;    /* 24 */
  --gm-text-2xl:  1.953rem;  /* ~31 */
  --gm-text-3xl:  2.441rem;  /* ~39 */
  --gm-text-4xl:  3.052rem;  /* ~49 */
  --gm-text-5xl:  3.815rem;  /* ~61 */

  --gm-weight-light:    300;
  --gm-weight-regular:  400;
  --gm-weight-medium:   500;
  --gm-weight-semibold: 600;
  --gm-weight-bold:     700;
  --gm-weight-black:    900;

  --gm-leading-tight:   1.1;
  --gm-leading-snug:    1.25;
  --gm-leading-normal:  1.55;
  --gm-leading-relaxed: 1.7;

  --gm-tracking-tight:  -0.02em;
  --gm-tracking-snug:   -0.01em;
  --gm-tracking-normal: 0;
  --gm-tracking-wide:   0.08em;  /* eyebrows / labels */

  /* ---- Spacing (4px base) ---- */
  --gm-space-1: 4px;
  --gm-space-2: 8px;
  --gm-space-3: 12px;
  --gm-space-4: 16px;
  --gm-space-5: 24px;
  --gm-space-6: 32px;
  --gm-space-7: 48px;
  --gm-space-8: 64px;
  --gm-space-9: 96px;

  /* ---- Radius ---- */
  --gm-radius-sm: 6px;
  --gm-radius:    10px;   /* default card radius (8–12) */
  --gm-radius-lg: 14px;
  --gm-radius-xl: 20px;
  --gm-radius-pill: 999px;

  /* ---- Shadows / glows ---- */
  --gm-shadow-sm: 0 1px 2px rgba(0,0,0,.30);
  --gm-shadow:    0 8px 24px rgba(0,0,0,.35);
  --gm-shadow-lg: 0 24px 60px rgba(0,0,0,.45);
  --gm-glow-mint: 0 0 0 1px rgba(43,232,168,.25), 0 8px 40px rgba(43,232,168,.18);
  --gm-glow-gold: 0 0 0 1px rgba(231,194,107,.30), 0 8px 32px rgba(231,194,107,.16);

  /* Radial brand glows for backgrounds */
  --gm-radial-mint: radial-gradient(60% 60% at 50% 0%, rgba(43,232,168,.14) 0%, rgba(43,232,168,0) 70%);
  --gm-radial-emerald: radial-gradient(50% 50% at 80% 20%, rgba(14,158,114,.18) 0%, rgba(14,158,114,0) 70%);

  /* ---- Layout ---- */
  --gm-maxw: 1120px;
}
