/* ==========================================================================
   Crm design tokens  —  spec: docs/features/62-ui-ux-design-system.md
   Single source of truth. Rebranding = change this file only.
   ========================================================================== */

:root {
    /* ---- Neutrals ---- */
    --bg-page: #E9EAF2;
    --bg-surface: #FFFFFF;
    --bg-subtle: #F9FAFB;
    --bg-muted: #F3F4F6;
    --bg-inset: #F7F8FA;

    --border: #E5E7EB;
    --border-strong: #D1D5DB;

    --text-primary: #111827;
    --text-secondary: #6B7280;
    --text-tertiary: #9CA3AF;
    --text-inverse: #FFFFFF;

    /* ---- Actions & accents ---- */
    --action-primary: #111111;
    --action-primary-hover: #2A2A2A;
    --accent-link: #2563EB;
    --accent-link-hover: #1D4ED8;

    /* AI — reserved exclusively for AI affordances */
    --accent-ai: #7C3AED;
    --accent-ai-bg: #F5F3FF;
    --accent-ai-border: #DDD6FE;

    --focus-ring: rgba(17, 17, 17, .12);

    /* ---- Semantic status pairs (tag text / tag background / dot) ---- */
    --tag-neutral-fg: #374151;
    --tag-neutral-bg: #F3F4F6;
    --tag-neutral-dot: #6B7280;

    --tag-info-fg: #1D4ED8;
    --tag-info-bg: #EFF6FF;
    --tag-info-dot: #3B82F6;

    --tag-success-fg: #15803D;
    --tag-success-bg: #F0FDF4;
    --tag-success-dot: #22C55E;

    --tag-warning-fg: #B45309;
    --tag-warning-bg: #FFFBEB;
    --tag-warning-dot: #F59E0B;

    --tag-danger-fg: #B91C1C;
    --tag-danger-bg: #FEF2F2;
    --tag-danger-dot: #EF4444;

    --tag-rose-fg: #BE185D;
    --tag-rose-bg: #FDF2F8;
    --tag-rose-dot: #EC4899;

    --tag-violet-fg: #6D28D9;
    --tag-violet-bg: #F5F3FF;
    --tag-violet-dot: #8B5CF6;

    /* ---- Charts ---- */
    --chart-1: #8B5CF6;
    --chart-1-soft: #C4B5FD;
    --chart-1-faint: #EDE9FE;
    --chart-2: #22C55E;
    --chart-grid: #E5E7EB;

    /* ---- Typography ---- */
    --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;

    --t-page-title-size: 20px;   --t-page-title-weight: 600;  --t-page-title-lh: 28px;
    --t-panel-title-size: 16px;  --t-panel-title-weight: 600; --t-panel-title-lh: 24px;
    --t-record-title-size: 22px; --t-record-title-weight: 600;--t-record-title-lh: 30px;
    --t-section-size: 14px;      --t-section-weight: 600;     --t-section-lh: 20px;
    --t-body-size: 14px;         --t-body-weight: 400;        --t-body-lh: 20px;
    --t-body-medium-weight: 500;
    --t-label-size: 13px;        --t-label-weight: 500;       --t-label-lh: 18px;
    --t-meta-size: 12px;         --t-meta-weight: 400;        --t-meta-lh: 16px;
    --t-stat-size: 24px;         --t-stat-weight: 600;        --t-stat-lh: 32px;

    /* ---- Space (4px base) ---- */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-10: 40px;

    /* ---- Radius ---- */
    --radius-sm: 6px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-full: 999px;

    /* ---- Shadow ---- */
    --shadow-sm: 0 1px 2px rgba(16, 24, 40, .05);
    --shadow-md: 0 4px 8px -2px rgba(16, 24, 40, .08), 0 2px 4px -2px rgba(16, 24, 40, .04);
    --shadow-lg: 0 12px 24px -6px rgba(16, 24, 40, .10), 0 4px 8px -4px rgba(16, 24, 40, .05);
    --shadow-panel: -8px 0 24px -8px rgba(16, 24, 40, .10);
    --shadow-shell: 0 24px 48px -12px rgba(16, 24, 40, .12);

    /* ---- Motion ---- */
    --motion-fast: 120ms cubic-bezier(.4, 0, .2, 1);
    --motion-base: 200ms cubic-bezier(.4, 0, .2, 1);
    --motion-panel: 280ms cubic-bezier(.32, .72, 0, 1);

    /* ---- Layout ---- */
    --sidebar-width: 216px;
    --sidebar-rail-width: 64px;
    --slideover-width: 460px;
    --slideover-width-wide: 720px;
    --row-height: 44px;
    --control-height: 40px;
    --control-height-sm: 32px;
    --control-height-md: 36px;
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --motion-fast: 1ms;
        --motion-base: 1ms;
        --motion-panel: 1ms;
    }
}