/* ================================================================
   DARK MODE ENHANCEMENTS
   WCAG AA compliant contrast ratios and improved visibility
   ================================================================ */

/* ================================================================
   WCAG AA CONTRAST IMPROVEMENTS (4.5:1 for body text, 3:1 for large text)
   ================================================================ */

:root {
  /* Enhanced text colors for better contrast */
  --text-primary-enhanced: #f0f0f2;        /* Lighter than #e2e8f0 for better contrast */
  --text-secondary-enhanced: #b4b4bb;      /* Lighter than #94a3b8 for better contrast */
  --text-muted-enhanced: #bdc3cd;          /* Lighter than #b0b8c4 for better contrast */

  /* Enhanced background colors - slightly lighter for contrast */
  --bg-primary-enhanced: #0d0d12;          /* Slightly lighter than #0f172a */
  --bg-secondary-enhanced: #15151d;        /* Slightly lighter than #1e293b */
  --bg-tertiary-enhanced: #1d1d27;         /* Slightly lighter than #162032 */
  --bg-card-enhanced: #181823;             /* Slightly lighter than #1a2536 */

  /* Enhanced border colors for visibility */
  --border-subtle-enhanced: rgba(255, 255, 255, 0.12);   /* More visible than 0.08 */
  --border-medium-enhanced: rgba(255, 255, 255, 0.20);   /* More visible than 0.15 */
  --border-strong: rgba(255, 255, 255, 0.30);

  /* Alert colors with sufficient contrast */
  --alert-success-bg: rgba(34, 197, 94, 0.15);
  --alert-success-border: rgba(34, 197, 94, 0.5);
  --alert-success-text: #6ee7b7;           /* Lighter green for WCAG AA */

  --alert-warning-bg: rgba(234, 179, 8, 0.15);
  --alert-warning-border: rgba(234, 179, 8, 0.5);
  --alert-warning-text: #fcd34d;           /* Lighter yellow for WCAG AA */

  --alert-error-bg: rgba(220, 38, 38, 0.15);
  --alert-error-border: rgba(220, 38, 38, 0.5);
  --alert-error-text: #fca5a5;             /* Lighter red for WCAG AA */

  --alert-info-bg: rgba(59, 130, 246, 0.15);
  --alert-info-border: rgba(59, 130, 246, 0.5);
  --alert-info-text: #93c5fd;              /* Lighter blue for WCAG AA */
}

/* ================================================================
   ENHANCED TEXT CONTRAST
   ================================================================ */

/* Text colors managed by style.css CSS variables, enhanced vars available for opt-in use */

/* Links inherit color from style.css, no override needed */

/* ================================================================
   ENHANCED BACKGROUND COLORS
   ================================================================ */

/* Background colors managed by style.css CSS variables, enhanced vars available for opt-in use */

/* ================================================================
   IMPROVED BORDER VISIBILITY
   ================================================================ */

/* Border colors managed by style.css CSS variables, enhanced vars available for opt-in use */

/* ================================================================
   ENHANCED FOCUS INDICATORS
   ================================================================ */

/* Focus rules managed by style.css, no override needed */

/* ================================================================
   ENHANCED ALERT COLOR DIFFERENTIATION
   ================================================================ */

/* Success alerts - green with proper contrast */
.alert--success,
.notification--success,
.message--success {
  background-color: var(--alert-success-bg, rgba(34, 197, 94, 0.15));
  border: 1px solid var(--alert-success-border, rgba(34, 197, 94, 0.5));
  color: var(--alert-success-text, #6ee7b7);
}

.alert--success::before {
  content: '✓';
  display: inline-block;
  margin-right: 0.5rem;
  font-weight: 700;
  color: var(--alert-success-text, #6ee7b7);
}

/* Warning alerts - yellow with proper contrast */
.alert--warning,
.notification--warning,
.message--warning {
  background-color: var(--alert-warning-bg, rgba(234, 179, 8, 0.15));
  border: 1px solid var(--alert-warning-border, rgba(234, 179, 8, 0.5));
  color: var(--alert-warning-text, #fcd34d);
}

.alert--warning::before {
  content: '⚠';
  display: inline-block;
  margin-right: 0.5rem;
  font-weight: 700;
  color: var(--alert-warning-text, #fcd34d);
}

/* Error alerts - red with proper contrast */
.alert--error,
.alert--danger,
.notification--error,
.message--error {
  background-color: var(--alert-error-bg, rgba(220, 38, 38, 0.15));
  border: 1px solid var(--alert-error-border, rgba(220, 38, 38, 0.5));
  color: var(--alert-error-text, #fca5a5);
}

.alert--error::before,
.alert--danger::before {
  content: '✕';
  display: inline-block;
  margin-right: 0.5rem;
  font-weight: 700;
  color: var(--alert-error-text, #fca5a5);
}

/* Info alerts - blue with proper contrast */
.alert--info,
.notification--info,
.message--info {
  background-color: var(--alert-info-bg, rgba(59, 130, 246, 0.15));
  border: 1px solid var(--alert-info-border, rgba(59, 130, 246, 0.5));
  color: var(--alert-info-text, #93c5fd);
}

.alert--info::before {
  content: 'ℹ';
  display: inline-block;
  margin-right: 0.5rem;
  font-weight: 700;
  color: var(--alert-info-text, #93c5fd);
}

/* Alert headings */
.alert h1,
.alert h2,
.alert h3,
.alert h4,
.alert h5,
.alert h6 {
  margin-top: 0;
  margin-bottom: 0.5rem;
}

/* Alert links */
.alert--success a {
  color: #86efac;
  border-bottom-color: #86efac;
}

.alert--warning a {
  color: #fde047;
  border-bottom-color: #fde047;
}

.alert--error a,
.alert--danger a {
  color: #fecaca;
  border-bottom-color: #fecaca;
}

.alert--info a {
  color: #bfdbfe;
  border-bottom-color: #bfdbfe;
}

/* ================================================================
   DEFCON LEVEL COLORS - ENHANCED CONTRAST
   ================================================================ */

/* Ensure DEFCON level indicators have sufficient contrast */
.level-1,
.defcon-1 {
  background-color: rgba(255, 255, 255, 0.15);
  color: #ffffff;
  border: 2px solid rgba(255, 255, 255, 0.5);
}

.level-2,
.defcon-2 {
  background-color: rgba(220, 38, 38, 0.15);
  color: #fca5a5; /* Lighter red for contrast */
  border: 2px solid rgba(220, 38, 38, 0.5);
}

.level-3,
.defcon-3 {
  background-color: rgba(234, 179, 8, 0.15);
  color: #fcd34d; /* Lighter yellow for contrast */
  border: 2px solid rgba(234, 179, 8, 0.5);
}

.level-4,
.defcon-4 {
  background-color: rgba(34, 197, 94, 0.15);
  color: #6ee7b7; /* Lighter green for contrast */
  border: 2px solid rgba(34, 197, 94, 0.5);
}

.level-5,
.defcon-5 {
  background-color: rgba(59, 130, 246, 0.15);
  color: #93c5fd; /* Lighter blue for contrast */
  border: 2px solid rgba(59, 130, 246, 0.5);
}

/* ================================================================
   FORM ELEMENT CONTRAST
   ================================================================ */

/* Form element styling managed by style.css, enhanced vars available for opt-in use */

/* ================================================================
   BUTTON CONTRAST IMPROVEMENTS
   ================================================================ */

/* Button styling managed by style.css, enhanced vars available for opt-in use */

/* ================================================================
   CARD & PANEL CONTRAST
   ================================================================ */

/* Card/panel styling managed by style.css, enhanced vars available for opt-in use */

/* ================================================================
   CODE BLOCK CONTRAST
   ================================================================ */

/* Code block styling managed by style.css */

/* ================================================================
   NAVIGATION CONTRAST
   ================================================================ */

/* Navigation styling managed by style.css */

/* ================================================================
   SHADOW ENHANCEMENTS FOR DEPTH
   ================================================================ */

/* Shadow values managed by style.css CSS variables */

/* ================================================================
   SCROLLBAR STYLING (Dark Mode)
   ================================================================ */

/* Custom scrollbar for better visibility */
*::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

*::-webkit-scrollbar-track {
  background: var(--bg-secondary-enhanced, #15151d);
}

*::-webkit-scrollbar-thumb {
  background: var(--border-medium-enhanced, rgba(255, 255, 255, 0.20));
  border-radius: 6px;
}

*::-webkit-scrollbar-thumb:hover {
  background: var(--border-strong, rgba(255, 255, 255, 0.30));
}

/* Firefox scrollbar */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--border-medium-enhanced, rgba(255, 255, 255, 0.20)) var(--bg-secondary-enhanced, #15151d);
}

/* ================================================================
   SELECTION HIGHLIGHT
   ================================================================ */

::selection {
  background-color: rgba(14, 165, 233, 0.3);
  color: #ffffff;
}

::-moz-selection {
  background-color: rgba(14, 165, 233, 0.3);
  color: #ffffff;
}

/* ================================================================
   ACCESSIBILITY - HIGH CONTRAST MODE
   ================================================================ */

@media (prefers-contrast: high) {
  :root {
    --text-primary-enhanced: #ffffff;
    --text-secondary-enhanced: #cccccc;
    --border-subtle-enhanced: rgba(255, 255, 255, 0.25);
    --border-medium-enhanced: rgba(255, 255, 255, 0.40);
    --border-strong: rgba(255, 255, 255, 0.60);
  }

  /* Stronger borders in high contrast mode */
  .card,
  .panel,
  input,
  button {
    border-width: 2px;
  }

  /* Stronger focus indicators */
  *:focus-visible {
    outline-width: 4px;
    outline-offset: 3px;
  }
}

/* ================================================================
   RESPECT REDUCED MOTION
   ================================================================ */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    transition: none !important;
    animation: none !important;
  }
}

/* ================================================================
   PRINT STYLES (Light Mode for Printing)
   ================================================================ */

@media print {
  :root {
    --text-primary-enhanced: #000000;
    --text-secondary-enhanced: #333333;
    --bg-primary-enhanced: #ffffff;
    --bg-secondary-enhanced: #f5f5f5;
    --bg-card-enhanced: #ffffff;
    --border-subtle-enhanced: #cccccc;
  }

  body {
    background: white;
    color: black;
  }

  .card,
  .panel {
    border: 1px solid #cccccc;
  }

  /* Hide shadows in print */
  * {
    box-shadow: none !important;
  }
}