/**
 * hd-modal - utilities progressives (P0 #4 audit UX Grabz.it)
 *
 * Ne remplace aucun style de modal existant. Fournit 3 utilitaires
 * opt-in à appliquer progressivement sur les 13 modals du thème :
 *   - .close-btn--touch : cible tactile 44×44 min (WCAG 2.5.5)
 *   - .hd-modal-sheet--mobile-full : plein écran <480px avec safe-area
 *   - .hd-modal--locked-scroll : classe miroir appliquée par JS (info only)
 *
 * Safety net loader : bloc <noscript> + timeout universel sur .hd-loader.
 */

/* ─── Close button 44×44 ─── */
.close-btn--touch {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  line-height: 1;
}

/* ─── Modal plein écran <480px ─── */
@media (max-width: 480px) {
  .hd-modal-sheet--mobile-full,
  .hd-intro-modal__content,
  .embed-modal__inner,
  .limit-modal__content,
  .bg-credits-modal__box,
  .gate-modal__box,
  .hd-signup-popup__dialog,
  .hd-cancel-modal__box,
  .porte-popup-overlay__box,
  .credits-modal__box,
  .hd-nav-info-modal__dialog {
    position: fixed !important;
    inset: 0 !important;
    max-width: 100vw !important;
    max-width: 100dvw !important;
    max-height: 100vh !important;
    max-height: 100dvh !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    border-radius: 0 !important;
    padding-top: max(1rem, env(safe-area-inset-top, 0px)) !important;
    padding-right: max(1rem, env(safe-area-inset-right, 0px)) !important;
    padding-bottom: max(1rem, env(safe-area-inset-bottom, 0px)) !important;
    padding-left: max(1rem, env(safe-area-inset-left, 0px)) !important;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }

  /* Boutons de fermeture : taille tactile 44×44 sur mobile pour WCAG 2.5.5 */
  .hd-intro-modal__close,
  .embed-modal__close,
  .limit-modal__close,
  .bg-credits-modal__close,
  .gate-modal__close,
  .hd-signup-popup__close,
  .hd-cancel-modal__close,
  .porte-popup-overlay__close,
  .credits-modal__close,
  .solar-system-popup__close {
    min-width: 44px !important;
    min-height: 44px !important;
  }
}

/* ─── Safety net loader : état d'erreur affiché si bloqué >20s ─── */
/* Classe appliquée par JS au .hd-loader qui n'a pas été remplacé après timeout. */
.hd-loader--timeout {
  opacity: 0.9;
}
.hd-loader--timeout .hd-loader__text::after {
  content: ' - Le chargement prend plus de temps que prévu. Vérifiez votre connexion ou rechargez la page.';
  display: block;
  margin-top: 0.5rem;
  font-size: 0.85em;
  opacity: 0.85;
}

/* ─── Noscript safety : si JS absent, masquer les loaders et afficher un message ─── */
html.no-js .hd-loader {
  display: none !important;
}
html.no-js .hd-noscript-notice {
  display: block;
}
.hd-noscript-notice { display: none; }
html:not(.no-js) .hd-noscript-notice { display: none; }
