/* ── Skip-to-content link ────────────────────────────────────────────────── */
.skip-link {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
  z-index: 99999;
}
.skip-link:focus {
  left: 1rem;
  top: 0;
  width: auto;
  height: auto;
  overflow: visible;
  padding: .5rem 1.25rem;
  background: #0078d4;
  color: #fff;
  font-weight: 600;
  font-size: .9rem;
  border-radius: 0 0 6px 6px;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(0,0,0,.2);
  outline: 3px solid #fff !important;
  outline-offset: 2px !important;
}

/* ── Restore visible focus rings for all interactive elements ────────────── */
/*
   app.css contains 25+ `outline: none` / `outline: 0` declarations that hide
   the focus indicator for keyboard users. This block restores it using
   :focus-visible so mouse clicks are NOT affected — only keyboard focus gets
   the ring.
*/
*:focus-visible {
  outline: 3px solid #0078d4 !important;
  outline-offset: 2px !important;
  border-radius: 3px;
}

/* Modals and overlays should not show a ring on the container itself */
.modal:focus-visible,
.modal-dialog:focus-visible,
.modal-content:focus-visible,
.offcanvas:focus-visible {
  outline: none !important;
}

/* ── Keyboard-interactive table rows ─────────────────────────────────────── */
tr[tabindex="0"]:focus-visible {
  outline: 3px solid #0078d4 !important;
  outline-offset: -2px !important;
  background-color: rgba(0, 120, 212, .06) !important;
}

/* ── Icon-only button fallback (belt-and-suspenders for older browsers) ───── */
button:focus-visible,
a:focus-visible,
[role="button"]:focus-visible {
  outline: 3px solid #0078d4 !important;
  outline-offset: 2px !important;
}