/* 21/10/2026 (Hassan) : audit SD ONE téléphone, page par page. Seulement sur petit écran (760 px et moins),
   sauf les boutons (sans quadrillage partout). Rien n'est retiré : mise en page seulement. */

/* Boutons : plus de quadrillage « cahier de classe » */
#v2-contenu .bt:not(.clair):not(.contour):not(.fonce):not(.rond){background:linear-gradient(180deg,#1A3D66 0%,#0F2A4A 55%,#081830 100%)!important;color:#fff!important;border:1px solid rgba(175,192,214,.35)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 4px 12px rgba(8,24,48,.18)!important}
#v2-contenu .bt:not(.clair):not(.contour):not(.fonce):not(.rond) svg{color:#fff}
#v2-contenu .bt.clair,#v2-contenu .bt.rond{background:#fff!important;background-image:none!important;color:#0F2A4A!important;border:1px solid #AFC0D6!important;box-shadow:inset 0 1px 0 #fff,0 3px 10px rgba(15,42,74,.10)!important}

@media (max-width:760px){
  /* pages de liste : plus rien ne dépasse à droite */
  .tuiles{grid-template-columns:minmax(0,1fr)!important}
  .tuiles>.tuile{min-width:0!important;max-width:100%}
  /* formulaires de recherche sur une colonne */
  .tuile form.rech{min-width:0!important;max-width:100%;grid-template-columns:minmax(0,1fr)!important;gap:10px!important}
  .tuile form.rech > label{grid-template-columns:118px minmax(0,1fr)!important;gap:10px;align-items:center}
  .tuile form.rech > label > .ch{width:100%!important;min-width:0!important;min-height:44px}
  .tuile form.rech .bts{display:flex;flex-wrap:wrap;gap:10px}
  .tuile form.rech .bts > *{flex:1 1 140px;min-height:44px;white-space:nowrap;font-size:13px!important;padding:0 8px!important;letter-spacing:0!important}

  /* tableaux : chaque ligne devient une carte (la classe tl-carte est posée par v2-ajustements.js) */
  #v2-contenu .tl-wrap{overflow:visible!important;max-height:none!important;height:auto!important}
  #v2-contenu table.tl-carte,#v2-contenu table.tl-carte tbody{display:block!important;width:100%!important;min-width:0!important;background:none!important;box-shadow:none!important;border:0!important}
  #v2-contenu table.tl-carte thead{display:block!important}
  #v2-contenu table.tl-carte thead tr{display:flex!important;background:none!important}
  #v2-contenu table.tl-carte thead th:not(.a1){display:none!important}
  #v2-contenu table.tl-carte thead th.a1{background:none!important;border:0!important;padding:0 0 6px 14px!important}
  #v2-contenu table.tl-carte tr.tl-tete{display:none!important}
  #v2-contenu table.tl-carte tbody tr{display:grid!important;grid-template-columns:minmax(0,1fr);align-items:center;gap:6px 10px;padding:10px 14px 12px!important;margin:0 0 10px!important;background:#fff!important;border:1px solid #DCE3EC!important;border-radius:14px!important;box-shadow:0 2px 8px rgba(15,42,74,.06)!important;height:auto!important}
  #v2-contenu table.tl-carte tbody td{display:grid!important;grid-template-columns:110px minmax(0,1fr);gap:10px;border:0!important;padding:0!important;min-width:0!important;max-width:none!important;width:auto!important;height:auto!important;white-space:normal!important;overflow-wrap:break-word!important;word-break:normal!important;font-size:13.5px!important;text-align:left!important;background:none!important}
  #v2-contenu table.tl-carte tbody td + td{padding-top:6px!important;border-top:1px solid #EEF2F6!important}
  #v2-contenu table.tl-carte tbody td::before{content:attr(data-lib);color:#5B6B80;font-size:12px;font-weight:600}
  #v2-contenu table.tl-carte tbody td.tl-vide{display:none!important}
  /* tableaux avec case à cocher et bouton « … » : case, bouton et nom sur la 1re ligne */
  #v2-contenu table.tl-carte.tl-chk tbody tr{grid-template-columns:auto auto minmax(0,1fr)}
  #v2-contenu table.tl-carte.tl-chk tbody td:nth-child(-n+3){display:block!important;border-top:0!important;padding-top:0!important}
  #v2-contenu table.tl-carte.tl-chk tbody td:nth-child(-n+3)::before{content:none}
  #v2-contenu table.tl-carte.tl-chk tbody td:nth-child(3){font-weight:700;font-size:14.5px!important}
  #v2-contenu table.tl-carte.tl-chk tbody td:nth-child(n+4){grid-column:1/-1}
  /* tableau croisé (Suivi des statuts) : il défile dans son cadre, 1re colonne fixe */
  #v2-contenu table.tl.sts{display:block!important;overflow-x:auto!important;max-width:100%!important;-webkit-overflow-scrolling:touch;background:#fff!important;border-radius:12px}
  #v2-contenu table.tl.sts td:first-child,#v2-contenu table.tl.sts th:first-child{position:sticky;left:0;z-index:1;background:#fff}
  #v2-contenu th{font-size:12px!important}
  #v2-contenu .chk{width:22px!important;height:22px!important}
  #v2-contenu label.cc{min-width:44px;min-height:44px;display:inline-flex!important;align-items:center;justify-content:center}

  /* grilles à 2 colonnes (Pancarte, fiche chauffeur) : une seule colonne */
  #v2-contenu .pc-grille,#v2-contenu .cv-grille{grid-template-columns:minmax(0,1fr)!important}

  /* fiches (mission, dossier…) : libellé au-dessus du champ ; fiche chauffeur : en-tête qui revient à la ligne */
  #v2-contenu .fiche .l{grid-template-columns:minmax(0,1fr)!important;gap:4px!important}
  #v2-contenu .fiche .l > *{text-align:left!important;min-width:0!important;width:100%!important;max-width:none!important}
  #v2-contenu .cv-tete{flex-wrap:wrap!important}
  #v2-contenu .cv-id{min-width:0!important;flex:1 1 170px!important}
  #v2-contenu .cv-co{flex-wrap:wrap!important;row-gap:4px}
  /* le panneau caché à droite ne doit plus élargir la page */
  html,body{overflow-x:clip}

  /* iPhone : tout passe sous l'heure et la batterie (zone de la barre d'état) */
  header.v2-haut{padding-top:env(safe-area-inset-top,0px)!important;height:calc(60px + env(safe-area-inset-top,0px))!important;box-sizing:border-box!important}
  #v2-menu,#v2-pan{top:calc(60px + env(safe-area-inset-top,0px))!important}
  body.menu-ouvert #v2-voile{top:calc(60px + env(safe-area-inset-top,0px))!important}
  #v2-contenu{margin-top:env(safe-area-inset-top,0px)}
  #v2-retour{top:calc(72px + env(safe-area-inset-top,0px))!important}
  /* fenêtre du dossier : rien ne déborde, plus de glissement de droite à gauche */
  #v2-pan{overflow-x:hidden!important;max-width:100vw}
  #v2-pan .pan-in{width:100%!important;max-width:100%!important;min-width:0!important;overflow-x:hidden!important;box-sizing:border-box}
  #v2-pan table{width:100%!important;max-width:100%!important;table-layout:fixed}
  #v2-pan td,#v2-pan th{overflow-wrap:anywhere;white-space:normal!important}
  #v2-pan .pan-in > *{max-width:100%;min-width:0;box-sizing:border-box}

  /* barres de dates (Relevé…) : retour à la ligne au lieu d'écraser les boutons */
  #v2-contenu .pl-jour{flex-wrap:wrap!important;gap:8px!important}
  #v2-contenu .pl-jour > *{flex:0 0 auto!important;min-width:0}
  #v2-contenu .pl-jour > b{flex:1 1 140px!important}

  /* liste des chauffeurs : une carte par chauffeur, contact en dessous du nom */
  #v2-contenu .chf-rang{grid-template-columns:36px minmax(0,1fr) 44px!important}
  #v2-contenu a.chf-li{grid-template-columns:44px minmax(0,1fr)!important;grid-auto-rows:auto;gap:2px 12px!important;overflow:visible!important;min-width:0!important;align-items:start!important;padding:10px 0!important}
  #v2-contenu a.chf-li > *{grid-column:2;min-width:0!important;width:auto!important;white-space:normal!important;overflow-wrap:break-word;font-size:13px}
  #v2-contenu a.chf-li > .chf-av{grid-column:1;grid-row:1 / span 6}
  #v2-contenu a.chf-li > .chf-nom{font-size:14.5px}
  #v2-contenu a.chf-li > .chf-ct{display:flex!important;flex-direction:column;color:#4A5A70}
  #v2-contenu a.chf-li > .chf-ct span{overflow-wrap:anywhere}
  #v2-contenu a.chf-li > .chf-ct span:last-child{font-size:12.5px}
  #v2-contenu a.chf-li > .chf-go{display:none!important}
  #v2-contenu .chf-tete{grid-template-columns:44px minmax(0,1fr)!important;overflow:hidden}
  #v2-contenu .chf-tete > span:nth-child(n+3){display:none!important}

  /* Planning visuel : en colonne sous l'en-tête (il couvrait l'en-tête et le bouton Retour) */
  #v2-contenu .vl{top:calc(60px + env(safe-area-inset-top,0px))!important;bottom:0!important;height:auto!important;overflow-y:auto!important;align-content:start;grid-template-columns:112px minmax(0,1fr)!important;grid-template-rows:auto!important;grid-template-areas:none!important}
  body:has(#v2-contenu .vl) #v2-retour{display:none!important}
  #v2-contenu .vl-filtre{grid-column:1/-1!important;grid-row:1!important;height:auto!important;width:auto!important}
  #v2-contenu .vl-actions{grid-column:1/-1!important;grid-row:2!important;height:auto!important;width:auto!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important;padding:10px!important}
  #v2-contenu .vl-actions > *{width:100%!important;min-width:0!important;max-width:none!important;min-height:44px;margin:0!important}
  #v2-contenu .vl-actions > .bt.rond{width:44px!important;height:44px!important;justify-self:center}
  #v2-contenu .vl-actions > .jauge{grid-column:1/-1}
  #v2-contenu .vl-coin{grid-column:1!important;grid-row:3!important;width:auto!important}
  #v2-contenu .vl-echelle{grid-column:2!important;grid-row:3!important}
  #v2-contenu .vl-noms{grid-column:1!important;grid-row:4!important;width:auto!important}
  #v2-contenu .vl-grille{grid-column:2!important;grid-row:4!important}
  #v2-contenu .vl-pile{grid-column:1/-1!important;grid-row:5!important;width:auto!important;height:auto!important}
}
/* titres de page lisibles sur le fond bleu nuit (thème par défaut) */
:root:not([data-theme]) #v2-contenu .v2-titre{color:#fff!important}
/* iPhone tenu à l'horizontale : l'en-tête et le menu évitent l'encoche */
@media (orientation:landscape) and (max-height:500px){header.v2-haut{padding-left:max(18px,env(safe-area-inset-left,0px))!important;padding-right:max(18px,env(safe-area-inset-right,0px))!important}#v2-contenu{padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}}
