/* ==========================================================================
   Glacias Theme — Design Tokens (CSS Custom Properties)
   Clean light theme. All visual properties defined here.
   Override via glacias-core Setup Wizard or child theme.
   ========================================================================== */

:root {
    /* --- Brand Colors --- */
    --glacias-primary: var(--user-primary, #2563eb);
    --glacias-primary-light: var(--user-primary-light, #3b82f6);
    --glacias-primary-dark: var(--user-primary-dark, #1d4ed8);
    --glacias-primary-bg: var(--user-primary-bg, #eff6ff);
    --glacias-secondary: var(--user-secondary, #1a1a2e);
    --glacias-accent: var(--user-accent, #f59e0b);
    --glacias-accent-light: var(--user-accent-light, #fbbf24);

    /* --- CTA Colors --- */
    --glacias-cta: #16a34a;
    --glacias-cta-hover: #15803d;
    --glacias-cta-light: #f0fdf4;
    --glacias-score: #f59e0b;
    --glacias-score-bg: #fffbeb;
    --glacias-pro: #059669;
    --glacias-pro-bg: #f0fdf4;
    --glacias-con: #dc2626;
    --glacias-con-bg: #fef2f2;

    /* --- Neutral Palette --- */
    --glacias-bg: var(--user-bg, #ffffff);
    --glacias-bg-alt: var(--user-bg-alt, #f7f8fa);
    --glacias-bg-muted: var(--user-bg-muted, #f7f8fa);
    --glacias-text: var(--user-text, #1a1a2e);
    --glacias-text-light: var(--user-text-light, #6b7280);
    --glacias-text-muted: var(--user-text-muted, #9ca3af);
    --glacias-border: var(--user-border, #e5e7eb);
    --glacias-border-light: var(--user-border-light, #f0f1f3);

    /* --- Semantic Colors --- */
    --glacias-success: var(--user-success, #16a34a);
    --glacias-warning: var(--user-warning, #f59e0b);
    --glacias-error: var(--user-error, #dc2626);
    --glacias-info: var(--user-info, #2563eb);

    /* --- Typography --- */
    --glacias-display-font: var(--user-display-font, 'Inter', -apple-system, BlinkMacSystemFont, sans-serif);
    --glacias-body-font: var(--user-body-font, 'Inter', -apple-system, BlinkMacSystemFont, sans-serif);
    --glacias-mono-font: var(--user-mono-font, 'SF Mono', 'Fira Code', monospace);

    --glacias-fs-xs: 0.75rem;
    --glacias-fs-sm: 0.875rem;
    --glacias-fs-base: 1rem;
    --glacias-fs-lg: 1.125rem;
    --glacias-fs-xl: 1.25rem;
    --glacias-fs-2xl: 1.5rem;
    --glacias-fs-3xl: 1.875rem;
    --glacias-fs-4xl: 2.25rem;
    --glacias-fs-5xl: 3rem;
    --glacias-fs-6xl: 4rem;

    --glacias-lh-tight: 1.25;
    --glacias-lh-snug: 1.4;
    --glacias-lh-base: 1.75;
    --glacias-lh-relaxed: 1.8;

    --glacias-fw-normal: 400;
    --glacias-fw-medium: 500;
    --glacias-fw-semibold: 600;
    --glacias-fw-bold: 700;
    --glacias-fw-extrabold: 800;

    /* --- Spacing --- */
    --glacias-space-1: 0.25rem;
    --glacias-space-2: 0.5rem;
    --glacias-space-3: 0.75rem;
    --glacias-space-4: 1rem;
    --glacias-space-5: 1.25rem;
    --glacias-space-6: 1.5rem;
    --glacias-space-8: 2rem;
    --glacias-space-10: 2.5rem;
    --glacias-space-12: 3rem;
    --glacias-space-16: 4rem;
    --glacias-space-20: 5rem;
    --glacias-space-24: 6rem;

    /* --- Border Radius --- */
    --glacias-radius-sm: var(--user-radius-sm, 4px);
    --glacias-radius-md: var(--user-radius-md, 8px);
    --glacias-radius-lg: var(--user-radius-lg, 12px);
    --glacias-radius-xl: var(--user-radius-xl, 16px);
    --glacias-radius-full: 9999px;

    /* --- Shadows --- */
    --glacias-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06);
    --glacias-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
    --glacias-shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.12);
    --glacias-shadow-hover: 0 12px 40px rgba(0, 0, 0, 0.12);
    --glacias-shadow-cta: 0 4px 14px rgba(22, 163, 74, 0.3);
    --glacias-shadow-cta-hover: 0 6px 20px rgba(22, 163, 74, 0.35);

    /* --- Transitions --- */
    --glacias-transition: all 0.2s ease;
    --glacias-transition-fast: all 0.15s ease;

    /* --- Layout --- */
    --glacias-max-width: var(--user-max-width, 1200px);
    --glacias-content-width: 800px;
    --glacias-container-narrow: 800px;
    --glacias-container-wide: 1400px;
    --glacias-header-height: 64px;

    /* --- Breakpoints (reference, used in media queries) ---
       Mobile:       < 480px
       Mobile-Wide:  480px - 767px
       Tablet:       768px - 1023px
       Desktop:      1024px - 1279px
       Desktop-Wide: 1280px - 1439px
       Ultra-Wide:   >= 1440px
    */
}
