// High Contrast Mode accessibility styles
// See: https://www.w3.org/WAI/WCAG21/Understanding/contrast-minimum.html
// See: https://developer.mozilla.org/en-US/docs/Web/CSS/@media/forced-colors

// Windows High Contrast Mode (forced-colors: active)
// This media query activates when user enables High Contrast Mode in Windows
@media (forced-colors: active) {
  // Reset properties that can interfere with high contrast mode
  *, *::before, *::after {
    // Allow system colors to override custom colors
    forced-color-adjust: auto;
    
    // Remove custom shadows that can obscure content
    box-shadow: none !important;
    
    // Remove text shadows that can reduce readability
    text-shadow: none !important;
    
    // Remove custom backgrounds that override system colors
    background-color: Canvas;
    color: CanvasText;
  }

  // Link states using system colors
  a, a:link, a:visited {
    color: LinkText;
    text-decoration: underline;
  }

  a:hover, a:focus {
    color: LinkText;
    text-decoration: underline;
  }

  a:active {
    color: ActiveText;
  }

  // Focus indicators using system Highlight color
  :focus-visible {
    outline: 2px solid Highlight;
    outline-offset: 2px;
    box-shadow: none !important;
  }

  // Focus fallback for browsers without :focus-visible
  :focus {
    outline: 2px solid Highlight;
    outline-offset: 2px;
    box-shadow: none !important;
  }

  // Buttons and form elements
  button, input, select, textarea {
    background-color: ButtonFace;
    color: ButtonText;
    border: 1px solid ButtonText;
  }

  button:hover, input:hover, select:hover, textarea:hover {
    background-color: Highlight;
    color: HighlightText;
  }

  button:focus, input:focus, select:focus, textarea:focus {
    outline: 2px solid Highlight;
    outline-offset: 2px;
  }

  button:active, input:active, select:active, textarea:active {
    background-color: ActiveBorder;
    color: ButtonText;
  }

  // Input types
  input[type="text"],
  input[type="email"],
  input[type="password"],
  input[type="number"],
  input[type="tel"],
  input[type="url"],
  input[type="search"],
  textarea {
    border: 1px solid ButtonText;
    background-color: Field;
    color: FieldText;
  }

  input[type="checkbox"],
  input[type="radio"] {
    appearance: auto;
    border: 1px solid ButtonText;
    background-color: ButtonFace;
  }

  input[type="checkbox"]:checked,
  input[type="radio"]:checked {
    background-color: Highlight;
    border-color: Highlight;
  }

  // Select dropdowns
  select {
    appearance: auto;
  }

  // Image and media elements
  img, svg, canvas {
    forced-color-adjust: none;
  }

  // Decorative elements should be hidden in high contrast mode
  [aria-hidden="true"] {
    color: GrayText;
  }

  // Skip link should be highly visible
  .skip-link {
    background-color: Highlight;
    color: HighlightText;
    border: 2px solid HighlightText;
  }

  // Navigation and interactive elements
  nav a:focus-visible,
  .header__nav a:focus-visible,
  .social-item a:focus-visible {
    outline: 2px solid Highlight;
    background: transparent;
  }

  // Buttons
  .button,
  button,
  input[type="button"],
  input[type="submit"] {
    background-color: ButtonFace;
    color: ButtonText;
    border: 1px solid ButtonText;
  }

  .button:hover,
  button:hover,
  input[type="button"]:hover,
  input[type="submit"]:hover {
    background-color: Highlight;
    color: HighlightText;
  }

  .button:focus-visible,
  button:focus-visible,
  input[type="button"]:focus-visible,
  input[type="submit"]:focus-visible {
    outline: 2px solid Highlight;
    background: transparent;
  }

  // Project cards and links
  .project-card,
  .project-card a {
    border: 1px solid ButtonText;
  }

  .project-card a:hover,
  .project-card a:focus {
    background-color: Highlight;
    color: HighlightText;
  }

  // Footer social links
  .social-item a:focus-visible {
    outline: 2px solid Highlight;
    background: transparent;
  }

  // Preloader and loading states
  .preloader {
    background-color: Canvas;
    color: CanvasText;
  }

  // Transitions should be instant in high contrast mode
  *, *::before, *::after {
    transition-duration: 0s !important;
    animation-duration: 0s !important;
  }

  // Remove gradients that can interfere with high contrast
  .gradient, .gradient-bg {
    background: Canvas !important;
  }

  // Ensure text remains readable
  h1, h2, h3, h4, h5, h6 {
    color: CanvasText;
  }

  p, span, div, li, td, th {
    color: CanvasText;
  }

  // Code blocks
  code, pre {
    background-color: Canvas;
    color: CanvasText;
    border: 1px solid ButtonText;
  }

  // Blockquotes
  blockquote {
    border-left: 3px solid ButtonText;
    background-color: Canvas;
    color: CanvasText;
  }

  // Tables
  table {
    border: 1px solid ButtonText;
  }

  th, td {
    border: 1px solid ButtonText;
    color: CanvasText;
  }

  th {
    background-color: ButtonFace;
    color: ButtonText;
  }

  // Horizontal rules
  hr {
    border: 1px solid ButtonText;
  }

  // Custom cursor should be hidden in high contrast mode
  .custom-cursor,
  .cursor {
    display: none !important;
  }

  // WebGL canvas should use system colors
  canvas.webgl-canvas {
    forced-color-adjust: none;
  }
}