/**
 * Accesibilidad base — Gasolineras MX
 * Skip link, focus-visible, screen-reader-only utility.
 */

/* ── Skip link ── */
.gas-skip-link {
  position: absolute;
  top: -100%;
  left: 50%;
  transform: translateX(-50%);
  background: var(--gas-blue);
  color: #fff;
  padding: var(--gas-space-sm) var(--gas-space-md);
  z-index: 100000;
  border-radius: 0 0 var(--gas-radius-sm) var(--gas-radius-sm);
  font-weight: 700;
  font-family: var(--gas-font-sans);
  font-size: 14px;
  text-decoration: none;
  transition: top 0.2s ease;
}

.gas-skip-link:focus {
  top: 0;
  outline: none;
}

/* ── Focus visible global ── */
:focus-visible {
  outline: 3px solid var(--gas-blue);
  outline-offset: 2px;
}

/* Quitar outline en click (solo mostrar con teclado) */
:focus:not(:focus-visible) {
  outline: none;
}

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