/* === FSS A11Y / Touch / TV / Console - 2026-05-04 ===
 * Adapte le site pour :
 * - Souris desktop (hover precis)
 * - Tactile (mobile/tablette : tap targets >= 44px, pas de sticky-hover)
 * - TV / consoles (focus-visible, D-pad nav, scroll smooth)
 * - Manettes de jeu (idem TV : focus visible, tap)
 */

/* ===========================================================
 * 1. FOCUS VISIBLE - obligatoire pour D-pad TV/console + clavier
 * =========================================================== */
*:focus { outline: none; } /* on annule le default ugly */
*:focus-visible {
  outline: 2px solid #ff8c00 !important;
  outline-offset: 2px !important;
  border-radius: 4px;
}

/* Boutons / liens / inputs : focus plus marque */
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible,
.nav-btn:focus-visible,
.toggle-btn:focus-visible,
.season-card:focus-visible,
.ul-card:focus-visible,
.option:focus-visible,
.fsslp-cta:focus-visible,
.fsreg-cta:focus-visible,
.cta:focus-visible {
  outline: 3px solid #ff8c00 !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 6px rgba(255,140,0,0.18) !important;
  z-index: 100;
}

/* Card avec poster : focus = halo orange */
.season-card:focus-visible,
.ul-card:focus-visible {
  transform: translateY(-4px) !important;
}

/* ===========================================================
 * 2. HOVER UNIQUEMENT POUR DEVICES AVEC SOURIS / TRACKPAD
 * (evite "sticky hover" sur mobile/tactile)
 * =========================================================== */
@media (hover: none) {
  /* On garde les transitions (pour focus/active) mais pas le hover */
  .season-card:hover,
  .ul-card:hover,
  .nav-btn:hover,
  .toggle-btn:hover,
  .option:hover,
  button:hover,
  a:hover {
    transform: none !important;
  }

  /* Active state (touch feedback au tap) */
  button:active,
  a:active,
  .nav-btn:active,
  .season-card:active,
  .ul-card:active,
  .option:active,
  .toggle-btn:active {
    opacity: 0.75;
    transform: scale(0.97) !important;
    transition: opacity 0.1s, transform 0.1s !important;
  }
}

/* ===========================================================
 * 3. TAP TARGETS - mobile/tactile (>= 44x44 = guideline iOS/Android)
 * =========================================================== */
@media (hover: none) and (pointer: coarse) {
  button,
  .nav-btn,
  .toggle-btn,
  .toggle-pass,
  .text-link,
  .checkbox,
  input[type="submit"],
  input[type="button"] {
    min-height: 44px;
    min-width: 44px;
  }

  /* Champs form plus hauts pour eviter mauvais tap */
  input[type="text"],
  input[type="email"],
  input[type="password"],
  select,
  textarea {
    min-height: 44px;
    font-size: 16px; /* prevent iOS zoom on focus */
  }

  /* Liens de menu / nav avec padding suffisant */
  .topnav-account a,
  .topnav-account-item,
  nav a {
    padding: 12px 14px;
  }
}

/* ===========================================================
 * 4. SCROLL SMOOTH - pour D-pad nav TV/console (Enter/scroll)
 * =========================================================== */
html {
  scroll-behavior: smooth;
}

/* Reduit le motion pour utilisateurs sensibles (vertige, epilepsie) */
@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;
  }
}

/* ===========================================================
 * 5. TV / GRAND ECRAN - viewing distance lointaine
 * =========================================================== */
@media (min-width: 1920px) and (hover: none) {
  /* Probable TV (grand ecran + pas de souris) */
  body { font-size: 17px; }
  .ul-card-title,
  .season-overlay,
  .fsslp-title,
  .fsreg-title,
  .title { font-size: 1.1em; }
  /* Focus rings plus epais sur TV pour visibilite a 3m */
  *:focus-visible {
    outline-width: 4px !important;
    outline-offset: 4px !important;
  }
}

/* Detection probable Smart TV via UA (heuristique CSS limitee) */
@supports (-webkit-touch-callout: none) {
  /* iOS - safe-area pour iphone X+ */
  .topnav,
  .fsslp-wrap,
  .fsreg-page {
    padding-left: max(env(safe-area-inset-left), initial);
    padding-right: max(env(safe-area-inset-right), initial);
  }
}

/* ===========================================================
 * 6. KEYBOARD/D-PAD NAV - aide visuelle
 * =========================================================== */
/* Skip-link pour clavier (TV/console) - cache visuellement, visible au focus */
.fss-skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 9999;
  padding: 12px 18px;
  background: #ff8c00;
  color: #000;
  font-weight: 700;
  text-decoration: none;
}
.fss-skip-link:focus,
.fss-skip-link:focus-visible {
  left: 16px;
  top: 16px;
}

/* ===========================================================
 * 7. ARROW KEYS HINT - cards interactives accessibles
 * =========================================================== */
.season-card,
.ul-card {
  /* Cards deviennent focusables via tabindex JS, ce CSS rend visible le focus */
  cursor: pointer;
}

/* Quand on tab sur une card, indique visuellement */
.season-card:focus-visible {
  box-shadow: 0 0 0 3px #ff8c00, 0 12px 28px rgba(0,0,0,.5) !important;
}

/* ===========================================================
 * 8. INPUT NUMBER spinners - cache (mobile-friendly)
 * =========================================================== */
@media (hover: none) {
  input[type="number"]::-webkit-outer-spin-button,
  input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }
  input[type="number"] { -moz-appearance: textfield; }
}

/* ===========================================================
 * 9. SCROLLBAR style - moderne sur tous OS
 * =========================================================== */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(255,140,0,0.5) rgba(0,0,0,0.2);
}
*::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
*::-webkit-scrollbar-track {
  background: rgba(0,0,0,0.2);
}
*::-webkit-scrollbar-thumb {
  background: rgba(255,140,0,0.4);
  border-radius: 4px;
}
*::-webkit-scrollbar-thumb:hover {
  background: rgba(255,140,0,0.7);
}