/* SD ONE · lot 35 (24/10/2026, Hassan : « la version smartphone doit être parfaite et fluide »). Téléphone (760 px et moins) seulement,
   chargé en dernier. Rien n'est retiré. Boutons d'au moins 44 px, même famille = même taille, tout centré, rien ne se chevauche. */
@media (max-width: 760px) {
  /* 1. Boutons flottants : Retour, Aide et actions massives ne se chevauchent plus */
  html body .sd-retour-flot { left: 12px !important; bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important; z-index: 61; }
  html body #sd26-aide { left: 12px !important; bottom: calc(66px + env(safe-area-inset-bottom, 0px)) !important; }
  html body .sd26-pan { bottom: calc(118px + env(safe-area-inset-bottom, 0px)) !important; height: min(480px, calc(100vh - 190px - env(safe-area-inset-bottom, 0px))) !important; }
  html body .msx-pill { left: 68px !important; right: 12px !important; transform: none !important; max-width: none !important; bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important; text-align: center; }
  html body .toast, html body .sd-flash, html body .msx-toast { bottom: calc(122px + env(safe-area-inset-bottom, 0px)) !important; }
  html body.menu-ouvert #sd26-aide, html body.menu-ouvert .sd-retour-flot, html body.menu-ouvert .msx-pill,
  html body:has(.fen-voile) #sd26-aide, html body:has(.ed-voile) #sd26-aide { display: none !important; }

  /* 2. Dossier : un seul bouton Retour en haut (comme sur ordinateur) */
  html body[data-vue="dossier"] #v2-retour { display: none !important; }

  /* 3. Carte mission : date superposée et centrée, état sur sa propre ligne, toutes les pastilles de la même taille */
  html body #v2-contenu .pl-corps.dfin table.tm.dfin-tm tbody tr.lg:not(.dfin-ouv) { grid-template-columns: 44px 62px minmax(0, 1fr) 44px !important; grid-template-areas: "sel h cli plus" "num date cli plus" "iti iti iti iti" "chf chf chf chf" "st st st st" !important; row-gap: 6px !important; column-gap: 6px !important; }
  html body #v2-contenu .pl-corps.dfin table.tm.dfin-tm tbody tr.lg:not(.dfin-ouv) td.c-chf { display: flex !important; align-items: center; gap: 8px; flex-wrap: wrap; }
  html body #v2-contenu .pl-corps.dfin table.tm.dfin-tm tbody tr.lg:not(.dfin-ouv) td.c-cli { min-width: 0; }
  /* itinéraire sur toute la largeur : départ, puis → arrivée, puis les pastilles vol / train */
  html body #v2-contenu .pl-corps.dfin .dfin-tm tbody tr.lg td.c-iti .dfin-iti { display: block !important; }
  html body #v2-contenu .pl-corps.dfin .dfin-tm tbody tr.lg td.c-iti .iti1 { display: block !important; white-space: normal !important; }
  html body #v2-contenu .pl-corps.dfin .dfin-tm tbody tr.lg td.c-iti .iti1 > .dep { display: block !important; white-space: normal !important; overflow: visible !important; text-overflow: clip !important; }
  html body #v2-contenu .pl-corps.dfin .dfin-tm tbody tr.lg td.c-iti .iti1 > .fl, html body #v2-contenu .pl-corps.dfin .dfin-tm tbody tr.lg td.c-iti .iti1 > .arr { display: inline !important; white-space: normal !important; overflow: visible !important; }
  html body #v2-contenu .pl-corps.dfin .dfin-tm tbody tr.lg td.c-iti .iti2 { display: flex !important; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
  html body #v2-contenu .pl-corps.dfin .dfin-tm tbody tr.lg td.c-sel, html body #v2-contenu .pl-corps.dfin .dfin-tm tbody tr.lg td.c-h, html body #v2-contenu .pl-corps.dfin .dfin-tm tbody tr.lg td.c-date { display: flex !important; align-items: center; justify-content: center; text-align: center; }
  html body #v2-contenu .pl-corps.dfin .dfin-tm tbody tr.lg td.c-h .hrs { align-items: center !important; }
  html body #v2-contenu .pl-corps.dfin .dfin-tm tbody tr.lg .dt { flex-direction: column !important; align-items: center !important; gap: 0 !important; line-height: 1.1 !important; white-space: nowrap !important; }
  html body #v2-contenu .pl-corps.dfin .dfin-tm tbody tr.lg td.c-st { display: flex !important; flex-direction: column; align-items: center; justify-content: center; min-height: 44px; padding: 0 !important; overflow: visible !important; }
  html body #v2-contenu .pl-corps.dfin .dfin-tm tbody tr.lg.lg td.c-st.c-st .etb.etb { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important; width: 220px !important; max-width: 100% !important; height: 32px !important; min-height: 0 !important; line-height: 1 !important; padding: 0 12px !important; border-radius: 16px !important; font-size: 12.5px !important; text-align: center !important; white-space: nowrap !important; box-sizing: border-box !important; }
  /* ⋮ : 44 × 44 comme la case à cocher et la flèche */
  html body #v2-contenu .dfin-tm td.c-plus { width: 44px !important; padding: 0 !important; display: flex !important; align-items: center; justify-content: center; }
  html body #v2-contenu .dfin-tm td.c-plus button.plus { width: 44px !important; min-width: 44px !important; height: 44px !important; }
  /* vol, train, flèche retour : même dessin, zone à toucher de 44 px */
  html body #v2-contenu .pl-corps.dfin .dfin-tm tbody tr.lg .iti2 button.puce { display: inline-block !important; box-sizing: border-box !important; height: 44px !important; min-height: 44px !important; line-height: 26px !important; padding: 0 9px !important; margin: 0 !important; border-top: 9px solid transparent !important; border-bottom: 9px solid transparent !important; background-clip: padding-box !important; white-space: nowrap !important; vertical-align: middle; }

  /* 4. Barre d'actions du dossier : boutons de la même taille, 2 par ligne */
  html body #v2-contenu .pl-corps.dfin > #ds-a .dfin-barre { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px !important; }
  html body #v2-contenu .pl-corps.dfin > #ds-a .dfin-barre > * { min-width: 0; margin: 0 !important; }
  html body #v2-contenu .pl-corps.dfin > #ds-a .dfin-barre > .msx-m { grid-column: 1 / -1; }
  html body #v2-contenu .pl-corps.dfin > #ds-a .dfin-barre .bt.dfin-t, html body #v2-contenu .pl-corps.dfin > #ds-a .dfin-barre .bt.dfin-tout,
  html body #v2-contenu .pl-corps.dfin > #ds-a .dfin-barre .bt.sdm-bt-devis, html body #v2-contenu .pl-corps.dfin > #ds-a .dfin-barre .bt.msx-t { width: 100% !important; height: 44px; min-height: 44px !important; padding: 0 10px !important; justify-content: center !important; font-size: 13px !important; }

  /* 5. Champs et boutons à 44 px */
  html body #ds-t .dos-num .sd-retour-num { min-height: 44px !important; padding: 0 14px 0 10px !important; border-radius: 22px !important; }
  html body #ds-t .sd-stat-sel, html body #ds-t .dos-num .sd-stat-sel { min-height: 44px !important; border-radius: 22px !important; }
  html body #ds-t .dos-b select.sd-contact, html body #ds-t .dos-b select.sd-type, html body #ds-t .sd-cli .sd-cli-in,
  html body #ds-t .dos-b .sd-nc input, html body #ds-t .dos-b .sd-nc select, html body #ds-t .dos-b .sd-nc button, html body #ds-t .sd-edit-bt button { min-height: 44px !important; }
  html body tr.dfin-sous .dfs-pied .dfs-i { height: 44px !important; min-height: 44px !important; }
  html body tr.dfin-sous .sd-pm-cell input.tf-d { padding-right: 48px !important; }
  html body tr.dfin-sous .sd-pm-fl { width: 44px !important; height: 44px !important; }
  html body .sd-etapes-pop .sd-ep-x, html body .sd-fc-x, html body .sd-lc-x { width: 44px !important; height: 44px !important; min-width: 44px !important; min-height: 44px !important; }
  html body .sd-lc-q, html body .sd-invis-bt, html body .sd-gc-p, html body .sd-ap-boite li button { min-height: 44px !important; }
  html body .sd-etapes-pop, html body .sd-presta-menu { max-width: calc(100vw - 16px) !important; box-sizing: border-box; }

  /* 3 bis. Planning sur téléphone (cartes) : barre d'avancement sur 2 rangées de 4 quand il y a 7 ou 8 étapes (plus de mot coupé),
     photo du chauffeur à gauche de son nom, étiquettes (« No show »…) sur leur propre ligne */
  html body #v2-contenu table.tm tbody tr.lg td.c-st .trx { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; width: 100% !important; max-width: 100% !important; overflow: hidden; }
  html body #v2-contenu table.tm tbody tr.lg td.c-st .trx:has(> div:nth-child(7)) { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; row-gap: 6px !important; }
  html body #v2-contenu table.tm tbody tr.lg td.c-st .trx > div { min-width: 0 !important; overflow: hidden; text-align: center; white-space: normal !important; font-size: 9.5px !important; line-height: 1.05 !important; }
  html body #v2-contenu table.tm tbody tr.lg td.c-chf { display: flex !important; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
  html body #v2-contenu table.tm tbody tr.lg td.c-chf > .sd-av { flex: 0 0 auto; margin: 0 !important; }
  html body #v2-contenu table.tm tbody tr.lg td.c-chf > .chf { flex: 1 1 auto; width: auto !important; min-width: 0; }
  html body #v2-contenu table.tm tbody tr.lg td.c-chf > span:not(.sd-av):not(.chf) { flex-basis: 100%; display: block !important; width: max-content; margin: 0 !important; }

  /* 6. Fluidité : les animations invisibles sur téléphone ne tournent plus (le quadrillage des boutons y est déjà masqué) */
  html body .bt, html body .v2-horloge::before, html body .sd25-fil { animation: none !important; }
}
