/* Inside Pace — Native Finish V7/V8/V9
 * Fichier de finition volontairement séparé de la couche historique :
 * uniquement coque mobile, installation et cohérence visuelle. Aucune donnée
 * métier n'est stockée ici.
 */

/* ── V7 : chargement et erreur initiale premium ─────────────────────────── */
@keyframes ip-athlete-skeleton-v7 {
  0% { background-position: 120% 0; }
  100% { background-position: -120% 0; }
}

@media (max-width: 760px) {
  .eav2-root .eav2-loading {
    box-sizing: border-box;
    width: min(calc(100% - 28px), 520px);
    margin: 0 auto;
    padding: calc(18px + env(safe-area-inset-top, 0px)) 0 calc(92px + env(safe-area-inset-bottom, 0px));
  }

  .eav2-root .eav2-loading:not(.eav2-loading--error) {
    min-height: 100svh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 12px;
    color: rgba(196, 211, 237, .58);
    font-size: 0;
    text-align: left;
  }

  .eav2-root .eav2-loading:not(.eav2-loading--error)::before {
    content: '';
    display: block;
    width: 42%;
    height: 18px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .075);
    box-shadow: 0 31px 0 rgba(255, 255, 255, .045);
  }

  .eav2-root .eav2-loading:not(.eav2-loading--error) > span {
    display: block;
    width: 100%;
    height: 286px;
    margin-top: 31px;
    border: 1px solid rgba(255, 255, 255, .075);
    border-radius: 28px;
    background:
      linear-gradient(90deg, transparent 0%, rgba(255,255,255,.055) 46%, rgba(245,214,147,.09) 50%, rgba(255,255,255,.055) 54%, transparent 100%) 120% 0 / 220% 100% no-repeat,
      linear-gradient(rgba(255,255,255,.09), rgba(255,255,255,.09)) 18px 22px / 35% 10px no-repeat,
      linear-gradient(rgba(255,255,255,.11), rgba(255,255,255,.11)) 18px 48px / 72% 26px no-repeat,
      linear-gradient(rgba(255,255,255,.055), rgba(255,255,255,.055)) 18px 93px / calc(100% - 36px) 64px no-repeat,
      linear-gradient(rgba(255,255,255,.05), rgba(255,255,255,.05)) 18px 174px / 29% 72px no-repeat,
      linear-gradient(rgba(255,255,255,.05), rgba(255,255,255,.05)) center 174px / 29% 72px no-repeat,
      linear-gradient(rgba(255,255,255,.05), rgba(255,255,255,.05)) calc(100% - 18px) 174px / 29% 72px no-repeat,
      linear-gradient(150deg, rgba(26,49,93,.74), rgba(8,18,39,.86));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 24px 58px rgba(0,0,0,.18);
    animation: ip-athlete-skeleton-v7 1.45s ease-in-out infinite;
  }

  .eav2-root .eav2-loading:not(.eav2-loading--error)::after {
    content: 'Préparation de ton espace…';
    display: block;
    margin-top: 2px;
    color: rgba(174, 194, 226, .62);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .01em;
    text-align: center;
  }

  .eav2-root .eav2-loading--error {
    min-height: 100svh;
    min-height: 100dvh;
    align-content: center;
    justify-items: stretch;
    gap: 14px;
    padding-left: 18px;
    padding-right: 18px;
    border: 0;
    color: #dce6f6;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.5;
  }

  .eav2-root .eav2-loading--error::before {
    content: 'Connexion interrompue';
    display: block;
    color: #f5d693;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .12em;
    text-transform: uppercase;
  }

  .eav2-root .eav2-loading--error::after {
    content: 'Tes données ne sont pas supprimées. Réessaie simplement quand la connexion revient.';
    display: block;
    color: rgba(166, 185, 218, .68);
    font-size: 11px;
    font-weight: 600;
    line-height: 1.5;
  }

  .eav2-root .eav2-loading--error button {
    width: 100%;
    min-height: 44px;
    margin-top: 3px;
    border: 1px solid rgba(245,214,147,.22);
    border-radius: 14px;
    background: linear-gradient(180deg, #f6d98e, #dba62f);
    color: #342200;
    font: inherit;
    font-size: 13px;
    font-weight: 850;
    touch-action: manipulation;
  }
}

@media (prefers-reduced-motion: reduce) and (max-width: 760px) {
  .eav2-root .eav2-loading:not(.eav2-loading--error) > span {
    animation: none;
    background-position: 0 0, 18px 22px, 18px 48px, 18px 93px, 18px 174px, center 174px, calc(100% - 18px) 174px, 0 0;
  }
}

/* ── V8 : aide d'installation iPhone / Android ──────────────────────────── */
@keyframes ip-native-install-v8-in {
  from { opacity: 0; transform: translate3d(0, 16px, 0) scale(.985); }
  to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

@media (max-width: 760px) {
  .ip-native-install-v8 {
    position: fixed;
    z-index: 49;
    left: 50%;
    bottom: calc(88px + env(safe-area-inset-bottom, 0px));
    box-sizing: border-box;
    width: min(calc(100% - 24px), 500px);
    transform: translateX(-50%);
    padding: 13px;
    border: 1px solid rgba(245,214,147,.26);
    border-radius: 20px;
    background:
      radial-gradient(220px 120px at 100% 0, rgba(232,181,74,.13), transparent 70%),
      linear-gradient(155deg, rgba(18,32,63,.985), rgba(7,16,34,.985));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 20px 52px rgba(0,0,0,.42);
    color: #f8faff;
    font-family: inherit;
    animation: ip-native-install-v8-in 180ms ease-out both;
  }

  .ip-native-install-v8-head {
    display: flex;
    align-items: flex-start;
    gap: 10px;
  }

  .ip-native-install-v8-icon {
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border: 1px solid rgba(245,214,147,.25);
    border-radius: 12px;
    background: rgba(232,181,74,.1);
    color: #f4ce77;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: -.02em;
  }

  .ip-native-install-v8-copy {
    min-width: 0;
    flex: 1;
  }

  .ip-native-install-v8-copy strong {
    display: block;
    color: #fff;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.2;
  }

  .ip-native-install-v8-copy p {
    margin: 3px 0 0;
    color: rgba(181,199,229,.72);
    font-size: 10.5px;
    font-weight: 620;
    line-height: 1.42;
  }

  .ip-native-install-v8-close {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    margin: -4px -4px -4px 0;
    border: 0;
    border-radius: 13px;
    background: transparent;
    color: rgba(197,211,234,.7);
    font: inherit;
    font-size: 20px;
    line-height: 1;
    touch-action: manipulation;
  }

  .ip-native-install-v8-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    margin-top: 11px;
  }

  .ip-native-install-v8-primary,
  .ip-native-install-v8-later {
    min-height: 44px;
    border-radius: 13px;
    font: inherit;
    font-size: 11px;
    font-weight: 850;
    touch-action: manipulation;
  }

  .ip-native-install-v8-primary {
    border: 0;
    padding: 0 14px;
    background: linear-gradient(180deg, #f6d98e, #dba62f);
    color: #342200;
  }

  .ip-native-install-v8-later {
    border: 1px solid rgba(255,255,255,.09);
    padding: 0 12px;
    background: rgba(255,255,255,.035);
    color: #b9c7df;
  }

  .ip-native-install-v8 button:focus-visible {
    outline: 2px solid rgba(245,214,147,.9);
    outline-offset: 2px;
  }
}

@media (display-mode: standalone) {
  .ip-native-install-v8 { display: none; }
}

@media (prefers-reduced-motion: reduce) and (max-width: 760px) {
  .ip-native-install-v8 { animation: none; }
}

/* ── V9 : audit final de cohérence de la coque athlète ────────────────────
   Aucune dimension métier n'est changée. Cette passe ferme les petites
   incohérences de navigateur : focus, débordements, clavier et cibles tactiles. */
@media (max-width: 760px) {
  .eav2-root .eav2-app,
  .eav2-root .eav2-panel,
  .eav2-root .eav2-workout-card,
  .eav2-root .eav2-rest-card,
  .eav2-root .eav2-readiness,
  .eav2-root .eav2-week-summary,
  .eav2-root .eav2-goal-card,
  .eav2-root .eav2-profile-card,
  .eav2-root .eav2-chat-shell,
  .eav2-root .eav2-chat-conversation-card,
  .eav2-root .eav2-form {
    box-sizing: border-box;
    min-width: 0;
  }

  /* Les actions principales utilisent toutes la même cible tactile minimale.
     Les petits sélecteurs denses (RPE, jours de semaine) sont volontairement
     exclus pour ne pas déformer leur grille. */
  .eav2-root .eav2-primary,
  .eav2-root .eav2-coach-cta,
  .eav2-root .eav2-logout,
  .eav2-root .eav2-chat-new,
  .eav2-root .eav2-chat-back,
  .eav2-root .eav2-chat-send,
  .eav2-root .eav2-form-actions button {
    min-height: 44px;
    touch-action: manipulation;
  }

  .eav2-root .eav2-chat-send {
    min-width: 44px;
  }

  /* Un seul langage de focus clavier/accessibilité sur les cinq onglets. */
  .eav2-root button:focus-visible,
  .eav2-root a:focus-visible,
  .eav2-root input:focus-visible,
  .eav2-root textarea:focus-visible,
  .eav2-root select:focus-visible {
    outline: 2px solid rgba(245,214,147,.9);
    outline-offset: 2px;
  }

  /* Au focus, le clavier ne doit pas laisser le champ coincé derrière la barre
     du bas. scroll-margin ne déclenche aucun scroll par lui-même. */
  .eav2-root input:not([type='checkbox']):not([type='radio']),
  .eav2-root textarea,
  .eav2-root select,
  .eav2-root .eav2-form-actions button {
    scroll-margin-bottom: calc(112px + env(safe-area-inset-bottom, 0px));
  }

  .eav2-root .eav2-nav button {
    overflow: hidden;
    white-space: nowrap;
  }

  .eav2-root .eav2-nav button > span,
  .eav2-root .eav2-nav button > small {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  /* Les contenus utilisateurs/coach peuvent être très longs (URL, nom de
     séance, mot sans espace). Ils cassent à l'intérieur de la carte au lieu de
     créer un scroll horizontal de page. */
  .eav2-root .eav2-chat-bulle p,
  .eav2-root .eav2-coach-note p,
  .eav2-root .eav2-form-preview,
  .eav2-root .eav2-form-error,
  .eav2-root .eav2-profile-rows strong,
  .eav2-root .eav2-section-lead p {
    overflow-wrap: anywhere;
    word-break: normal;
  }

  /* Les chiffres sportifs gardent leur largeur visuelle d'un écran à l'autre. */
  .eav2-root .eav2-workout-metrics strong,
  .eav2-root .eav2-progress-grid strong,
  .eav2-root .eav2-progress-goal em,
  .eav2-root .eav2-week-summary strong,
  .eav2-root .eav2-goal-card em,
  .eav2-root .eav2-nav-badge {
    font-variant-numeric: tabular-nums;
  }

  .eav2-root button:disabled {
    cursor: default;
    filter: saturate(.72);
  }
}

@media (hover: none) and (pointer: coarse) and (max-width: 760px) {
  .eav2-root .eav2-primary:active,
  .eav2-root .eav2-coach-cta:active,
  .eav2-root .eav2-logout:active,
  .eav2-root .eav2-form-actions button:active {
    transform: scale(.985);
  }
}

@media (prefers-reduced-motion: no-preference) and (max-width: 760px) {
  .eav2-root .eav2-coach-cta,
  .eav2-root .eav2-logout,
  .eav2-root .eav2-form-actions button {
    transition: transform 90ms cubic-bezier(.2,.8,.2,1), filter 120ms ease;
  }
}

@media (prefers-reduced-motion: reduce) and (max-width: 760px) {
  .eav2-root .eav2-coach-cta,
  .eav2-root .eav2-logout,
  .eav2-root .eav2-form-actions button {
    transition: none;
  }
}
