/* Shared accessibility baseline (Feature 13). Keep independent of merchant theme colors. */
.fo-skip-link {
  position: fixed !important;
  inset-block-start: 8px !important;
  inset-inline-start: 8px !important;
  z-index: 2147483000 !important;
  max-width: calc(100vw - 32px);
  padding: 12px 16px !important;
  border: 2px solid #fff !important;
  border-radius: 8px !important;
  background: #111827 !important;
  color: #fff !important;
  font: 700 16px/1.4 system-ui, sans-serif !important;
  text-decoration: underline !important;
  transform: translateY(calc(-100% - 18px));
  transition: transform .12s ease-out;
}
.fo-skip-link:focus, .fo-skip-link:focus-visible { transform: translateY(0); outline: 3px solid #005fcc !important; outline-offset: 3px; }
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid #005fcc !important;
  outline-offset: 2px;
  box-shadow: 0 0 0 1px #fff;
}
:where(input, select, textarea)[aria-invalid="true"], .fo-invalid {
  border-color: #b42318 !important;
  box-shadow: 0 0 0 2px rgb(180 35 24 / 20%) !important;
}
.fo-field-error { display: block; margin-block-start: 4px; color: #b42318; font: 600 .875em/1.4 system-ui, sans-serif; }
[dir="rtl"] .fo-field-error { text-align: start; }
.fo-motion-safe, .fo-motion-safe * { scroll-behavior: auto !important; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .fo-skip-link { transition: none; }
}
@media (forced-colors: active) {
  :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 3px solid Highlight !important; outline-offset: 3px; box-shadow: none; }
  .fo-skip-link { border: 2px solid ButtonText !important; background: Canvas !important; color: CanvasText !important; }
  :where(input, select, textarea)[aria-invalid="true"], .fo-invalid { border: 2px solid Mark !important; }
}
/* RTL-safe alignment for common storefront surfaces. Existing site-specific RTL rules remain authoritative. */
[dir="rtl"] .top, [dir="rtl"] .tbi, [dir="rtl"] .ft .fi, [dir="rtl"] .fl, [dir="rtl"] .row { direction: rtl; }
[dir="rtl"] .hero .hin, [dir="rtl"] #nav, [dir="rtl"] .pgc, [dir="rtl"] .support-mini { text-align: start; }
[dir="rtl"] .tbl th, [dir="rtl"] .tbl td { text-align: start; }
