/**
 * Enhanced Color System for Work Orders Manager
 * WCAG 2.1 AA Compliant Color Palette with Mobile Optimization
 */

:root {
  /* Dana Hall Brand Colors - Enhanced for Better Contrast */
  --dana-blue-dark: #1a1d4a;     /* Darker for better contrast (was #32357d) */
  --dana-blue-medium: #32357d;    /* Original dark blue for less critical elements */
  --dana-blue-light: #0088cc;     /* Adjusted for better contrast (was #00b0e7) */
  --dana-blue-pale: #e6f3ff;      /* Very light blue for backgrounds */
  
  /* Transparency variants */
  --dana-blue-dark-90: rgba(26, 29, 74, 0.9);
  --dana-blue-dark-20: rgba(26, 29, 74, 0.2);
  --dana-blue-dark-10: rgba(26, 29, 74, 0.1);
  --dana-blue-dark-05: rgba(26, 29, 74, 0.05);
  --dana-blue-light-20: rgba(0, 136, 204, 0.2);
  --dana-blue-light-10: rgba(0, 136, 204, 0.1);
  
  /* High Contrast Text Colors */
  --text-primary: #1a1a1a;        /* Near black for maximum readability */
  --text-secondary: #4a4a4a;      /* Dark gray for secondary text */
  --text-muted: #6a6a6a;          /* Medium gray, still readable */
  --text-light: #8a8a8a;          /* Light gray for less important text */
  --text-on-dark: #ffffff;        /* White text on dark backgrounds */
  --text-on-light: #1a1a1a;       /* Dark text on light backgrounds */
  
  /* Semantic Colors - Enhanced Contrast */
  --color-success: #0f5132;       /* Dark green for better contrast */
  --color-success-bg: #d1e7dd;    /* Light green background */
  --color-warning: #664d03;       /* Dark yellow-brown for text */
  --color-warning-bg: #fff3cd;    /* Light yellow background */
  --color-danger: #721c24;        /* Dark red for better contrast */
  --color-danger-bg: #f8d7da;     /* Light red background */
  --color-info: var(--dana-blue-dark);
  --color-info-bg: var(--dana-blue-pale);
  
  /* Urgency Colors - Binary System (Emergency Only) */
  --urgency-emergency-bg: #721c24;        /* Emergency - Dark red */
  --urgency-emergency-text: #ffffff;
  /* Normal priority work orders have no special urgency styling */
  
  /* UI Element Colors */
  --border-light: #e5e5e5;        /* Light borders */
  --border-medium: #cccccc;       /* Medium borders */
  --border-strong: #999999;       /* Strong borders */
  --background-body: #fafafa;     /* Page background */
  --background-card: #ffffff;     /* Card backgrounds */
  --background-muted: #f5f5f5;    /* Muted backgrounds */
  --background-hover: var(--dana-blue-dark-05);  /* Hover states */
  --background-active: var(--dana-blue-dark-10); /* Active states */
  
  /* Interactive Colors */
  --link-color: var(--dana-blue-dark);
  --link-hover: #0d1233;          /* Even darker on hover */
  --link-visited: #2d1b69;        /* Slightly different for visited */
  
  /* Focus and Accessibility */
  --focus-color: #005fcc;         /* High contrast focus ring */
  --focus-shadow: 0 0 0 3px rgba(0, 95, 204, 0.3);
  
  /* Shadows - Enhanced for Mobile */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.12);
  --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.15);
  --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.15);
  --shadow-focus: var(--focus-shadow);

  /* Layered Shadows - Multi-depth for modern feel */
  --shadow-sm-layered: 0 1px 3px rgba(0,0,0,0.05), 0 4px 12px rgba(0,0,0,0.08);
  --shadow-md-layered: 0 2px 6px rgba(0,0,0,0.06), 0 8px 24px rgba(0,0,0,0.1);
  --shadow-lg-layered: 0 4px 12px rgba(0,0,0,0.08), 0 16px 48px rgba(0,0,0,0.12);
  --shadow-selection: 0 0 0 3px rgba(0, 136, 204, 0.1);

  /* Pastel Status Colors - WCAG AA Compliant */
  --status-pending-bg: #fef3c7;
  --status-pending-text: #92400e;
  --status-active-bg: #dbeafe;
  --status-active-text: #1e40af;
  --status-assigned-bg: #e0e7ff;
  --status-assigned-text: #3730a3;
  --status-in-progress-bg: #d1fae5;
  --status-in-progress-text: #065f46;
  --status-resolved-bg: #d1d5db;
  --status-resolved-text: #374151;
  --status-cancelled-bg: #f3f4f6;
  --status-cancelled-text: #4b5563;
  --status-emergency-bg: #fee2e2;
  --status-emergency-text: #991b1b;

  /* Transition Tokens */
  --transition-speed: 0.2s;
  --transition-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
  --transition-ease: cubic-bezier(0.4, 0, 0.2, 1);

  /* Bootstrap Color Mappings (WCAG AA Enhanced) */
  --bs-primary: #0d6efd;
  --bs-primary-rgb: 13, 110, 253;
  --bs-secondary: #5a6268;  /* WCAG AA Fix: Darkened from #6c757d (4.45:1 on light bg) to 5.74:1 */
  --bs-secondary-rgb: 90, 98, 104;  /* Updated to match new #5a6268 */
  --bs-success: #198754;
  --bs-success-rgb: 25, 135, 84;
  --bs-info: #0dcaf0;
  --bs-info-rgb: 13, 202, 240;
  --bs-warning: #ffc107;
  --bs-warning-rgb: 255, 193, 7;
  --bs-danger: #dc3545;
  --bs-danger-rgb: 220, 53, 69;
  --bs-light: #f8f9fa;
  --bs-dark: #212529;

  /* Bootstrap Background Variants */
  --bs-primary-bg-subtle: rgba(13, 110, 253, 0.1);
  --bs-success-bg-subtle: rgba(25, 135, 84, 0.1);
  --bs-info-bg-subtle: rgba(13, 202, 240, 0.1);
  --bs-warning-bg-subtle: rgba(255, 193, 7, 0.1);
  --bs-danger-bg-subtle: rgba(220, 53, 69, 0.1);

  /* Gray Scale - Bootstrap Compatible (WCAG AA Enhanced) */
  --bs-gray-50: #f8f9fa;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #e9ecef;
  --bs-gray-300: #8e969d;  /* WCAG AA Fix: Darkened from #dee2e6 (1.30:1) to 3.05:1 for icon/large text WCAG AA compliance */
  --bs-gray-400: #ced4da;  /* Only for borders/backgrounds, not text */
  --bs-gray-500: #5a6268;  /* WCAG AA Fix: Darkened from #adb5bd (2.07:1) then #6c757d (4.45:1) to 5.74:1 */
  --bs-gray-600: #5a6268;  /* WCAG AA Fix: Darkened from #6c757d for better contrast on light backgrounds (was 4.45:1, now 5.74:1) */
  --bs-gray-700: #495057;
  --bs-gray-800: #343a40;
  --bs-gray-900: #212529;

  /* White/Black */
  --color-white: #ffffff;
  --color-black: #000000;

  /* Overlay and Transparency Colors */
  --overlay-light: rgba(255, 255, 255, 0.9);
  --overlay-medium: rgba(0, 0, 0, 0.5);
  --overlay-dark: rgba(0, 0, 0, 0.9);

  /* Glass/Frosted Effects */
  --glass-bg-light: rgba(255, 255, 255, 0.15);
  --glass-bg-medium: rgba(255, 255, 255, 0.2);
  --glass-bg-strong: rgba(255, 255, 255, 0.25);
  --glass-border: rgba(255, 255, 255, 0.2);

  /* Dark Glass Effects */
  --glass-bg-dark-subtle: rgba(0, 0, 0, 0.05);
  --glass-bg-dark-light: rgba(0, 0, 0, 0.08);
  --glass-bg-dark-medium: rgba(0, 0, 0, 0.1);
  --glass-bg-dark-strong: rgba(0, 0, 0, 0.15);

  /* Admin Drawer Colors */
  --admin-drawer-bg-start: rgba(26, 29, 74, 0.98);
  --admin-drawer-bg-end: rgba(50, 53, 125, 0.98);

  /* Menu Overlay Colors */
  --menu-bg-start: rgba(26, 29, 74, 0.95);
  --menu-bg-end: rgba(50, 53, 125, 0.95);

  /* Warning Text (Bootstrap) */
  --bs-warning-text: #856404;

  /* Additional Utility Colors */
  --color-google-red: #ea4335;
  --color-gold: #ffd700;
  --color-cyan: #90caf9;
  --color-light-green: #81c784;
  --color-orange: #f59e0b;
  --color-blue: #2563eb;
  --color-green: #10b981;
  --color-gray-light: #878d98;  /* WCAG AA Fix: Darkened from #e0e0e0 (1.32:1) to #9ca3af (2.54:1) to #878d98 (3.02:1) for large text/icons */
  --color-gray-medium: #5a6268;  /* WCAG AA Fix: Darkened from #6b7280 (4.83:1) to 5.74:1 for better margins */

  /* Gradient Specific Colors */
  --gradient-purple-start: #667eea;
  --gradient-purple-end: #764ba2;

  /* Admin Gradient Colors */
  --admin-gradient-dark: #1e3a5f;
  --admin-gradient-medium: #4a6fa5;

  /* Info Gradient Colors */
  --info-gradient-start: #0dcaf0;
  --info-gradient-mid: #0aa2c0;
  --info-gradient-end: #087990;

  /* Primary Gradient Colors */
  --primary-gradient-start: #0d6efd;
  --primary-gradient-mid: #0a58ca;
  --primary-gradient-end: #084298;

  /* Warning Gradient Colors */
  --warning-gradient-start: #ffc107;
  --warning-gradient-mid: #e0a800;
  --warning-gradient-end: #c29400;

  /* Secondary Gradient Colors */
  --secondary-gradient-start: #6c757d;
  --secondary-gradient-mid: #5a6268;
  --secondary-gradient-end: #4e555b;

  /* Success Hover */
  --color-success-hover: #157347;

  /* Light Pink (Danger text on danger bg) */
  --color-danger-light-text: #ffcccb;
}

/* Dark mode support (for system preference) - DISABLED to prevent UI breaking */
/* This media query was causing white text on white backgrounds when system is in dark mode */
/*
@media (prefers-color-scheme: dark) {
  :root {
    --text-primary: #ffffff;
    --text-secondary: #e0e0e0;
    --text-muted: #b0b0b0;
    --text-light: #909090;
    --text-on-dark: #ffffff;
    --text-on-light: #1a1a1a;

    --background-body: #1a1a1a;
    --background-card: #2a2a2a;
    --background-muted: #3a3a3a;
    --border-light: #4a4a4a;
    --border-medium: #5a5a5a;
    --border-strong: #6a6a6a;
  }
}
*/

/* High contrast mode support */
@media (prefers-contrast: high) {
  :root {
    --dana-blue-dark: #000066;
    --dana-blue-light: #0066cc;
    --text-primary: #000000;
    --text-secondary: #333333;
    --border-light: #666666;
    --border-medium: #333333;
    --focus-color: #0000ff;
  }
}

/* Mobile-specific adjustments */
@media (max-width: 768px) {
  :root {
    /* Stronger shadows for better definition on small screens */
    --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.15);
    --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.18);
    --shadow-lg: 0 8px 16px rgba(0, 0, 0, 0.18);
    
    /* Larger focus rings for touch targets */
    --focus-shadow: 0 0 0 4px rgba(0, 95, 204, 0.4);
  }
}

/* Color utility classes */
.text-primary { color: var(--text-primary) !important; }
.text-secondary { color: var(--text-secondary) !important; }
.text-muted { color: var(--text-muted) !important; }
.text-light { color: var(--text-light) !important; }

.bg-primary { background-color: var(--dana-blue-dark) !important; color: var(--text-on-dark) !important; }
.bg-secondary { background-color: var(--text-secondary) !important; color: var(--text-on-dark) !important; }
.bg-light { background-color: var(--background-muted) !important; color: var(--text-on-light) !important; }

.border-light { border-color: var(--border-light) !important; }
.border-medium { border-color: var(--border-medium) !important; }
.border-strong { border-color: var(--border-strong) !important; }

/* Emergency badge - Binary urgency system */
.urgency-emergency,
.urgency-1 {
  background-color: var(--urgency-emergency-bg) !important;
  color: var(--urgency-emergency-text) !important;
  font-weight: 600;
}
/* Normal priority work orders have no special urgency styling */