/* RadarLane — version mobile (téléphones et petites tablettes).
   Chargé après tendrel.css : ne s'applique qu'en dessous de 768 px de large. */

@media (max-width: 47.99rem) {
  /* ---------- Coque : pleine largeur ---------- */
  #dash-root { padding: 0; }
  body { padding-bottom: calc(4.4rem + env(safe-area-inset-bottom, 0px)); }
  .tr { border-radius: 0; border-left: 0; border-right: 0; border-top: 0; padding: .75rem .75rem 1rem; gap: .75rem; }
  .tr-main, .tr-page, .tr-main > *, .tr-page > * { min-width: 0; }
  .tr-main { gap: 1.1rem; }
  .tr-page { gap: 1rem; }

  /* ---------- Barre de navigation en bas, comme une appli ---------- */
  .tr-rail { position: static; flex-direction: row; justify-content: flex-start; min-height: 0; padding: 0; gap: .6rem; }
  .tr-rail-logo { width: 2.25rem; height: 2.25rem; border-radius: 10px; }
  .tr-brand { grid-auto-flow: column; align-items: center; gap: .6rem; }
  .tr-wordmark { font-size: 1.35rem; }
  .tr-rail-logo .tr-logo { width: 1.6rem; height: 1.6rem; }
  .tr-rail-foot { display: none; }
  .tr-rail .tr-nav {
    position: fixed; z-index: 60; left: 0; right: 0; bottom: 0; margin: 0;
    display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0; overflow: visible;
    padding: .3rem .25rem calc(.3rem + env(safe-area-inset-bottom, 0px));
    background: rgba(9, 14, 13, .94); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
    border-top: 1px solid #1f2b29; box-shadow: 0 -8px 24px rgba(0, 0, 0, .35);
  }
  .tr-rail .tr-nav button { width: auto; min-width: 0; padding: .3rem 0 .2rem; gap: .15rem; font-size: .66rem; border-radius: 10px; }
  .tr-rail .tr-nav button .tr-ico { width: 1.25rem; height: 1.25rem; }
  .tr-rail .tr-nav button[aria-current="page"] { background: transparent; box-shadow: none; }
  .tr-rail .tr-nav button[aria-current="page"] .tr-ico { width: 1.5rem; height: 1.5rem; }
  .tr-rail .tr-nav button:hover { background: transparent; }

  /* ---------- En-tête : onglets et recherche ---------- */
  .tr-top { justify-items: stretch; }
  .tr-ttabs, .tr-top > nav, .tr-top [role="tablist"] { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
  .tr-top .tr-search { width: 100%; }
  .tr-top .tr-search input { font-size: 16px; } /* évite le zoom automatique sur iPhone */
  input, select, textarea { font-size: 16px; }

  /* ---------- Accueil ---------- */
  .tr-hero2 { padding: 1.1rem 1rem; gap: 1rem; }
  .tr-hero2-r { order: 0; }
  .tr-radarviz { width: min(100%, 16rem); margin-inline: auto; }
  .tr-hero2 h1 { font-size: clamp(1.75rem, 8.4vw, 2.2rem); }
  .tr-hero2-cta { display: grid; grid-template-columns: 1fr; gap: .5rem; }
  .tr-hero2-cta .tr-btn { justify-content: center; }
  .tr-hstats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem 1rem; }
  .tr-hstat-v { font-size: 1.5rem; }
  .tr-spot-stats { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: .4rem; }
  .tr-spot-stats > * { padding: .55rem .6rem; min-width: 0; }
  .tr-spot-stats b, .tr-spot-stats .tr-big { font-size: 1.15rem; }
  .tr-probanner { display: grid; gap: .9rem; padding: 1.1rem 1rem; }
  .tr-probanner h2 { font-size: 1.25rem; }
  .tr-probanner .tr-btn { justify-content: center; }
  .tr-two { grid-template-columns: minmax(0, 1fr); }

  /* Cartes boutiques de l'accueil et Sélection Q4 : carrousel horizontal */
  #home-shops, .tr-q4-grid {
    display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 80%;
    overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none;
    margin-inline: -.75rem; padding: 0 .75rem .25rem; scroll-padding-inline: .75rem;
  }
  #home-shops > *, .tr-q4-grid > * { scroll-snap-align: start; min-width: 0; }
  #home-shops::-webkit-scrollbar, .tr-q4-grid::-webkit-scrollbar { display: none; }
  .tr-q4 { padding: 1rem; border-radius: 16px; }
  .tr-q4-lock { min-height: 9.5rem; }
  .tr-q4-cta { display: grid; grid-template-columns: 1fr; gap: .5rem; }
  .tr-q4-cta .tr-btn { justify-content: center; }
  .tr-pro-help { white-space: normal; overflow-wrap: anywhere; max-width: 100%; }

  /* ---------- Tableaux → cartes (Explorer, Radar, Comparer) ---------- */
  .tr-xt { overflow: visible; background: transparent; border: 0; border-radius: 0; }
  .tr-xt-in, .tr-rt-in, .tr-mx-in { min-width: 0; display: grid; gap: .65rem; }
  .tr-xh { display: none !important; }
  .tr-xr.tr-xb {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important; align-items: start;
    background: var(--tp); border: 1px solid var(--tl) !important; border-radius: 14px; overflow: hidden;
  }
  .tr-xr.tr-xb > * { padding: .55rem .75rem; min-width: 0; }
  .tr-xr.tr-xb > *:first-child { grid-column: 1 / -1; border-right: 0; border-bottom: 1px solid var(--tl); padding-block: .7rem; }
  /* Explorer : niche, derniers produits et dernier lancement sur toute la largeur */
  .tr-xr.tr-xb:not(.tr-rt-r):not(.tr-mx) > :nth-child(2),
  .tr-xr.tr-xb:not(.tr-rt-r):not(.tr-mx) > :nth-child(3),
  .tr-xr.tr-xb:not(.tr-rt-r):not(.tr-mx) > :nth-child(7) { grid-column: 1 / -1; }
  .tr-xr.tr-xb:not(.tr-rt-r):not(.tr-mx) > :nth-child(2) { padding-bottom: 0; }
  .tr-xr.tr-xb:not(.tr-rt-r):not(.tr-mx) > :nth-child(7) { border-top: 1px solid var(--tl); }
  /* Radar : 2 colonnes, vignettes sur toute la largeur */
  .tr-xr.tr-rt-r { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .tr-xr.tr-rt-r > :nth-child(6) { grid-column: 1 / -1; border-top: 1px solid var(--tl); }
  .tr-rt-thumbs img { width: 3.6rem; height: 3.6rem; }
  .tr-rt-metric { grid-template-columns: minmax(0, 1fr); gap: .3rem; }
  .tr-rt-spark svg { height: 2.2rem; }
  /* Mini-courbes dans les cartes : plus petites */
  .tr-spark { display: grid; gap: .25rem; }
  .tr-spark svg { width: 100%; max-width: 7rem; height: 1.8rem; }
  .tr-big { font-size: 1.2rem; }
  .tr-bs-imgs img { width: 3.6rem; height: 3.6rem; }

  /* ---------- Explorer : en-tête et filtres ---------- */
  .tr-ph h1 { font-size: 1.6rem; }
  .tr-xtool { gap: .5rem; }
  .tr-presets { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: -.75rem; padding-inline: .75rem; }
  .tr-presets::-webkit-scrollbar { display: none; }
  .tr-presets > * { flex: none; }

  /* ---------- Radar : onglets, recherche, dossiers ---------- */
  .tr-rt { gap: 1rem; }
  .tr-rt-tabs { justify-self: stretch; }
  .tr-rt-tabs button { padding: .5rem .75rem; font-size: .9rem; }
  .tr-rt-folders { justify-self: stretch; min-width: 0; justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: -.75rem; padding-inline: .75rem; }
  .tr-rt-folders button { flex: none; }
  .tr-rt-bar { gap: .5rem; }

  /* ---------- Produits : 2 colonnes ---------- */
  .tr-pgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
  .tr-prod { font-size: .85rem; }

  /* ---------- Fiche boutique ---------- */
  .tr-ss { margin-inline: -.75rem; padding-inline: .75rem; scrollbar-width: none; }
  .tr-sstrip { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }

  /* ---------- Page Pro ---------- */
  .tr-plans { grid-template-columns: minmax(0, 1fr) !important; }
  .tr-plan.is-featured { order: -1; }

  /* Grilles : la colonne ne doit jamais dépasser l'écran (carrousels, Q4) */
  .tr-page, .tr-q4, .tr-hero2, .tr-spot { grid-template-columns: minmax(0, 1fr); }
  .tr-spot-stats span, .tr-spot-stats small, .tr-spot-stats .tr-small { white-space: normal; overflow-wrap: anywhere; font-size: .7rem; line-height: 1.25; }

  /* Encadrés Pro verrouillés : le bloc s'agrandit avec son contenu au lieu de le couper */
  .tr-lock { display: grid; min-height: 0; }
  .tr-lock > .tr-lock-mock, .tr-lock > .tr-lock-ov { grid-area: 1 / 1; }
  .tr-lock > .tr-lock-ov { position: relative; inset: auto; min-height: 18rem; padding: 1rem .75rem; }
  .tr-lock > .tr-lock-ov { align-items: center; justify-items: stretch; }
  .tr-lock-card { max-width: 100%; min-width: 0; padding: 1rem; justify-items: center; align-self: center; align-content: start; }
  .tr-lock-card > * { max-width: 100%; }
  .tr-lock-card, .tr-lock-card * { white-space: normal; }
  .tr-lock-t { text-align: center; }
  .tr-pro-ok { justify-items: stretch; text-align: left; }
  .tr-pro-ok > * { min-width: 0; max-width: 100%; }
  .tr-lock-form { grid-template-columns: minmax(0, 1fr) !important; width: 100%; }
  .tr-lock-form .tr-btn { justify-content: center; }
  .tr-lock-acts { display: grid; grid-template-columns: 1fr; width: 100%; }
  .tr-lock-acts .tr-btn { justify-content: center; }
  .tr-lock-sm > .tr-lock-mock { display: none; }
  .tr-lock-sm > .tr-lock-ov { min-height: 0; padding: 0; }
  .tr-lock-sm .tr-lock-acts { display: flex; flex-wrap: wrap; }

  /* ---------- Pied de page ---------- */
  .tr-foot { padding-bottom: 1rem; }
}

/* Très petits écrans */
@media (max-width: 22.5rem) {
  .tr-rail .tr-nav button { font-size: .6rem; }
  .tr-pgrid { gap: .45rem; }
  .tr-spot-stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* Page Pro débloquée : les petits textes passent à la ligne au lieu d'élargir la page */
@media (max-width: 47.99rem) {
  #pro .tr-small, .tr-pro-ok .tr-small, .tr-pro-ok span { white-space: normal; overflow-wrap: anywhere; }
  #pro .tr-page, #pro .tr-page > *, #pro .tr-sg > * { min-width: 0; max-width: 100%; }
  .tr-toolbar-r { grid-template-columns: minmax(0, 7rem) minmax(0, 1fr) auto; }
}