/* Skip Link */
.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;
}

.focusable-skip:focus {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: auto !important;
  height: auto !important;
  padding: 8px 16px !important;
  margin: 0 !important;
  overflow: visible !important;
  clip: auto !important;
  white-space: normal !important;
  background: #000 !important;
  color: #fff !important;
  text-decoration: none !important;
  z-index: 9999 !important;
  border-radius: 0 0 4px 0 !important;
  font-size: 14px !important;
  font-weight: bold !important;
}

/* High Contrast Mode Support */
@media (prefers-contrast: high) {
  * {
    border-color: currentColor !important;
  }

  .bg-gradient-to-r {
    background: currentColor !important;
  }

  button,
  .btn {
    border: 2px solid currentColor !important;
  }
}

/* Reduced Motion Support */
@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;
  }
}

/* Focus Indicators */
*:focus {
  outline: 2px solid #2563eb !important;
  outline-offset: 2px !important;
}

*:focus:not(:focus-visible) {
  outline: none !important;
}

*:focus-visible {
  outline: 2px solid #2563eb !important;
  outline-offset: 2px !important;
}

/* Button and Interactive Element Accessibility */
button:disabled,
[aria-disabled="true"] {
  opacity: 0.6 !important;
  cursor: not-allowed !important;
}

/* Touch Target Sizing */
@media (pointer: coarse) {
  button,
  [role="button"],
  input,
  select,
  textarea,
  a {
    min-height: 44px !important;
    min-width: 44px !important;
  }
}

/* Navigation Accessibility */
.nav-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

[aria-current="page"] {
  font-weight: bold;
  text-decoration: underline;
}

/* Form Accessibility */
.form-error {
  color: #dc2626 !important;
  font-size: 0.875rem !important;
  margin-top: 0.25rem !important;
}

.form-field[aria-invalid="true"] {
  border-color: #dc2626 !important;
  box-shadow: 0 0 0 1px #dc2626 !important;
}

/* Live Region Styling */
.live-region {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Screen Reader Only Text */
.sr-only-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;
}

/* Mobile Menu Accessibility */
[aria-expanded="false"] + .mobile-menu {
  display: none;
}

[aria-expanded="true"] + .mobile-menu {
  display: block;
}

/* Color Contrast Improvements */
.text-gray-600 {
  color: #4b5563 !important;
}

.text-gray-400 {
  color: #6b7280 !important;
}

/* Ensure sufficient color contrast for links */
a:not(.btn):not(.button) {
  text-decoration: underline;
}

a:hover:not(.btn):not(.button) {
  text-decoration: none;
}

/* Error States */
[role="alert"] {
  padding: 12px 16px;
  border-radius: 4px;
  background-color: #fef2f2;
  border: 1px solid #fecaca;
  color: #991b1b;
}

/* Success States */
[role="status"] {
  padding: 12px 16px;
  border-radius: 4px;
  background-color: #f0fdf4;
  border: 1px solid #bbf7d0;
  color: #166534;
}

/* Loading States */
[aria-busy="true"] {
  cursor: wait;
}

/* Keyboard Navigation Improvements */
.keyboard-nav *:focus {
  outline: 2px solid #2563eb;
  outline-offset: 2px;
}

/* Print Styles for Accessibility */
@media print {
  .sr-only {
    position: static !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
  }
}
