/* Base de accesibilidad común a todas las páginas.
   Se carga la última para que gane a las hojas de cada vista. */

/* Foco visible siempre. Ninguna hoja puede quitarlo sin sustituirlo.
   Doble anillo: el azul marino se ve sobre fondos claros y el halo verde claro
   sobre el menú lateral y las secciones oscuras, así que funciona en toda la
   aplicación sin excepciones por página. */
:focus-visible {
  outline: 2px solid var(--brand-navy, #061a3a);
  outline-offset: 2px;
  box-shadow: 0 0 0 5px #7fe3da;
  border-radius: 3px;
}
/* Navegadores que aún no distinguen :focus-visible no se quedan sin foco. */
:focus:not(:focus-visible) {
  outline: none;
}

/* Enlace para saltar la navegación. Solo aparece al recibir el foco. */
.skip-link {
  position: absolute;
  left: 8px;
  top: -60px;
  z-index: 100;
  background: var(--brand-navy, #061a3a);
  color: #fff;
  font: 600 14px/1 "DM Sans", system-ui, sans-serif;
  padding: 13px 18px;
  border-radius: 0 0 10px 10px;
  text-decoration: none;
}
/* Sin transición: el enlace tiene que aparecer en el mismo momento en que
   recibe el foco, no 150 ms después. */
.skip-link:focus {
  top: 0;
}

/* Texto solo para lectores de pantalla. */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* Región de estado: anuncia el resultado de una acción sin leer la página entera. */
.live-region {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
}

/* Los iconos decorativos nunca aportan texto. */
[aria-hidden="true"] {
  pointer-events: none;
}

/* Objetivo táctil mínimo en pantallas sin ratón. */
@media (pointer: coarse) {
  button,
  a[href],
  select,
  input[type="checkbox"],
  input[type="radio"],
  [role="button"] {
    min-height: 44px;
  }
  button.icon,
  .slot,
  .date-button {
    min-width: 44px;
  }
}

/* Movimiento reducido: se respeta la preferencia del sistema. */
@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;
  }
}
