/* ===== UX Enhancements (global) ===== */
:root {
  --bar-bg: color-mix(in oklab, white 90%, transparent);
  --bar-bg-dark: color-mix(in oklab, #0a0a0a 85%, transparent);
  --bar-shadow: 0 4px 16px rgba(0,0,0,.08);
  --ring: 0 0 0 3px color-mix(in oklab, #3b82f6 35%, transparent);
  --radius: 14px;
}

/* Skip link for accessibility */
.skip-link {
  position: absolute;
  left: -999px;
  top: -999px;
  background: Canvas;
  color: CanvasText;
  padding: .5rem .75rem;
  border-radius: .5rem;
  box-shadow: var(--bar-shadow);
  z-index: 10000;
}
.skip-link:focus {
  left: 1rem;
  top: 1rem;
}

/* Sticky filter bar */
.filter-bar, [data-filter-bar] {
  position: sticky;
  top: 0;
  z-index: 50;
  backdrop-filter: blur(8px);
  background: var(--bar-bg);
  padding: .75rem;
  border-bottom: 1px solid color-mix(in oklab, #000 8%, transparent);
  box-shadow: var(--bar-shadow);
  border-bottom-left-radius: var(--radius);
  border-bottom-right-radius: var(--radius);
}
:where(html.dark) .filter-bar, :where(html.dark) [data-filter-bar] {
  background: var(--bar-bg-dark);
  border-color: color-mix(in oklab, #fff 10%, transparent);
}

/* Inputs & focus rings */
:where(input, select, textarea, button):focus-visible {
  outline: none;
  box-shadow: var(--ring);
  border-color: color-mix(in oklab, #3b82f6 45%, transparent);
}

/* Primary buttons */
button.primary, .btn-primary, button[type="submit"] {
  font-weight: 600;
  border-radius: .75rem;
  padding: .6rem .9rem;
  border: 1px solid color-mix(in oklab, #000 10%, transparent);
}
:where(html.dark) button.primary, :where(html.dark) .btn-primary, :where(html.dark) button[type="submit"] {
  border-color: color-mix(in oklab, #fff 12%, transparent);
}

/* Sticky table headers when long lists */
.table-sticky thead th {
  position: sticky;
  top: calc(var(--filter-bar-height, 0px) + 0px);
  background: inherit;
  backdrop-filter: blur(6px);
  z-index: 5;
}

/* Better hit targets for controls */
label, button, .btn, .chip, .tag {
  touch-action: manipulation;
}

/* Utility: visually-hidden (for ARIA) */
.visually-hidden {
  position: absolute !important;
  height: 1px; width: 1px;
  overflow: hidden; clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap; border: 0; padding: 0; margin: -1px;
}

/* ---- Table theming overrides for reglamento.html and others ---- */
/* Ensure zebra striping and hover match the dark theme and override any generic light themes */
.table-sticky tbody tr:nth-child(even) {
  background: rgba(255, 255, 255, 0.03);
}
.table-sticky tbody tr:nth-child(odd) {
  background: transparent;
}
.table-sticky tbody tr:hover {
  background: rgba(255, 255, 255, 0.06);
}
.table-sticky td, .table-sticky th {
  border-color: rgba(255, 255, 255, 0.08);
}