/* Global accessibility + responsive layer — BetRecord
   Inclus sur toutes les pages via <link rel="stylesheet" href="/css/global-a11y.css">.
   Compatible avec styles existants (overrides légers, pas hostiles).
*/

/* ===== Skip to main content (WCAG 2.4.1) ===== */
.skip-link {
  position: absolute;
  top: -40px;
  left: 0;
  background: #06b6d4;
  color: #ffffff;
  padding: 8px 14px;
  z-index: 100000;
  text-decoration: none;
  font-weight: 700;
  border-radius: 0 0 6px 0;
}
.skip-link:focus {
  top: 0;
}

/* ===== Focus visible (WCAG 2.4.7) ===== */
*:focus-visible {
  outline: 2px solid #06b6d4;
  outline-offset: 2px;
}

/* ===== Reduced motion (WCAG 2.3.3) ===== */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

/* ===== Mobile responsive global (toutes pages) ===== */
@media (max-width: 600px) {
  body {
    font-size: 14px !important;
  }
  .container, main, article {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  h1 { font-size: 22px !important; }
  h2 { font-size: 18px !important; }
  h3 { font-size: 15px !important; }
  table {
    font-size: 11px !important;
  }
  th, td {
    padding: 6px 4px !important;
  }
  /* Stack grids 3+ cols → 2 cols max */
  [style*="grid-template-columns"][style*="repeat(3"],
  [style*="grid-template-columns"][style*="repeat(4"],
  [style*="grid-template-columns"][style*="repeat(5"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* Touch targets minimum 44×44px (WCAG 2.5.5) */
@media (max-width: 600px) {
  button, a.btn, .button, input[type="button"], input[type="submit"] {
    min-height: 44px;
    min-width: 44px;
  }
}

/* ===== High contrast mode support ===== */
@media (forced-colors: active) {
  button, a.btn { border: 1px solid currentColor; }
}