/**
 * WEAM Design System — Token File
 * Single source of truth for all visual tokens.
 * Locked: 2026-02-23 (DESIGN-SYSTEM.md)
 *
 * Load BEFORE all other WEAM stylesheets.
 * No component styles here — tokens only.
 */

:root {

    /* ═══════════════════════════════════════
       BRAND — Purple
       ═══════════════════════════════════════ */
    --weam-purple-50:  #EEF2FF;  /* Selected cell bg, active tab bg (settings) */
    --weam-purple-100: #E0E7FF;  /* Focus glow ring */
    --weam-purple-200: #C7D2FE;  /* Light purple borders */
    --weam-purple-300: #A5B4FC;  /* Decorative borders */
    --weam-purple-400: #818CF8;  /* — reserved — */
    --weam-purple-500: #6366F1;  /* Active selections, focus borders, links, checkbox accent */
    --weam-purple-600: #4F46E5;  /* Pro badge text */
    --weam-purple-700: #4338CA;  /* Active tab text (settings), selected cell text */

    /* ═══════════════════════════════════════
       BRAND — Amber (CTD dot accent only)
       ═══════════════════════════════════════ */
    --weam-amber-100: #FEF3C7;  /* Warning badge bg (light) */
    --weam-amber-300: #FCD34D;  /* Highlight text on dark bg */
    --weam-amber-400: #FBBF24;  /* Calibration icon */
    --weam-amber-500: #F59E0B;  /* CTD dot, toggle knob (product editor) */
    --weam-amber:    #F59E0B;  /* Alias for --weam-amber-500 */
    --weam-amber-600: #D97706;  /* Amber emphasis text */
    --weam-amber-700: #B45309;  /* Dark amber text */
    --weam-amber-800: #92400E;  /* Scanner/pricing header accent */

    /* ═══════════════════════════════════════
       NEUTRAL — Slate
       ═══════════════════════════════════════ */
    --weam-slate-50:  #F8FAFC;  /* Card header/footer bg, disabled input bg */
    --weam-slate-100: #F1F5F9;  /* Cell dividers, badge bg, internal separators */
    --weam-slate-200: #E2E8F0;  /* Card borders, section dividers, table borders */
    --weam-slate-300: #CBD5E1;  /* Input borders, toggle track (off), ghost dot */
    --weam-slate-400: #94A3B8;  /* Field labels, hints, placeholders, secondary text */
    --weam-slate-500: #64748B;  /* Body secondary text, toggle labels */
    --weam-slate-600: #475569;  /* Ghost button text */
    --weam-slate-700: #334155;  /* Button hover bg */
    --weam-slate-800: #1E293B;  /* CTD button bg, toggle track (on), primary text */
    --weam-slate-900: #0F172A;  /* Page titles, header gradient */

    /* ═══════════════════════════════════════
       SEMANTIC — Status colors
       ═══════════════════════════════════════ */
    --weam-success:      #16a34a;  /* Success badges, synced status */
    --weam-green:        #16a34a;  /* Alias for --weam-success */
    --weam-success-light: #F0FDF4;  /* Success card header tint */
    --weam-error:        #DC2626;  /* Error badges, danger buttons, danger dots */
    --weam-error-dark:   #991B1B;  /* Danger button hover only */
    --weam-error-light:  #FEF2F2;  /* Error card header tint */
    --weam-warning:      #F59E0B;  /* Warning badges (same as amber) */
    --weam-warning-light: #FFFBEB;  /* Warning card header tint */
    --weam-info:         #2271b1;  /* WP info notices only (not WEAM components) */
    --weam-info-light:   #F0F6FC;  /* WP info notice bg */

    /* ═══════════════════════════════════════
       ALIASES — Backward-compatible shorthands
       ═══════════════════════════════════════ */
    --weam-border: var(--weam-slate-200);   /* Default border color (22 uses) */
    --weam-border-strong: var(--weam-slate-300); /* Stronger borders */
    --weam-text:   var(--weam-slate-800);   /* Primary text color */
    --weam-text-muted: var(--weam-slate-400); /* Muted/secondary text */
    --weam-muted:  var(--weam-slate-500);   /* Body secondary */

    /* ═══════════════════════════════════════
       FOCUS RING — Purple everywhere
       ═══════════════════════════════════════ */
    --weam-focus-ring: var(--weam-purple-500);  /* Focus border color */
    --weam-focus-glow: var(--weam-purple-100);  /* Focus box-shadow (2px) */

    /* ═══════════════════════════════════════
       TYPOGRAPHY — 9 sizes, 4 weights, 3 line heights
       ═══════════════════════════════════════ */

    /* Font family */
    --weam-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --weam-font-mono: ui-monospace, SFMono-Regular, 'SF Mono', Menlo, 'Consolas', monospace;

    /* Type scale */
    --weam-text-2xs:  9px;   /* Micro labels, image captions */
    --weam-text-xs:   10px;  /* Field labels (uppercase), badges */
    --weam-text-sm:   11px;  /* Hints, counts, secondary info */
    --weam-text-base: 12px;  /* Body text, inputs, cell content */
    --weam-text-md:   13px;  /* Buttons, nav, primary UI text (WP admin default) */
    --weam-text-lg:   14px;  /* Card titles, section labels */
    --weam-text-xl:   16px;  /* Tab/page section headings */
    --weam-text-2xl:  20px;  /* Page titles */
    --weam-text-3xl:  28px;  /* Marketing/onboarding only */

    /* Weights */
    --weam-font-normal: 400;  /* Body text, descriptions */
    --weam-font-medium: 500;  /* Buttons, links, interactive */
    --weam-font-semi:   600;  /* Card titles, labels, active nav */
    --weam-font-bold:   700;  /* Page titles, section headings */

    /* Line heights */
    --weam-leading-none:   1;    /* Single-line: badges, buttons, bars */
    --weam-leading-tight:  1.3;  /* Headings, compact multi-line */
    --weam-leading-normal: 1.5;  /* Body text, descriptions, paragraphs */

    /* Letter spacing */
    --weam-tracking-label: 0.04em;  /* Uppercase field labels only */
    --weam-tracking-tight: -0.01em; /* Large headings (28px+) only */

    /* ═══════════════════════════════════════
       SPACING — 4px base grid
       ═══════════════════════════════════════ */
    --weam-sp-1:  4px;   /* Inner gaps: icon↔label, badge padding */
    --weam-sp-2:  8px;   /* Default gap: input padding, cell padding, grid gaps */
    --weam-sp-3:  12px;  /* Card/bar padding, field groups, list gaps */
    --weam-sp-4:  16px;  /* Section padding, panel content, card body */
    --weam-sp-5:  20px;  /* WP content area padding */
    --weam-sp-6:  24px;  /* Large sections, modal padding, settings blocks */
    --weam-sp-8:  32px;  /* Page-level separators */

    /* ═══════════════════════════════════════
       COMPONENT HEIGHTS
       ═══════════════════════════════════════ */
    --weam-h-input:  28px;  /* All text inputs, selects, search fields */
    --weam-h-bar-sm: 36px;  /* Info bars, card footers */
    --weam-h-bar-md: 40px;  /* Card headers, action bars */
    --weam-h-bar-lg: 48px;  /* Page-level toolbars, section headers */

    /* ═══════════════════════════════════════
       BORDER RADIUS — Medium corners
       ═══════════════════════════════════════ */
    --weam-r-sm:   4px;    /* Inputs, small elements */
    --weam-r-md:   6px;    /* Cards, buttons, panels */
    --weam-r-lg:   8px;    /* Settings page header, modals */
    --weam-r-pill:  12px;  /* Badges, pills */
    --weam-r-full: 9999px; /* Circles (legacy compat) */

    /* Retired aliases — map old names to new */
    --weam-r-xl:  var(--weam-r-pill);  /* Old name for 12px */
    --weam-r-2xl: 16px;                /* Settings page shell — legacy */

    /* ═══════════════════════════════════════
       SHADOWS
       ═══════════════════════════════════════ */
    --weam-shadow-sm:  0 1px 3px rgba(0, 0, 0, 0.08);
    --weam-shadow-md:  0 2px 8px rgba(0, 0, 0, 0.06);
    --weam-shadow-lg:  0 10px 15px -3px rgba(0, 0, 0, 0.1);
    --weam-shadow-ctd: 0 1px 3px rgba(0, 0, 0, 0.15);  /* CTD socket shadow */

    /* ═══════════════════════════════════════
       PAGE HEADER GRADIENTS — one per page context
       ═══════════════════════════════════════ */
    --weam-ph-settings-from:   #4338ca;
    --weam-ph-settings-to:     #6366f1;
    --weam-ph-editor-from:     #1e293b;
    --weam-ph-editor-to:       #334155;
    --weam-ph-attributes-from: #3730a3;
    --weam-ph-attributes-to:   #4f46e5;
    --weam-ph-pricing-from:    #065f46;
    --weam-ph-pricing-to:      #059669;
    --weam-ph-scanner-from:    #92400e;
    --weam-ph-scanner-to:      #d97706;
    --weam-ph-security-from:   #991b1b;
    --weam-ph-security-to:     #dc2626;
    --weam-ph-channels-from:   #1e40af;
    --weam-ph-channels-to:     #3b82f6;

}