/**
 * Accessibility Fixes
 * Targeted fixes for WCAG 2.1 AA compliance
 *
 * This file addresses audit findings and provides baseline accessibility enhancements.
 * Load after all other stylesheets for proper cascade.
 */

/* ==========================================
   Focus Visibility (WCAG 2.4.7)
   Ensure focus is always visible for keyboard navigation
   ========================================== */

/* Universal focus ring for elements that don't have custom focus styles */
*:focus-visible {
  outline: var(--focus-ring-width, 2px) solid var(--focus-ring-color, var(--color-primary, #2563EB));
  outline-offset: var(--focus-ring-offset, 2px);
}

/* Remove focus ring for mouse users, keep for keyboard users */
*:focus:not(:focus-visible) {
  outline: none;
}

/* High contrast focus for links in content areas */
a:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
  border-radius: var(--radius-sm, 0.25rem);
}

/* Enhanced focus for form controls - ensures visibility on all backgrounds */
.form-control:focus-visible,
.form-select:focus-visible,
.form-check-input:focus-visible {
  outline: var(--focus-ring-width, 2px) solid var(--color-primary, #2563EB);
  outline-offset: 1px;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.15);
}

/* Focus indicators for table action buttons */
.table .btn:focus-visible {
  outline: 2px solid var(--color-primary, #2563EB);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.2);
}

/* ==========================================
   Skip Link Enhancement (WCAG 2.4.1)
   Bypass blocks for keyboard navigation
   ========================================== */

.skip-link {
  position: fixed;
  top: -100%;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;
  padding: var(--space-sm, 0.5rem) var(--space-lg, 1.5rem);
  background: var(--color-primary, #2563EB);
  color: white;
  border-radius: var(--radius-md, 0.375rem);
  text-decoration: none;
  font-weight: 600;
  font-size: var(--font-size-base, 1rem);
  transition: top 0.2s ease;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.skip-link:focus {
  top: var(--space-md, 1rem);
  outline: 3px solid white;
  outline-offset: 2px;
  color: white;
}

/* ==========================================
   Color Contrast Fixes (WCAG 1.4.3, 1.4.11)
   Ensure 4.5:1 for text, 3:1 for UI components
   ========================================== */

/* Ensure placeholder text has sufficient contrast (4.5:1) */
::placeholder {
  color: var(--color-text-tertiary, #6b7280);
  opacity: 1;
}

/* Warning alert text - dark orange for better contrast on yellow */
.alert-warning {
  color: #7c2d12;
}

[data-bs-theme="dark"] .alert-warning {
  color: #fcd34d;
}

/* Badge text contrast improvements */
.badge.bg-warning {
  color: #1c1917 !important; /* Dark text on warning background - 7.5:1 ratio */
}

.badge.bg-info {
  color: #0c4a6e !important; /* Dark text on info background - 4.6:1 ratio */
}

.badge.bg-light {
  color: #1f2937 !important; /* Dark text on light background */
}

/* Disabled states with sufficient contrast */
.btn:disabled,
.form-control:disabled,
.form-select:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}

/* Muted text enhancement for readability */
.text-muted {
  color: var(--color-text-secondary, #6b7280) !important;
}

/* Ensure link underlines on hover for non-button links */
main a:not(.btn):not(.badge):not(.nav-link):not(.dropdown-item):hover {
  text-decoration: underline;
}

/* ==========================================
   Screen Reader Only Content (WCAG 1.3.1)
   Hidden visually but accessible to assistive tech
   ========================================== */

.visually-hidden,
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Allow visually hidden content to become visible on focus (for skip links) */
.visually-hidden-focusable:not(:focus):not(:focus-within) {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ==========================================
   Reduced Motion (WCAG 2.3.3)
   Respect user preference for reduced motion
   ========================================== */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  /* Allow essential animations like focus indicators */
  *:focus-visible {
    transition: outline-offset 0s !important;
  }
}

/* ==========================================
   Touch Target Size (WCAG 2.5.5)
   Minimum 44x44px touch targets for accessibility
   ========================================== */

@media (pointer: coarse) {
  .btn,
  .nav-link,
  .form-check-input,
  .dropdown-item,
  [role="button"],
  .page-link {
    min-height: 44px;
    min-width: 44px;
  }

  /* Icon-only buttons need padding for touch */
  .btn-sm,
  .btn.btn-icon {
    padding: 0.625rem 0.875rem;
    min-height: 44px;
    min-width: 44px;
  }

  /* Table action buttons */
  .table .btn-sm {
    padding: 0.5rem 0.75rem;
    min-height: 44px;
    min-width: 44px;
  }

  /* Larger form checkboxes for touch */
  .form-check-input {
    width: 1.5rem;
    height: 1.5rem;
  }

  /* Pagination links */
  .page-link {
    padding: 0.75rem 1rem;
  }
}

/* ==========================================
   Clickable Row Keyboard Access (WCAG 2.1.1)
   Make table rows with onclick accessible via keyboard
   ========================================== */

/* Style rows that are meant to be clickable */
tr.incident-row {
  cursor: pointer;
}

tr.incident-row:hover {
  background-color: var(--color-surface-1, #f8fafc);
}

[data-bs-theme="dark"] tr.incident-row:hover {
  background-color: var(--color-surface-2, #2c3034);
}

/* Focus state for clickable rows (requires JS tabindex="0") */
tr.incident-row:focus-visible {
  outline: 2px solid var(--color-primary, #2563EB);
  outline-offset: -2px;
  background-color: rgba(37, 99, 235, 0.1);
}

/* ==========================================
   Form Accessibility Enhancements (WCAG 1.3.1, 3.3.2)
   Improve form field associations and error handling
   ========================================== */

/* Required field indicator styling */
.required-indicator {
  color: var(--color-danger, #dc2626);
  font-weight: 600;
  margin-left: 0.25rem;
}

/* Error state icon visibility */
.form-control.is-invalid {
  border-width: 2px;
}

/* Ensure error messages are visible */
.invalid-feedback {
  font-weight: 500;
}

/* Live region for dynamic error announcements */
[role="alert"] {
  font-weight: 500;
}

/* ==========================================
   Icon Accessibility (WCAG 1.1.1)
   Decorative icons should be hidden from screen readers
   ========================================== */

/* Default: icons in buttons/links are decorative */
.btn i[class*="bi-"],
.nav-link i[class*="bi-"],
.card-header i[class*="bi-"],
.alert i[class*="bi-"] {
  /* Icons with adjacent text are decorative */
}

/* Icon-only buttons need visible text or aria-label */
.btn-icon-only {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* ==========================================
   Pagination Accessibility (WCAG 2.4.4)
   Clear navigation for paginated content
   ========================================== */

/* Navigation wrapper */
nav[aria-label*="pagination"],
.pagination {
  margin-top: var(--space-lg, 1.5rem);
}

/* Disabled pagination links */
.page-item.disabled .page-link {
  color: var(--color-text-disabled, #9ca3af);
  background-color: var(--color-surface-2, #e5e7eb);
  pointer-events: none;
}

/* Active page indication */
.page-item.active .page-link {
  font-weight: 600;
}

/* ==========================================
   Status Badge Non-Color Indicators (WCAG 1.4.1)
   Don't rely on color alone to convey information
   ========================================== */

/* Add visual distinction beyond color */
.badge-status {
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.025em;
  font-size: 0.7rem;
}

/* Critical/danger badges get extra visual weight */
.badge.bg-danger {
  box-shadow: 0 0 0 1px rgba(220, 38, 38, 0.5);
}

/* Success badges */
.badge.bg-success {
  box-shadow: 0 0 0 1px rgba(5, 150, 105, 0.3);
}

/* ==========================================
   External Link Indicators (WCAG 2.4.4)
   Indicate links that open in new windows
   ========================================== */

a[target="_blank"]::after {
  content: " ";
  display: inline-block;
  width: 0.75em;
  height: 0.75em;
  margin-left: 0.25em;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'%3e%3cpath fill-rule='evenodd' d='M8.636 3.5a.5.5 0 0 0-.5-.5H1.5A1.5 1.5 0 0 0 0 4.5v10A1.5 1.5 0 0 0 1.5 16h10a1.5 1.5 0 0 0 1.5-1.5V7.864a.5.5 0 0 0-1 0V14.5a.5.5 0 0 1-.5.5h-10a.5.5 0 0 1-.5-.5v-10a.5.5 0 0 1 .5-.5h6.636a.5.5 0 0 0 .5-.5z'/%3e%3cpath fill-rule='evenodd' d='M16 .5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0 0 1h3.793L6.146 9.146a.5.5 0 1 0 .708.708L15 1.707V5.5a.5.5 0 0 0 1 0v-5z'/%3e%3c/svg%3e");
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  opacity: 0.7;
}

/* Don't add icon to buttons or specific elements */
a[target="_blank"].btn::after,
a[target="_blank"].nav-link::after,
a[target="_blank"].dropdown-item::after,
.card a[target="_blank"]::after {
  display: none;
}

/* ==========================================
   High Contrast Mode Support
   Enhanced visibility for users who need it
   ========================================== */

@media (prefers-contrast: high) {
  /* Stronger borders */
  .card,
  .form-control,
  .form-select,
  .btn {
    border-width: 2px;
  }

  /* More visible focus indicators */
  *:focus-visible {
    outline-width: 3px !important;
  }

  /* Ensure text is fully opaque */
  .text-muted {
    opacity: 1 !important;
  }

  /* Stronger badge visibility */
  .badge {
    border: 2px solid currentColor;
  }
}

/* ==========================================
   Print Styles Accessibility
   Ensure printed content is accessible
   ========================================== */

@media print {
  /* Expand all collapsed content for print */
  .collapse {
    display: block !important;
    height: auto !important;
  }

  /* Show URLs for links */
  a[href]::after {
    content: " (" attr(href) ")";
    font-size: 0.8em;
    color: #666;
  }

  a[href^="#"]::after,
  a[href^="javascript:"]::after,
  a.btn::after {
    content: "";
  }

  /* Ensure sufficient contrast for print */
  body {
    color: #000 !important;
    background: #fff !important;
  }
}

/* ==========================================
   Audit-Specific Fixes
   Targeted fixes based on accessibility audit findings
   ========================================== */

/* Fix: Login page auth content layout */
.auth-layout main,
body:not(.authenticated) .container {
  role: main;
}

/* Fix: Ensure card header icons are properly hidden */
.card-header i[aria-hidden="true"] {
  speak: never;
}

/* Fix: Table sort icons need screen reader text */
.sortable-header i[class*="bi-caret"]::before {
  /* Visual only - pair with .visually-hidden span for SR text */
}

/* Fix: Stat card values - ensure not color-dependent */
.stat-card .stat-value {
  font-weight: 700;
}

/* Fix: Improve table header contrast */
.table th {
  color: var(--color-text-primary, #1f2937);
  background-color: var(--color-surface-1, #f8fafc);
}

[data-bs-theme="dark"] .table th {
  color: var(--color-text-primary, #e5e7eb);
  background-color: var(--color-surface-2, #374151);
}

/* Fix: Form labels association - add visual cue for required */
label.form-label[for] {
  cursor: pointer;
}

/* Fix: Pagination previous/next need accessible names */
.pagination .page-link i {
  pointer-events: none;
}

/* Fix: Modal close button accessibility */
.modal .btn-close:focus-visible {
  outline: 2px solid var(--color-primary, #2563EB);
  outline-offset: 2px;
  box-shadow: none;
}

/* Fix: Dropdown menu keyboard navigation */
.dropdown-menu:focus-within {
  outline: 1px solid var(--color-primary, #2563EB);
}

/* Fix: Alert dismiss button focus */
.alert .btn-close:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}