/* /css/public_accessibility.css */

.stg-legal-page {
  font-size: 16px;
  line-height: 1.6;
}

.stg-legal-page main :where(p, li, .fine-print) {
  font-size: 1rem !important;
  line-height: 1.6 !important;
}

.stg-legal-page main h1 {
  font-size: 1.75rem !important;
  line-height: 1.25;
}

.stg-legal-page main h2 {
  font-size: 1.125rem !important;
  line-height: 1.35;
}

.stg-legal-page main .meta {
  font-size: .875rem !important;
  line-height: 1.5;
}

.stg-skip-link {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 2147483647;
  padding: 10px 14px;
  border: 2px solid #ffffff;
  border-radius: 8px;
  background: #0b1220;
  color: #ffffff;
  font: 700 14px/1.25 system-ui, -apple-system, "Segoe UI", sans-serif;
  text-decoration: underline;
  transform: translateY(-150%);
  transition: transform .15s ease;
}

.stg-skip-link:focus {
  transform: translateY(0);
}

.stg-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;
}

html body :where(
  a[href],
  button,
  input,
  select,
  textarea,
  summary,
  [tabindex]:not([tabindex="-1"])
):focus-visible {
  outline: 3px solid #fbbf24 !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 6px #111827 !important;
}

html body :where(input, select, textarea):focus-visible {
  border-color: #fbbf24;
}

:where(.drop, .logo-drop):focus-within {
  outline: 3px solid #fbbf24 !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 6px #111827 !important;
}

[aria-invalid="true"] {
  border-color: #ff6b78 !important;
}

.stg-error-summary {
  margin: 12px 0;
  padding: 12px 14px;
  border: 2px solid #ff6b78;
  border-radius: 8px;
  background: #2a1118;
  color: #fff1f2;
}

@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

@media (forced-colors: active) {
  .stg-skip-link,
  .stg-error-summary {
    border-color: CanvasText;
  }

  html body :where(
    a[href],
    button,
    input,
    select,
    textarea,
    summary,
    [tabindex]:not([tabindex="-1"])
  ):focus-visible {
    outline-color: Highlight !important;
    box-shadow: none !important;
  }

  :where(.drop, .logo-drop):focus-within {
    outline-color: Highlight !important;
    box-shadow: none !important;
  }
}