// Fusion bank reconciliation design tokens.
//
// Mirrors Enterprise's color/spacing scale where it makes sense, with
// fusion-specific additions for AI confidence bands and the suggestion
// strip. All values can be overridden in dark_mode.scss.

// ============================================================
// Colors — semantic
// ============================================================
$fusion-color-bg-primary:          #ffffff;
$fusion-color-bg-secondary:        #f9fafb;
$fusion-color-bg-tertiary:         #f3f4f6;
$fusion-color-border:              #e5e7eb;
$fusion-color-border-strong:       #d1d5db;

$fusion-color-text-primary:        #111827;
$fusion-color-text-secondary:      #6b7280;
$fusion-color-text-muted:          #9ca3af;
$fusion-color-text-inverse:        #ffffff;

$fusion-color-accent:              #3b82f6;  // primary brand blue
$fusion-color-accent-hover:        #2563eb;
$fusion-color-accent-bg:           #eff6ff;

// ============================================================
// AI Confidence band colors
// ============================================================
$fusion-confidence-high:           #10b981;  // green
$fusion-confidence-high-bg:        #ecfdf5;
$fusion-confidence-medium:         #f59e0b;  // amber
$fusion-confidence-medium-bg:      #fffbeb;
$fusion-confidence-low:            #ef4444;  // red
$fusion-confidence-low-bg:         #fef2f2;
$fusion-confidence-none:           #9ca3af;  // gray
$fusion-confidence-none-bg:        #f3f4f6;

// ============================================================
// Reconciliation state colors
// ============================================================
$fusion-state-pending-bg:          #fef3c7;  // amber-100
$fusion-state-reconciled-bg:       #d1fae5;  // emerald-100
$fusion-state-partial-bg:          #fde68a;  // amber-200

// ============================================================
// Spacing scale (4px increments)
// ============================================================
$fusion-space-1:                   0.25rem;  //  4px
$fusion-space-2:                   0.5rem;   //  8px
$fusion-space-3:                   0.75rem;  // 12px
$fusion-space-4:                   1rem;     // 16px
$fusion-space-5:                   1.25rem;  // 20px
$fusion-space-6:                   1.5rem;   // 24px
$fusion-space-8:                   2rem;     // 32px

// ============================================================
// Typography
// ============================================================
$fusion-font-family:               -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
$fusion-font-size-xs:              0.75rem;  // 12px
$fusion-font-size-sm:              0.875rem; // 14px
$fusion-font-size-base:            1rem;     // 16px
$fusion-font-size-lg:              1.125rem; // 18px
$fusion-font-size-xl:              1.25rem;  // 20px

$fusion-font-weight-normal:        400;
$fusion-font-weight-medium:        500;
$fusion-font-weight-semibold:      600;
$fusion-font-weight-bold:          700;

// ============================================================
// Borders + radii
// ============================================================
$fusion-border-radius-sm:          0.25rem;
$fusion-border-radius:             0.375rem;
$fusion-border-radius-md:          0.5rem;
$fusion-border-radius-lg:          0.75rem;

// ============================================================
// Shadows
// ============================================================
$fusion-shadow-sm:                 0 1px 2px 0 rgba(0, 0, 0, 0.05);
$fusion-shadow:                    0 1px 3px 0 rgba(0, 0, 0, 0.1);
$fusion-shadow-md:                 0 4px 6px -1px rgba(0, 0, 0, 0.1);
$fusion-shadow-lg:                 0 10px 15px -3px rgba(0, 0, 0, 0.1);

// ============================================================
// Animation
// ============================================================
$fusion-transition-fast:           150ms ease-in-out;
$fusion-transition-base:           200ms ease-in-out;
$fusion-transition-slow:           300ms ease-in-out;