/* SD ONE · lot 107 (24/10/2026) : plusieurs passagers (chacun son téléphone), bagages à main / en soute.
   Bleu nuit / bleu / argent, jamais de doré. Aucune animation. Sur téléphone, boutons de 44 px au moins, pas de défilement horizontal. */
:root { --sd107-nuit: #0b1b33; --sd107-bleu: #1e5aa8; --sd107-bleu2: #3b7dd8; --sd107-argent: #c9d1dc; --sd107-argent2: #8a97a8; --sd107-fond: #f5f8fc; --sd107-txt: #0b1b33; --sd107-doux: #4a5a6e; }

/* champs d'origine gardés dans la fenêtre (remplis en direct), mais cachés */
[data-sd107-cache] { display: none !important; }

.sd107 { display: flex; flex-direction: column; gap: 8px; min-width: 0; max-width: 100%; box-sizing: border-box; margin: 0 0 10px; }
.fen .g .sd107 { grid-column: 1 / -1; margin: 4px 0; }
.sd107-t { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 6px 14px; }
.sd107-t > b { font-weight: 800; color: var(--sd107-txt); font-size: 14px; }
.sd107-tot { color: var(--sd107-doux); font-size: 12.5px; font-weight: 700; flex: 1 1 auto; min-width: 0; }
.sd107-pax { display: flex; flex-direction: column; width: 170px; max-width: 100%; font-size: 12px; color: var(--sd107-doux); }
.sd107-pax .ch { width: 100%; box-sizing: border-box; }
.sd107-l { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.sd107-anc { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 0; padding: 6px 10px; border-left: 3px solid var(--sd107-bleu); background: var(--sd107-fond); color: var(--sd107-txt); font-size: 12.5px; border-radius: 0 8px 8px 0; }
.sd107-anc[hidden] { display: none; }
.sd107-anc p { margin: 0; flex: 1 1 220px; min-width: 0; }

/* une ligne pleine largeur par passager, les deux compteurs dessous */
.sd107-p { display: flex; flex-direction: column; gap: 6px; min-width: 0; padding: 8px 10px; border: 1px solid var(--sd107-argent); border-radius: 12px; background: var(--sd107-fond); box-sizing: border-box; }
.sd107-r1 { display: grid; grid-template-columns: 26px 84px minmax(0, 1.5fr) minmax(0, 1fr) 40px; gap: 8px; align-items: end; min-width: 0; }
.sd107-princ .sd107-r1 { grid-template-columns: 26px minmax(0, 1fr); align-items: center; }
.sd107-pr { color: var(--sd107-doux); font-size: 12.5px; font-weight: 700; }
.sd107-r1 label { display: flex; flex-direction: column; min-width: 0; font-size: 12px; color: var(--sd107-doux); }
.sd107-r1 .ch { width: 100%; min-width: 0; box-sizing: border-box; }
.sd107-n { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 800; color: #fff; background: var(--sd107-bleu); align-self: center; }
.sd107-x { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--sd107-argent); background: #fff; color: var(--sd107-doux); font-size: 20px; line-height: 1; cursor: pointer; display: grid; place-items: center; padding: 0; justify-self: end; }
.sd107-x:hover, .sd107-x:focus-visible { color: #fff; background: var(--sd107-nuit); border-color: var(--sd107-nuit); outline: none; }

.sd107-r2 { display: flex; flex-wrap: wrap; gap: 6px 14px; padding-left: 34px; min-width: 0; }
.sd107-cpt { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.sd107-cl { font-size: 12px; font-weight: 700; color: var(--sd107-doux); white-space: nowrap; }
.sd107-pas { display: inline-flex; align-items: center; border: 1px solid var(--sd107-argent); border-radius: 9px; background: #fff; overflow: hidden; }
.sd107 .sd107-m { flex: none; width: 30px; height: 30px; border: 0; background: #fff; color: var(--sd107-nuit); font-size: 17px; font-weight: 800; line-height: 1; cursor: pointer; padding: 0; }
.sd107 .sd107-m:hover, .sd107 .sd107-m:focus-visible { background: var(--sd107-nuit); color: #fff; outline: none; }
.sd107 .sd107-pas input.sd107-v { flex: none; min-width: 0; max-width: 48px; width: 38px; height: 30px; min-height: 0; border: 0; border-left: 1px solid var(--sd107-argent); border-right: 1px solid var(--sd107-argent); border-radius: 0; text-align: center; padding: 0; font-weight: 800; color: var(--sd107-nuit); background: #fff; box-sizing: border-box; }

/* « + Ajouter un passager » : quadrillage bleu nuit / argent, comme les boutons maison */
.sd107-plus { align-self: flex-start; min-height: 40px; padding: 0 18px; border-radius: 12px; border: 1px solid var(--sd107-nuit); color: #fff; font-weight: 800; font-size: 13px; cursor: pointer;
  background-color: var(--sd107-nuit);
  background-image: linear-gradient(rgba(201, 209, 220, .16) 1px, transparent 1px), linear-gradient(90deg, rgba(201, 209, 220, .16) 1px, transparent 1px), linear-gradient(135deg, var(--sd107-nuit), var(--sd107-bleu));
  background-size: 10px 10px, 10px 10px, 100% 100%; box-shadow: 0 1px 0 rgba(255, 255, 255, .18) inset, 0 2px 6px rgba(11, 27, 51, .18); }
.sd107-plus:hover, .sd107-plus:focus-visible { background-color: var(--sd107-bleu); outline: 2px solid var(--sd107-bleu2); outline-offset: 2px; }
.sd107-plus span { font-size: 16px; margin-right: 4px; }

/* planning : un téléphone par ligne, numéros jamais coupés */
.sd107-t1 { white-space: nowrap; }

/* fiche de la course */
.sd107-fl { margin: 0; padding-left: 18px; }
.sd107-fl li { margin: 0 0 3px; overflow-wrap: anywhere; }
.sd107-fl small { display: block; color: var(--sd107-doux); font-size: 11.5px; }
.sd107-fl a { color: var(--sd107-bleu); }
.sd107-fb { color: var(--sd107-doux); font-size: 12px; }

/* téléphone (≤ 760 px) : la fenêtre « Création d'un dossier » passe sur une colonne (v2-correctifs-2110), mais « Rechercher un client »
   (classe l2, deux colonnes) en recréait une seconde, étroite, où tout le reste se tassait (50 px). Il prend toute la largeur. */
@media (max-width: 760px) {
  .fen .g > .l2 { grid-column: 1 / -1; }
}

/* téléphone : une colonne, boutons de 44 px */
@media (max-width: 640px) {
  .sd107-r1 { grid-template-columns: 26px minmax(0, 1fr) 44px; }
  .sd107-r1 .sd107-civ { grid-column: 2 / 3; grid-row: 1; }
  .sd107-r1 .sd107-x { grid-column: 3; grid-row: 1; }
  .sd107-r1 .sd107-nom, .sd107-r1 .sd107-tel { grid-column: 1 / -1; }
  .sd107-r1 .ch { min-height: 44px; font-size: 16px; }
  .sd107-x { width: 44px; height: 44px; }
  .sd107-r2 { padding-left: 0; gap: 8px; }
  .sd107-cpt { flex: 1 1 100%; justify-content: space-between; }
  .sd107 .sd107-pas { flex: none; }
  .sd107 .sd107-pas > .sd107-m { flex: 0 0 44px; width: 44px; min-width: 44px; height: 44px; font-size: 20px; }
  .sd107 .sd107-pas input.sd107-v { width: 48px; height: 44px; font-size: 16px; }
  .sd107-plus { min-height: 44px; width: 100%; }
  .sd107-pax { width: 100%; }
  .sd107-pax .ch { min-height: 44px; font-size: 16px; }
}
