/* Estimate Flow — brand color tokens */
/* Single source of truth for all colors used by admin + customer portal.
 *
 * v3.22.0 — REPOINTED to the canonical SWG SaaS Design System
 * (docs/swg-saas-design-system.md). Estimate Flow is a SaaS-style
 * application (admin console + customer portal + CRM-like reporting), so
 * per the agency SaaS exception it adopts the SaaS palette (#2563EB
 * primary) instead of the marketing-brand electric blue (#38A8D8). The
 * electric-blue marketing accent is retained for email templates only,
 * which use hardcoded hex inline styles per Email_Template::COLOR_*
 * (email clients strip external CSS — that exception predates v3.22.0).
 *
 * Design philosophy: modern, professional, organized, premium, easy to
 * navigate, fast, consistent. Inspiration: ClickUp / Linear / Asana /
 * HubSpot / Harvest / Notion / Monday.com. Calm surfaces, one clear
 * primary color, white cards on a soft gray canvas, functional icons,
 * never more than one thing competing for attention.
 *
 * WCAG-AA discipline:
 *  - Bright "500-level" accents (#22C55E green / #F59E0B amber /
 *    #06B6D4 cyan / #8B5CF6 purple / #EC4899 pink) are DECORATION ONLY
 *    — icon-container fills, status dots, progress bars. NEVER body text.
 *  - For colored TEXT, use the *-dark variant (success-dark #15803D,
 *    warning-dark #B45309, etc.) which passes AA on white.
 *  - #2563EB primary passes AA on white (5.17:1) for text OR fill.
 *  - White on #2563EB is safe (5.17:1); white on #22C55E / #F59E0B is NOT
 *    (~1.7-1.9:1) — never put white text on those.
 */

:root {
    /* Surfaces */
    --swg-bg:            #ffffff;  /* Card / panel background */
    --swg-canvas:        #f8fafc;  /* Page background (NEW v3.22.0) */
    --swg-surface:       #f8fafc;  /* Soft inset surfaces + row hover */
    --swg-surface-hover: #eef2f7;  /* Hover state on surfaces */
    --swg-line:          #e2e8f0;  /* Borders / dividers */

    /* Text */
    --swg-text:          #0f172a;  /* Headings + metric values (was #1d2327) */
    --swg-body:          #334155;  /* Body copy (NEW v3.22.0) */
    --swg-muted:         #64748b;  /* Helper / captions / field labels */

    /* Primary accent — SaaS cobalt */
    --swg-accent:        #2563eb;  /* Primary buttons, links, active nav (was #38A8D8) */
    --swg-accent-soft:   #eff6ff;  /* Soft tint — active nav, hover fills (was rgba(56,168,216,0.12)) */
    --swg-accent-dark:   #1d4ed8;  /* Hover state, ALL text use (was #1d6588) */

    /* Status colors — DECORATION variants */
    --swg-success:       #22c55e;  /* Decoration only — fills, dots */
    --swg-success-soft:  #ecfdf5;  /* Soft tint — backgrounds */
    --swg-success-dark:  #15803d;  /* TEXT variant (passes AA, NEW v3.22.0) */
    --swg-error:         #ef4444;  /* Decoration only — icon, fills */
    --swg-error-soft:    #fef2f2;  /* Soft tint — backgrounds */
    --swg-error-dark:    #dc2626;  /* TEXT variant (passes AA, NEW v3.22.0) */
    --swg-error-darker:  #b91c1c;  /* Darker TEXT variant — clears AA (~5.9:1) on --swg-error-soft where --swg-error-dark is 4.41:1 (NEW v3.25.6) */
    --swg-warning:       #f59e0b;  /* Decoration only — fills */
    --swg-warning-soft:  #fff7ed;  /* Soft tint — backgrounds */
    --swg-warning-dark:  #b45309;  /* TEXT variant (passes AA, NEW v3.22.0) */

    /* Stat-card accent hues — ONE per metric, DECORATION ONLY on icon containers */
    --swg-c-blue:        #2563eb;  /* Same as accent — used for blue stat cards */
    --swg-c-blue-soft:   #eff6ff;
    --swg-c-green:       #22c55e;
    --swg-c-green-soft:  #ecfdf5;
    --swg-c-purple:      #8b5cf6;
    --swg-c-purple-soft: #f5f3ff;
    --swg-c-amber:       #f59e0b;
    --swg-c-amber-soft:  #fff7ed;
    --swg-c-cyan:        #06b6d4;
    --swg-c-cyan-soft:   #ecfeff;
    --swg-c-pink:        #ec4899;
    --swg-c-pink-soft:   #fdf2f8;

    /* Connection badge variants (integration cards, status pills) */
    --swg-badge-on-bg:   #dcfce7;
    --swg-badge-on-tx:   #15803d;
    --swg-badge-off-bg:  #fee2e2;
    --swg-badge-off-tx:  #dc2626;

    /* Spacing — 8/16/24 scale preserved */
    --swg-space-sm:      8px;
    --swg-space:         16px;
    --swg-space-lg:      24px;
    --swg-space-xl:      32px;  /* NEW v3.22.0 — for section gaps */

    /* Radius — bumped up for SaaS feel */
    --swg-radius-sm:     6px;    /* NEW v3.22.0 — small chips, pills */
    --swg-radius:        8px;    /* Was 4px — buttons, inputs */
    --swg-radius-lg:     12px;   /* Was 8px — cards */
    --swg-radius-xl:     18px;   /* NEW v3.22.0 — framed container, big cards */

    /* Shadows — soft SaaS depth (replaced) */
    --swg-shadow-sm:     0 1px 2px rgba(15, 23, 42, 0.04);
    --swg-shadow:        0 4px 12px rgba(15, 23, 42, 0.06);
    --swg-shadow-lg:     0 10px 30px rgba(15, 23, 42, 0.08);
    --swg-shadow-xl:     0 18px 45px rgba(15, 23, 42, 0.08);  /* Framed container */

    /* Focus ring — for keyboard a11y */
    --swg-focus-ring:    0 0 0 3px rgba(37, 99, 235, 0.18);  /* NEW v3.22.0 */

    /* Typography — Inter as primary, falls back to system stack */
    --swg-font:          'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;  /* NEW v3.22.0 */

    /* Touch targets */
    --swg-touch-target:  44px;
}
