/*
 * Inside Pace — Athlete Native Feel V1
 *
 * Couche volontairement PRESENTATION-ONLY : aucune donnée, aucun cache,
 * aucun appel réseau, aucune logique métier. Elle est intégralement scindée
 * sous .eav2-root afin que l'espace coach ne puisse pas être modifié.
 */

@media (max-width: 760px) {
  .eav2-root {
    min-height: 100svh;
    min-height: 100dvh;
    overscroll-behavior-y: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }

  .eav2-root .eav2-app {
    min-height: 100svh;
    min-height: 100dvh;
  }

  /* Supprime les marqueurs tactiles de navigateur sans neutraliser le focus
     clavier. touch-action: manipulation retire aussi le vieux délai de tap. */
  .eav2-root button,
  .eav2-root a,
  .eav2-root [role='button'] {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }

  /* Seuls les contrôles chrome-like sont non sélectionnables. Les messages,
     notes du coach et champs restent sélectionnables/copiables normalement. */
  .eav2-root .eav2-nav,
  .eav2-root .eav2-nav button,
  .eav2-root .eav2-week-strip button,
  .eav2-root .eav2-primary,
  .eav2-root .eav2-ask-coach {
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
  }

  .eav2-root input,
  .eav2-root textarea,
  .eav2-root [contenteditable='true'] {
    -webkit-user-select: text;
    user-select: text;
  }

  /* La barre est déjà fonctionnelle dans EspaceAthletePage.css. Ici on ne
     change ni sa géométrie ni son z-index : on la pousse seulement sur le
     compositeur GPU pour éviter les micro-saccades lors du scroll mobile. */
  .eav2-root .eav2-nav {
    transform: translate3d(-50%, 0, 0);
    backface-visibility: hidden;
  }

  .eav2-root .eav2-nav button {
    min-height: 54px;
  }

  .eav2-root .eav2-nav button:focus-visible,
  .eav2-root .eav2-primary:focus-visible,
  .eav2-root .eav2-ask-coach:focus-visible,
  .eav2-root .eav2-week-strip button:focus-visible {
    outline: 2px solid rgba(245, 214, 147, .9);
    outline-offset: 2px;
  }
}

/* En mode installé, iOS et Android doivent garder la barre au-dessus de la
   home-indicator/navigation gesture area. Aucun changement n'est appliqué dans
   le navigateur desktop. */
@media (display-mode: standalone) and (max-width: 760px) {
  .eav2-root .eav2-nav {
    bottom: max(9px, calc(7px + env(safe-area-inset-bottom, 0px)));
  }
}

/* Retour tactile discret : suffisamment perceptible pour faire "app", sans
   modifier le handler React ni déclencher de vibration/API plateforme. */
@media (hover: none) and (pointer: coarse) and (max-width: 760px) {
  .eav2-root .eav2-nav button:active {
    transform: scale(.96);
  }

  .eav2-root .eav2-primary:active,
  .eav2-root .eav2-ask-coach:active,
  .eav2-root .eav2-week-strip button:active {
    transform: scale(.985);
    filter: brightness(.98);
  }
}

@media (prefers-reduced-motion: no-preference) and (max-width: 760px) {
  .eav2-root .eav2-nav button,
  .eav2-root .eav2-primary,
  .eav2-root .eav2-ask-coach,
  .eav2-root .eav2-week-strip button {
    transition:
      transform 90ms cubic-bezier(.2, .8, .2, 1),
      filter 120ms ease,
      color 140ms ease,
      background-color 140ms ease,
      border-color 140ms ease,
      box-shadow 140ms ease;
  }
}

@media (prefers-reduced-motion: reduce) and (max-width: 760px) {
  .eav2-root .eav2-nav button,
  .eav2-root .eav2-primary,
  .eav2-root .eav2-ask-coach,
  .eav2-root .eav2-week-strip button {
    transition: none;
  }
}

/* ── V2 : continuité visuelle + scroll plus natif ───────────────────────────
   Toujours présentation-only. On améliore uniquement la sensation de coque :
   aucun nouveau composant, aucun handler et aucune donnée ne sont concernés. */
@media (max-width: 760px) {
  .eav2-root {
    overscroll-behavior-x: none;
    isolation: isolate;
  }

  /* background-attachment:fixed déclenche des repaint coûteux sur WebKit mobile
     et peut donner un léger tremblement au scroll. Sur téléphone, le même fond
     reste visuellement identique en scroll normal mais le compositing est plus
     stable sur iPhone comme sur Android. */
  .eav2-root {
    background-attachment: scroll;
  }

  /* Safari/iOS a longtemps nécessité le préfixe pour le verre de la barre.
     Le fallback rgba déjà présent reste intact si backdrop-filter est absent. */
  .eav2-root .eav2-nav {
    -webkit-backdrop-filter: blur(20px);
  }

  /* Repère d'onglet façon application : aucune taille de la barre ne change,
     donc zéro déplacement du contenu ou des zones tactiles. */
  .eav2-root .eav2-nav button {
    position: relative;
  }

  .eav2-root .eav2-nav button::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 2px;
    width: 17px;
    height: 2px;
    border-radius: 999px;
    background: #f4ce77;
    opacity: 0;
    transform: translateX(-50%) scaleX(.45);
    transform-origin: center;
  }

  .eav2-root .eav2-nav button.is-active::after {
    opacity: .95;
    transform: translateX(-50%) scaleX(1);
  }

  .eav2-root .eav2-nav button.is-active svg {
    filter: drop-shadow(0 2px 5px rgba(232, 181, 74, .24));
  }

  /* Le scrollbar de la zone applicative n'est pas une information utile dans
     une app installée. Le scroll lui-même reste totalement disponible. */
  .eav2-root .eav2-app {
    scrollbar-width: none;
  }

  .eav2-root .eav2-app::-webkit-scrollbar {
    width: 0;
    height: 0;
  }
}

@keyframes ip-athlete-view-in {
  from { opacity: .72; }
  to { opacity: 1; }
}

@media (prefers-reduced-motion: no-preference) and (max-width: 760px) {
  /* Les vues sont déjà montées/démontées par React au changement d'onglet.
     Une simple transition d'opacité sur leurs nœuds de premier niveau donne un
     passage plus doux sans ajouter de state, timer, key ou remount artificiel. */
  .eav2-root .eav2-app > :not(.eav2-header):not(.eav2-warning) {
    animation: ip-athlete-view-in 150ms ease-out both;
  }

  .eav2-root .eav2-nav button::after,
  .eav2-root .eav2-nav button.is-active svg {
    transition:
      opacity 140ms ease,
      transform 150ms cubic-bezier(.2, .8, .2, 1),
      filter 150ms ease;
  }
}

@media (prefers-reduced-motion: reduce) and (max-width: 760px) {
  .eav2-root .eav2-app > :not(.eav2-header):not(.eav2-warning) {
    animation: none;
  }

  .eav2-root .eav2-nav button::after,
  .eav2-root .eav2-nav button.is-active svg {
    transition: none;
  }
}

/* ── V3 : clavier + surfaces tactiles ───────────────────────────────────────
   La coque paraissait encore "web" au moment de saisir ou d'appuyer sur les
   cartes secondaires. Cette passe reste 100 % CSS : aucun changement de
   navigation, de state ou de transport réseau. */
@media (max-width: 760px) {
  .eav2-root {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  /* Momentum explicite sur les zones qui scrollent réellement. Les règles
     n'imposent aucun overflow : elles ne changent donc pas qui possède le scroll. */
  .eav2-root .eav2-app,
  .eav2-root .eav2-chat-thread,
  .eav2-root .eav2-chat-conversation-list {
    -webkit-overflow-scrolling: touch;
  }

  .eav2-root .eav2-chat-thread,
  .eav2-root .eav2-chat-conversation-list {
    overscroll-behavior: contain;
  }

  /* Les icônes contenues dans un bouton ne doivent jamais devenir la cible
     d'un drag/long-press du navigateur : le bouton reste l'unique surface tap. */
  .eav2-root button svg,
  .eav2-root button img,
  .eav2-root [role='button'] svg,
  .eav2-root [role='button'] img {
    -webkit-user-drag: none;
    -webkit-user-select: none;
    user-select: none;
    pointer-events: none;
  }

  .eav2-root button,
  .eav2-root input[type='button'],
  .eav2-root input[type='submit'],
  .eav2-root input[type='reset'] {
    -webkit-appearance: none;
    appearance: none;
  }

  .eav2-root input:focus-visible,
  .eav2-root textarea:focus-visible,
  .eav2-root select:focus-visible {
    outline: 2px solid rgba(245, 214, 147, .78);
    outline-offset: 2px;
  }
}

@media (hover: none) and (pointer: coarse) and (max-width: 760px) {
  /* 16 px coupe l'auto-zoom WebKit au focus. C'est l'un des derniers signaux
     évidents d'une page web sur iPhone ; Android y gagne aussi en stabilité. */
  .eav2-root input:not([type='checkbox']):not([type='radio']),
  .eav2-root textarea,
  .eav2-root select {
    font-size: 16px;
    caret-color: #f4ce77;
    touch-action: manipulation;
  }

  .eav2-root .eav2-chat-conversation-card:active,
  .eav2-root .eav2-chat-new:active,
  .eav2-root .eav2-chat-back:active,
  .eav2-root .eav2-profil-goal:active {
    transform: scale(.985);
    filter: brightness(.98);
  }

  .eav2-root .eav2-chat-send:active {
    transform: scale(.94);
    filter: brightness(.98);
  }
}

@media (prefers-reduced-motion: no-preference) and (hover: none) and (pointer: coarse) and (max-width: 760px) {
  .eav2-root .eav2-chat-conversation-card,
  .eav2-root .eav2-chat-new,
  .eav2-root .eav2-chat-back,
  .eav2-root .eav2-profil-goal,
  .eav2-root .eav2-chat-send {
    transition:
      transform 90ms cubic-bezier(.2, .8, .2, 1),
      filter 110ms ease;
  }
}

@media (prefers-reduced-motion: reduce) and (hover: none) and (pointer: coarse) and (max-width: 760px) {
  .eav2-root .eav2-chat-conversation-card,
  .eav2-root .eav2-chat-new,
  .eav2-root .eav2-chat-back,
  .eav2-root .eav2-profil-goal,
  .eav2-root .eav2-chat-send {
    transition: none;
  }
}

/* ── V6 : grammaire commune des bottom sheets athlète ──────────────────────
   Les composants gardent leurs handlers, portals, z-index et contenus actuels.
   Cette couche n'ajoute qu'une géométrie mobile commune : ancrage bas, poignée,
   safe-area, scroll contenu, backdrop et zones tactiles cohérentes. */
@keyframes ip-athlete-sheet-v6-in {
  from { opacity: .78; transform: translate3d(0, 22px, 0) scale(.992); }
  to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

@keyframes ip-athlete-sheet-v6-backdrop {
  from { background-color: rgba(2, 7, 18, .34); }
  to { background-color: rgba(2, 7, 18, .76); }
}

@media (max-width: 760px) {
  /* Uniquement des overlays dont le nom est explicitement athlète. Aucun
     sélecteur générique .modal/.dialog : le coach reste hors du blast radius. */
  .eav-lap-overlay,
  .eav-blocdetail-overlay,
  .ip-ath-realized-overlay,
  .ip-ath-ms-overlay,
  .ip-athlete-planned-modal,
  .ip-strength-overlay,
  .ipaci-recommendation-overlay {
    align-items: flex-end;
    justify-content: center;
    padding: 14px 10px max(8px, env(safe-area-inset-bottom, 0px));
    background-color: rgba(2, 7, 18, .76);
    backdrop-filter: blur(14px) saturate(112%);
    -webkit-backdrop-filter: blur(14px) saturate(112%);
    overscroll-behavior: contain;
  }

  .eav-lap-sheet,
  .eav-blocdetail,
  .ip-ath-realized-sheet,
  .ip-ath-ms-sheet,
  .ip-athlete-planned-modal > section,
  .ip-strength-sheet,
  .ipaci-recommendation-card {
    max-height: min(92dvh, 900px);
    border-radius: 28px 28px 18px 18px;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, .07),
      0 28px 78px rgba(0, 0, 0, .52);
  }

  /* Même poignée visuelle. Les deux sheets EAV en avaient déjà une : cette
     règle ne change que ses dimensions pour l'aligner sur les autres. */
  .eav-lap-sheet::before,
  .eav-blocdetail::before,
  .ip-ath-realized-sheet::before,
  .ip-ath-ms-sheet::before,
  .ip-athlete-planned-modal > section::before,
  .ip-strength-sheet::before,
  .ipaci-recommendation-card::before {
    content: '';
    display: block;
    width: 38px;
    height: 4px;
    flex: 0 0 auto;
    margin: 8px auto 2px;
    border-radius: 999px;
    background: rgba(151, 171, 203, .42);
  }

  /* Le bilan réalisé garde sa grande hauteur utile, mais laisse enfin une zone
     de respiration constante en haut et au-dessus du geste système. */
  .ip-ath-realized-sheet {
    height: min(92dvh, 920px);
  }

  /* L'ancienne fiche planifiée était centrée comme une popup desktop. Sur
     téléphone elle rejoint le bas comme les autres, sans changer son contenu. */
  .ip-athlete-planned-modal > section {
    width: min(100%, 560px);
  }

  /* Zones de fermeture : 44 px minimum comme une vraie cible tactile. */
  .eav-lap-sheet-close,
  .eav-blocdetail-close,
  .ip-ath-realized-head > button,
  .ip-ath-ms-sheet-head > button,
  .ip-athlete-planned-modal header button,
  .ip-strength-close {
    min-width: 44px;
    min-height: 44px;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  /* Les scrollbars restent fonctionnelles mais ne ressemblent plus à une
     fenêtre web dans les grandes fiches. */
  .eav-blocdetail,
  .ip-ath-realized-sheet,
  .ip-ath-ms-sheet,
  .ip-athlete-planned-modal > section,
  .ip-strength-sheet,
  .ipaci-recommendation-card {
    scrollbar-width: none;
  }

  .eav-blocdetail::-webkit-scrollbar,
  .ip-ath-realized-sheet::-webkit-scrollbar,
  .ip-ath-ms-sheet::-webkit-scrollbar,
  .ip-athlete-planned-modal > section::-webkit-scrollbar,
  .ip-strength-sheet::-webkit-scrollbar,
  .ipaci-recommendation-card::-webkit-scrollbar {
    width: 0;
    height: 0;
  }
}

@media (prefers-reduced-motion: no-preference) and (max-width: 760px) {
  .eav-lap-overlay,
  .eav-blocdetail-overlay,
  .ip-ath-realized-overlay,
  .ip-ath-ms-overlay,
  .ip-athlete-planned-modal,
  .ip-strength-overlay,
  .ipaci-recommendation-overlay {
    animation: ip-athlete-sheet-v6-backdrop 160ms ease-out both;
  }

  .eav-lap-sheet,
  .eav-blocdetail,
  .ip-ath-realized-sheet,
  .ip-ath-ms-sheet,
  .ip-athlete-planned-modal > section,
  .ip-strength-sheet,
  .ipaci-recommendation-card {
    animation: ip-athlete-sheet-v6-in 190ms cubic-bezier(.2, .78, .2, 1) both;
  }
}

@media (prefers-reduced-motion: reduce) and (max-width: 760px) {
  .eav-lap-overlay,
  .eav-blocdetail-overlay,
  .ip-ath-realized-overlay,
  .ip-ath-ms-overlay,
  .ip-athlete-planned-modal,
  .ip-strength-overlay,
  .ipaci-recommendation-overlay,
  .eav-lap-sheet,
  .eav-blocdetail,
  .ip-ath-realized-sheet,
  .ip-ath-ms-sheet,
  .ip-athlete-planned-modal > section,
  .ip-strength-sheet,
  .ipaci-recommendation-card {
    animation: none;
  }
}