// ============================================
// BILLIT - McMaster-Carr Inspired Design System
// Industrial, Dense, Functional, No Roundedness
// ============================================

// Colors - Industrial palette
$color-black: #000000;
$color-white: #ffffff;
$color-gray-50: #fafafa;
$color-gray-100: #f5f5f5;
$color-gray-200: #eeeeee;
$color-gray-300: #e0e0e0;
$color-gray-400: #bdbdbd;
$color-gray-500: #9e9e9e;
$color-gray-600: #757575;
$color-gray-700: #616161;
$color-gray-800: #424242;
$color-gray-900: #212121;

// Primary - Industrial orange (McMaster signature)
$color-primary: #e65100;
$color-primary-dark: #bf360c;
$color-primary-light: #ff6d00;

// Accent - Deep blue for links/actions
$color-accent: #0d47a1;
$color-accent-dark: #002171;
$color-accent-light: #1565c0;

// Status colors
$color-success: #2e7d32;
$color-warning: #f57c00;
$color-error: #c62828;
$color-info: #1565c0;

// Typography
$font-family-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
$font-family-mono: "SF Mono", "Monaco", "Inconsolata", "Fira Mono", "Droid Sans Mono", monospace;

$font-size-xs: 0.6875rem;   // 11px
$font-size-sm: 0.75rem;     // 12px
$font-size-base: 0.8125rem; // 13px
$font-size-md: 0.875rem;    // 14px
$font-size-lg: 1rem;        // 16px
$font-size-xl: 1.125rem;    // 18px
$font-size-2xl: 1.25rem;    // 20px
$font-size-3xl: 1.5rem;     // 24px

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

$line-height-tight: 1.2;
$line-height-base: 1.4;
$line-height-loose: 1.6;

// Spacing - Dense, compact
$spacing-0: 0;
$spacing-1: 0.125rem;  // 2px
$spacing-2: 0.25rem;   // 4px
$spacing-3: 0.375rem;  // 6px
$spacing-4: 0.5rem;    // 8px
$spacing-5: 0.625rem;  // 10px
$spacing-6: 0.75rem;   // 12px
$spacing-8: 1rem;      // 16px
$spacing-10: 1.25rem;  // 20px
$spacing-12: 1.5rem;   // 24px
$spacing-16: 2rem;     // 32px
$spacing-20: 2.5rem;   // 40px

// Borders - Sharp, no radius
$border-width: 1px;
$border-width-2: 2px;
$border-color: $color-gray-300;
$border-color-dark: $color-gray-400;
$border-radius: 0; // NO ROUNDEDNESS

// Shadows - Minimal
$shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.1);
$shadow-md: 0 2px 4px rgba(0, 0, 0, 0.1);
$shadow-lg: 0 4px 8px rgba(0, 0, 0, 0.15);

// Transitions
$transition-fast: 0.1s ease;
$transition-base: 0.15s ease;
$transition-slow: 0.25s ease;

// Layout
$max-width-sm: 640px;
$max-width-md: 768px;
$max-width-lg: 1024px;
$max-width-xl: 1280px;
$max-width-2xl: 1536px;

// Header
$header-height: 40px;
$header-bg: $color-black;
$header-text: $color-white;

// Table
$table-header-bg: $color-gray-100;
$table-border: $color-gray-300;
$table-row-hover: $color-gray-50;
$table-cell-padding: $spacing-3 $spacing-4;

// Form inputs
$input-height: 28px;
$input-padding: $spacing-2 $spacing-4;
$input-border: $border-color;
$input-focus-border: $color-accent;
$input-bg: $color-white;

// Buttons
$btn-height: 28px;
$btn-padding: $spacing-2 $spacing-6;