/* Accessibility Styles */

/* Focus management */
:focus-visible {
  outline: 3px solid var(--color-primary);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

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

/* High contrast mode support */
@media (prefers-contrast: high) {
  :root {
    --color-primary: #0000FF;
    --color-text-primary: #000000;
    --color-background-light: #FFFFFF;
    --color-border: #000000;
  }
  
  .btn--primary {
    background: #0000FF;
    color: #FFFFFF;
    border: 2px solid #000000;
  }
  
  .card {
    border: 2px solid #000000;
  }
}

/* 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;
  }
  
  .animate-float,
  .animate-pulse,
  .animate-glow,
  .animate-heartbeat,
  .animate-bounce {
    animation: none !important;
  }
  
  .hover-lift:hover,
  .hover-scale:hover,
  .hover-rotate:hover {
    transform: none !important;
  }
  
  .parallax-slow,
  .parallax-fast {
    transform: none !important;
  }
}

/* Screen reader only content */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Skip links */
.skip-link {
  position: absolute;
  top: -40px;
  left: 6px;
  background: var(--color-primary);
  color: var(--color-text-light);
  padding: 8px;
  text-decoration: none;
  border-radius: var(--radius-sm);
  z-index: 1000;
  transition: top var(--transition-fast);
}

.skip-link:focus {
  top: 6px;
}

/* Focus trap for modals */
.focus-trap {
  position: relative;
}

.focus-trap::before,
.focus-trap::after {
  content: '';
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

/* Button accessibility */
.btn {
  min-height: 44px;
  min-width: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-sm);
}

.btn:disabled {
  cursor: not-allowed;
  opacity: 0.6;
}

.btn:focus-visible {
  outline: 3px solid var(--color-primary);
  outline-offset: 2px;
}

/* Form accessibility */
input[type="checkbox"] {
  width: 20px;
  height: 20px;
  margin: 0;
  accent-color: var(--color-primary);
}

input[type="checkbox"]:focus-visible {
  outline: 3px solid var(--color-primary);
  outline-offset: 2px;
}

label {
  cursor: pointer;
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-sm);
}

/* Link accessibility */
a:focus-visible {
  outline: 3px solid var(--color-primary);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

/* Image accessibility */
img {
  max-width: 100%;
  height: auto;
}

img[alt=""] {
  border: 2px dashed var(--color-border);
}

/* Color contrast improvements */
.text-muted {
  color: var(--color-text-secondary);
}

.text-muted:focus,
.text-muted:hover {
  color: var(--color-text-primary);
}

/* Error states */
.error {
  border-color: var(--color-accent);
  box-shadow: 0 0 0 3px rgba(255, 107, 107, 0.2);
}

.error-message {
  color: var(--color-accent);
  font-size: var(--font-size-sm);
  margin-top: var(--spacing-xs);
}

/* Success states */
.success {
  border-color: #10B981;
  box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.2);
}

.success-message {
  color: #10B981;
  font-size: var(--font-size-sm);
  margin-top: var(--spacing-xs);
}

/* Loading states */
.loading {
  position: relative;
  pointer-events: none;
}

.loading::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
  margin: -10px 0 0 -10px;
  border: 2px solid transparent;
  border-top: 2px solid currentColor;
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

/* Keyboard navigation */
.keyboard-nav .btn:focus,
.keyboard-nav a:focus {
  outline: 3px solid var(--color-primary);
  outline-offset: 2px;
}

/* Touch target sizes */
@media (pointer: coarse) {
  .btn {
    min-height: 48px;
    min-width: 48px;
  }
  
  input[type="checkbox"] {
    width: 24px;
    height: 24px;
  }
}

/* Print accessibility */
@media print {
  .skip-link,
  .sr-only {
    display: none !important;
  }
  
  a[href]:after {
    content: " (" attr(href) ")";
  }
  
  a[href^="#"]:after,
  a[href^="javascript:"]:after {
    content: "";
  }
}

/* Dark mode accessibility */
@media (prefers-color-scheme: dark) {
  :root {
    --color-primary: #60A5FA;
    --color-text-primary: #FFFFFF;
    --color-background-light: #1A1A1A;
    --color-text-secondary: #B0B0B0;
    --color-border: #333333;
  }
  
  .btn--primary {
    background: var(--gradient-primary);
    color: var(--color-text-light);
  }
  
  .card {
    background: var(--gradient-card);
    border: 1px solid var(--color-border);
  }
}

/* Motion sensitivity */
@media (prefers-reduced-motion: reduce) {
  .hero__background,
  .particles {
    animation: none !important;
  }
  
  .parallax-slow,
  .parallax-fast {
    transform: none !important;
  }
}

/* Cognitive accessibility */
.cognitive-friendly {
  font-size: var(--font-size-lg);
  line-height: var(--line-height-relaxed);
  max-width: 70ch;
}

.cognitive-friendly h1,
.cognitive-friendly h2,
.cognitive-friendly h3 {
  margin-bottom: var(--spacing-lg);
}

.cognitive-friendly p {
  margin-bottom: var(--spacing-lg);
}

/* Dyslexia-friendly fonts */
.dyslexia-friendly {
  font-family: 'OpenDyslexic', 'Comic Sans MS', cursive;
  font-size: var(--font-size-lg);
  line-height: 1.6;
  letter-spacing: 0.05em;
}

/* Color blind friendly */
.colorblind-friendly {
  /* Use patterns and shapes in addition to color */
}

.colorblind-friendly .status-success::before {
  content: '✓';
  margin-right: var(--spacing-xs);
}

.colorblind-friendly .status-error::before {
  content: '✗';
  margin-right: var(--spacing-xs);
}

.colorblind-friendly .status-warning::before {
  content: '⚠';
  margin-right: var(--spacing-xs);
}

/* ARIA live regions */
.aria-live {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Focus indicators for custom elements */
.custom-focus:focus-visible {
  outline: 3px solid var(--color-primary);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

/* Ensure sufficient color contrast */
.contrast-check {
  /* These classes should be used to ensure WCAG AA compliance */
}

.contrast-check--pass {
  /* Color combinations that pass WCAG AA */
}

.contrast-check--fail {
  /* Color combinations that fail WCAG AA */
  color: var(--color-text-primary);
  background: var(--color-background-light);
}