/* =====================================================================
   Notygo — améliorations téléphone (audit du 23 octobre 2026, 20-audit-mobile.md)
   Chargée en dernier par l'assembleur, après les styles de chaque page.
   ===================================================================== */

/* Lot 2 — Contraste du bouton principal : blanc sur corail = 3,19:1, conforme seulement en « grand texte »
   (19 px gras). Couleur de marque inchangée. */
.btn.btn-coral{font-size:19px;font-weight:700}

/* Texte gris sur fond clair trop pâle (2,3:1) */
.notif small{color:var(--muted)}

/* Questions dépliables : toute la ligne ouvre la question (l'espace était sur <details>, hors de la zone tactile) */
.faq details,.faqs .faq details{padding:0}
.faq summary{padding:clamp(14px,2.2vh,22px) 0}
.faq details[open]{padding-bottom:clamp(14px,2.2vh,22px)}
.faq details>p:first-of-type{margin-top:0}

/* En-tête : logo et connexion touchables sur 44 px */
.top .logo{display:flex;align-items:center;min-height:44px}
.top .logo img,footer .brand img{width:auto}
.top .login{min-height:44px}

/* Liens soulignés : zone tactile agrandie sans changer le trait */
.more,.faq-all{position:relative}
.more::before,.faq-all::before{content:"";position:absolute;inset:-10px -6px}

/* Titres du pied (h2 pour l'ordre des titres, même rendu que l'ancien h4) */
footer h2.f-h{font-family:var(--body);font-weight:700;line-height:1.55;color:#fff;font-size:15px;margin-bottom:14px}

@media (max-width:760px){
  /* Champs : 16 px minimum, sinon Safari iOS zoome au toucher */
  #guide-search,#sport{font-size:16px}
  /* Corps de texte : 16 px minimum sur téléphone */
  .fine,.note,.cmp-note,.guide-note,p.pay,.players-quick p,.step p,.fast .player{font-size:16px}
  /* Onglets Avant / Le jour J / La saison de l'accueil : 44 px de haut */
  .mtabs button{min-height:44px}
}

/* Lot 3 — Tarifs : une action dans le premier écran (téléphone) */
.t-hero .t-cta{display:none}

/* Barre basse des pages joueurs (barre-joueur.js) : téléphone seulement */
.play-bar{display:none}

@media (max-width:760px){
  /* En-tête : icône seule pour la connexion organisateur (libellé lu par les lecteurs d'écran) */
  .top .login .mb{display:none}
  .top .login{min-width:44px;justify-content:center}
  .t-hero .t-cta{display:flex;width:100%;margin-top:22px}
  .play-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;position:fixed;left:0;right:0;bottom:0;z-index:40;
    padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:var(--navy);color:#fff;box-shadow:0 -6px 24px rgba(13,27,75,.28);
    transform:translateY(110%);visibility:hidden;transition:transform .25s ease,visibility 0s .25s}
  .play-bar.on{transform:none;visibility:visible;transition:transform .25s ease}
  .play-bar p{font-size:15px;line-height:1.3;color:rgba(255,255,255,.86)}
  .play-bar p b{display:block;color:#fff}
  .play-bar .stores{margin:0;display:flex;gap:8px;flex-shrink:0}
  .play-bar .store img{height:40px;width:auto}
  .play-bar .store[hidden]{display:none}
  body.menu-open .play-bar{visibility:hidden}
  /* Appareil non reconnu : les deux badges, centrés, sans la phrase */
  .play-bar:not(:has(.store[hidden])){justify-content:center}
  .play-bar:not(:has(.store[hidden])) p{display:none}
}
@media (max-width:760px) and (prefers-reduced-motion:reduce){.play-bar,.play-bar.on{transition:none}}
/* Accueil, petits téléphones : les badges joueurs entrent dans le premier écran (paragraphe gardé sur ordinateur) */
@media (max-width:479px){.hero p.lead{display:none}}
/* Jouer, petits téléphones : titre sur 2 lignes */
@media (max-width:399px){.j-hero h1{font-size:43px}}

/* Lot 4 — Pied : rubriques en <details> (ouvertes sur ordinateur, repliées sur téléphone) */
footer .f-sec>summary{list-style:none;display:block;cursor:default}
footer .f-sec>summary::-webkit-details-marker{display:none}
footer .f-sec>summary .ico{display:none}
@media (max-width:760px){
  footer{padding:36px 0 28px}
  footer .cols{display:block}
  footer .brand{margin-bottom:18px}
  footer .stores{margin-top:16px}
  footer .f-sec{border-top:1px solid rgba(255,255,255,.12)}
  footer .f-sec>summary{display:flex;align-items:center;justify-content:space-between;min-height:52px;cursor:pointer}
  footer .f-sec>summary h2.f-h{margin:0}
  footer .f-sec>summary .ico{display:block;width:20px;height:20px;transition:transform .2s}
  footer .f-sec[open]>summary .ico{transform:rotate(180deg)}
  footer .f-sec ul{padding-bottom:8px}
  footer .f-sec li{margin:0}
  footer .f-sec li a{display:flex;align-items:center;min-height:44px}
  footer .footer-follow{margin-top:22px}
  footer .legal{margin-top:22px;padding-top:18px}
  footer .legal nav a{display:inline-flex;align-items:center;min-height:44px}
}

/* Lot 4 — Avis : empilés et lisibles en entier sur téléphone, sans défilement (WCAG 2.2.2) */
@media (max-width:760px){
  .ticker{display:block;overflow:visible;-webkit-mask-image:none;mask-image:none}
  .ticker .tk-track{flex-direction:column;gap:18px;padding:22px 20px;animation:none}
  .ticker .tk-track[aria-hidden="true"]{display:none}
  .ticker .tk-track li{display:block;white-space:normal;font-size:16px;line-height:1.45;padding-left:22px;position:relative}
  .ticker .tk-track li::before{position:absolute;left:0;top:14px}
  .ticker .tk-track span{display:block;margin-top:4px}
}

/* Lot 5 — Accueil, tablette : l'heure de la notification ne chevauche plus le titre (masquée comme sur téléphone) */
@media (min-width:761px) and (max-width:960px){.hero-shot .hero-notif small{display:none}}

@media (max-width:760px){
  /* Tarifs : voile plus opaque, plus de mots lisibles dans la photo derrière le texte */
  .t-hero{background:linear-gradient(180deg,rgba(13,27,75,.96),rgba(13,27,75,.97)),var(--m-site-p01,url(img/site-p01.webp)) 80% center/cover no-repeat,var(--navy)}
}

/* Guides, petits téléphones : fil d'Ariane réduit au retour vers la liste */
@media (max-width:480px){
  .crumbs li{display:none}
  .crumbs li:nth-last-child(2){display:block}
  .crumbs li:nth-last-child(2)::before{content:"‹";margin:0 8px 0 0;color:var(--muted)}
  .crumbs li:nth-last-child(2) a{display:inline-flex;align-items:center;min-height:44px}
}

/* Contact, ordinateur : le bouton plus grand (contraste) garde la mention à côté de lui */
@media (min-width:761px){.send{flex-wrap:nowrap}.send .btn{flex:none}}
