/* 
 * Accessibility Styles (WCAG 2.1 AA)
 * Extracted explicitly for easier management by developers.
 */

/* Force a high-contrast focus ring strictly for keyboard navigation */
:focus-visible {
  outline: 3px solid #ffaa00 !important;
  outline-offset: 4px !important;
  box-shadow: 0 0 0 4px rgba(255, 170, 0, 0.4) !important;
}
/* The ring follows the element's own shape. (It used to force 4px corners on everything focused, which
   turned every round button and hotspot square while it had focus.) */

/* Ensure the main canvas handles focus gracefully without looking broken */
#pano:focus-visible {
  outline: 3px solid var(--pal-accent, #6366f1) !important;
  outline-offset: -3px !important; /* Inset on canvas to not break overflow */
}

/* The page may be zoomed with two fingers (the viewport tag no longer forbids it: WCAG 1.4.4). A double tap still does not zoom
   it, and the picture area keeps every gesture for itself (Marzipano's touch handling gives it touch-action: none) */
html {
  touch-action: manipulation;
}

/* Modals should trap focus smoothly */
.info-hotspot-modal:focus-visible {
  outline: 3px solid var(--pal-accent, #6366f1) !important;
}

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