/* ============================================================
   CHECK TERRAIN — écran s-check-terrain (étape 3)
   Styles REPRIS des prototypes terrain v2 (charte --navy/--gold,
   mobile d'abord : cibles ≥44px, contraste plein soleil), adaptés :
   tout est préfixé #s-check-terrain + classes ctu-* pour ne pas
   fuiter dans le reste de l'app Conception.
   ============================================================ */
#s-check-terrain {
  --ctu-navy: #1a3a8f;
  --ctu-navy-dark: #12276b;
  --ctu-gold: #c9a84c;
  --ctu-ok: #1e7d3c;
  --ctu-err: #b3261e;
  --ctu-warn: #8a6d00;
  --ctu-line: #d7dbe8;
  --ctu-dim: #5a6172;
  --ctu-font: 'Exo 2', 'DM Sans', system-ui, 'Segoe UI', Roboto, Arial, sans-serif;
}
#s-check-terrain .ctu-wrap {
  font-family: var(--ctu-font);
  background: #fff;
  color: #10162a;
  font-size: 16px;
  max-width: 720px;
  margin: 0 auto;
  border: 1px solid var(--ctu-line);
  border-radius: 12px;
  overflow: hidden;
}

/* ── En-tête sticky : bandeau or + titre + compteurs ── */
#s-check-terrain .ctu-header {
  position: sticky; top: 0; z-index: 50;
  background: var(--ctu-navy); color: #fff;
  padding: 8px 10px 6px;
  box-shadow: 0 2px 6px rgba(0,0,0,.25);
}
#s-check-terrain .ctu-idband {
  background: var(--ctu-gold); color: var(--ctu-navy-dark);
  font-size: 20px; font-weight: 800; letter-spacing: 1.2px; text-align: center;
  padding: 7px 8px; border-radius: 8px; margin-bottom: 6px; text-transform: uppercase;
}
#s-check-terrain .ctu-hdr-top { display: flex; align-items: center; gap: 8px; }
#s-check-terrain .ctu-hdr-top h1 { flex: 1; min-width: 0; font-size: 17px; font-weight: 700; letter-spacing: .3px; margin: 0; color: #fff; }
#s-check-terrain .ctu-hdr-top h1 small { font-weight: 400; opacity: .85; font-size: 12px; display: block; }
#s-check-terrain #ctu-btn-refresh {
  min-width: 44px; min-height: 44px; border: 1px solid rgba(255,255,255,.4);
  background: transparent; color: #fff; border-radius: 8px; cursor: pointer;
  font-family: var(--ctu-font); font-size: 12px; font-weight: 600; padding: 0 10px;
}
#s-check-terrain #ctu-btn-refresh:active { background: rgba(255,255,255,.15); }
#s-check-terrain .ctu-counters { display: flex; gap: 6px; margin-top: 6px; }
#s-check-terrain .ctu-counter {
  flex: 1; background: var(--ctu-navy-dark); border-radius: 8px;
  padding: 5px 8px; text-align: center;
}
#s-check-terrain .ctu-counter .ctu-lbl { font-size: 10px; text-transform: uppercase; letter-spacing: .6px; opacity: .8; }
#s-check-terrain .ctu-counter .ctu-val { font-size: 17px; font-weight: 800; }
#s-check-terrain .ctu-counter .ctu-val.done { color: #7fe0a0; }
#s-check-terrain .ctu-progress { height: 5px; background: rgba(255,255,255,.18); border-radius: 3px; margin-top: 4px; overflow: hidden; }
#s-check-terrain .ctu-progress > div { height: 100%; background: var(--ctu-gold); border-radius: 3px; transition: width .2s; }

/* ── Bandeaux (jamais silencieux) ── */
#s-check-terrain .ctu-banner {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; font-size: 14px; font-weight: 600; line-height: 1.35;
  border-bottom: 1px solid rgba(0,0,0,.12);
}
#s-check-terrain .ctu-banner.err  { background: #fbd9d7; color: var(--ctu-err); }
#s-check-terrain .ctu-banner.warn { background: #fdf1c7; color: var(--ctu-warn); }
#s-check-terrain .ctu-banner.info { background: #dbe7ff; color: var(--ctu-navy); }
#s-check-terrain .ctu-banner button {
  margin-left: auto; min-width: 44px; min-height: 44px; border: none; cursor: pointer;
  background: transparent; font-size: 20px; color: inherit; font-weight: 700;
}

/* ── Sélecteurs famille / poste ── */
#s-check-terrain .ctu-selwrap { padding: 8px 8px 0; background: #f2f4fa; border-bottom: 2px solid var(--ctu-line); }
#s-check-terrain .ctu-sel-label { font-size: 11px; text-transform: uppercase; letter-spacing: .8px; color: var(--ctu-dim); font-weight: 700; margin: 2px 2px 4px; }
#s-check-terrain .ctu-btnrow { display: flex; flex-wrap: wrap; gap: 6px; padding-bottom: 8px; }
#s-check-terrain .ctu-pbtn {
  min-height: 46px; padding: 4px 14px; border-radius: 10px; cursor: pointer;
  border: 2px solid var(--ctu-navy); background: #fff; color: var(--ctu-navy);
  font-family: var(--ctu-font); font-size: 15px; font-weight: 700;
  display: flex; flex-direction: column; align-items: center; justify-content: center; line-height: 1.15;
}
#s-check-terrain .ctu-pbtn small { font-size: 11px; font-weight: 600; opacity: .75; }
#s-check-terrain .ctu-pbtn.on { background: var(--ctu-navy); color: #fff; border-color: var(--ctu-navy); }
#s-check-terrain .ctu-pbtn.on small { color: var(--ctu-gold); opacity: 1; }
#s-check-terrain .ctu-pbtn.complete { border-color: var(--ctu-ok); }
#s-check-terrain .ctu-pbtn.complete small { color: var(--ctu-ok); }
#s-check-terrain .ctu-pbtn.on.complete { background: var(--ctu-ok); border-color: var(--ctu-ok); }
#s-check-terrain .ctu-pbtn.on.complete small { color: #fff; }

/* ── Barre outils : tri + case Départ (flex-wrap : sur téléphone étroit la
      case passe sous le select, jamais de scroll horizontal) ── */
#s-check-terrain .ctu-toolbar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 8px; background: #fff; border-bottom: 1px solid var(--ctu-line);
}
#s-check-terrain .ctu-toolbar label { font-size: 12px; font-weight: 700; color: var(--ctu-dim); text-transform: uppercase; letter-spacing: .5px; }
/* Case « Départ » — préférence d'affichage locale (chantier vues du check).
   Toute la pastille est cliquable (label) : cible ≥44px. */
#s-check-terrain .ctu-dep-toggle {
  display: flex; align-items: center; gap: 7px; flex: none;
  min-height: 44px; padding: 0 12px; cursor: pointer; user-select: none;
  border: 2px solid var(--ctu-navy); border-radius: 8px;
  color: var(--ctu-navy); font-size: 13px; font-weight: 700;
}
#s-check-terrain .ctu-dep-toggle input[type=checkbox] { width: 22px; height: 22px; accent-color: var(--ctu-navy); pointer-events: none; }
#s-check-terrain #ctu-sort-select {
  flex: 1; min-height: 44px; font-family: var(--ctu-font); font-size: 15px; font-weight: 600;
  border: 2px solid var(--ctu-navy); border-radius: 8px; color: var(--ctu-navy); background: #fff; padding: 0 8px;
}
#s-check-terrain #ctu-view-count { font-size: 13px; font-weight: 700; color: var(--ctu-dim); white-space: nowrap; }

/* ── Liste des adresses ── */
#s-check-terrain #ctu-list { padding-bottom: 24px; }
#s-check-terrain .ctu-row {
  display: flex; align-items: stretch;
  border-bottom: 1px solid var(--ctu-line);
  min-height: 56px; background: #fff; cursor: pointer;
}
#s-check-terrain .ctu-row.checked { background: #eef7f0; }
#s-check-terrain .ctu-row.checked .ctu-des { color: var(--ctu-dim); }
#s-check-terrain .ctu-ckcell {
  width: 56px; flex: none; display: flex; align-items: center; justify-content: center;
}
#s-check-terrain .ctu-row .ctu-main { flex: 1; min-width: 0; padding: 7px 4px 7px 0; display: flex; flex-direction: column; justify-content: center; }
#s-check-terrain .ctu-chips { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
#s-check-terrain .ctu-adr {
  font-weight: 800; font-size: 16px; color: #fff; background: var(--ctu-navy);
  border-radius: 6px; padding: 1px 7px; letter-spacing: .5px;
}
#s-check-terrain .ctu-row.checked .ctu-adr { background: var(--ctu-ok); }
#s-check-terrain .ctu-qty { font-size: 14px; font-weight: 800; color: var(--ctu-gold); background: var(--ctu-navy); border-radius: 6px; padding: 1px 6px; }
#s-check-terrain .ctu-chip-poste { font-size: 12px; font-weight: 700; color: var(--ctu-navy); border: 1.5px solid var(--ctu-navy); border-radius: 6px; padding: 0 6px; }
#s-check-terrain .ctu-chip-ang { font-size: 13px; font-weight: 800; color: var(--ctu-warn); }
/* Timecode de départ — chip dans la ligne de chips (flex-wrap), PAS une
   colonne rigide : passe à la ligne si la place manque, zéro scroll
   horizontal. Chaîne brute du plan (même valeur que le Plan de tir). */
#s-check-terrain .ctu-chip-dep {
  font-size: 13px; font-weight: 800; color: var(--ctu-navy);
  background: #eef1fa; border: 1px solid var(--ctu-line); border-radius: 6px;
  padding: 1px 6px; font-variant-numeric: tabular-nums; white-space: nowrap;
}
#s-check-terrain .ctu-chip-revoir {
  font-size: 11px; font-weight: 800; color: #fff; background: var(--ctu-warn);
  border-radius: 6px; padding: 1px 6px; text-transform: uppercase; letter-spacing: .4px;
}
#s-check-terrain .ctu-des { font-size: 15px; line-height: 1.3; margin-top: 3px; word-break: break-word; }
#s-check-terrain .ctu-chev {
  width: 52px; flex: none; display: flex; align-items: center; justify-content: center;
  border: none; background: transparent; font-size: 22px; color: var(--ctu-navy); cursor: pointer;
}
#s-check-terrain .ctu-chev::after { content: '▸'; transition: transform .15s; }
#s-check-terrain .ctu-row.open .ctu-chev::after { transform: rotate(90deg); }

/* enfants (adresse multi-effets dépliée) */
#s-check-terrain .ctu-children { background: #f6f7fc; border-bottom: 1px solid var(--ctu-line); }
#s-check-terrain .ctu-child {
  display: flex; align-items: center; min-height: 52px; cursor: pointer;
  border-top: 1px dashed var(--ctu-line); padding-right: 8px;
}
#s-check-terrain .ctu-child .ctu-ckcell { width: 56px; margin-left: 22px; }
#s-check-terrain .ctu-child .ctu-cdes { flex: 1; min-width: 0; font-size: 14px; line-height: 1.3; padding: 6px 0; }
#s-check-terrain .ctu-child.checked .ctu-cdes { color: var(--ctu-dim); }
#s-check-terrain .ctu-child .ctu-chip-ang { margin-left: 8px; }
#s-check-terrain .ctu-child .ctu-chip-poste { margin-left: 8px; flex: none; }
#s-check-terrain .ctu-child .ctu-chip-dep { margin-left: 8px; flex: none; }

/* cases à cocher — grandes, tri-state lisible ; les clics passent par la row */
#s-check-terrain input[type=checkbox] {
  width: 30px; height: 30px; accent-color: var(--ctu-ok); pointer-events: none;
}
#s-check-terrain input[type=checkbox]:indeterminate { accent-color: var(--ctu-gold); }
#s-check-terrain input[type=checkbox]:disabled { accent-color: var(--ctu-dim); opacity: .45; }

/* ── Pagination ── */
#s-check-terrain #ctu-more-wrap { padding: 14px; text-align: center; }
#s-check-terrain #ctu-btn-more {
  min-height: 48px; width: 100%; border-radius: 10px; border: 2px solid var(--ctu-navy); cursor: pointer;
  background: #fff; color: var(--ctu-navy); font-family: var(--ctu-font); font-size: 16px; font-weight: 700;
}

#s-check-terrain .ctu-empty { text-align: center; color: var(--ctu-dim); padding: 40px 20px; font-size: 15px; line-height: 1.5; }

/* ============================================================
   MODALE FAMILLES (vues du check 2) — desktop Conception.
   Enveloppe = composant .pdt-modal existant (charte inchangée) ;
   tout le spécifique est préfixé #ct-fam-modal / #ct-fam-backdrop.
   ============================================================ */
#ct-fam-backdrop .pdt-modal { max-width: 780px; }
#ct-fam-modal { --ctf-navy: #1a3a8f; --ctf-gold: #c9a84c; --ctf-line: #d7dbe8; --ctf-dim: #5a6172; --ctf-warn: #8a6d00; }

/* Récap compact du diff coches */
#ct-fam-modal #ct-fam-recap {
  font-family: 'DM Sans', sans-serif; font-size: 12px;
  border: 1px solid var(--ctf-line); border-radius: 8px;
  padding: 6px 10px; margin-bottom: 10px;
  columns: 2; column-gap: 18px;
}
#ct-fam-modal .ctf-recap-row {
  display: flex; justify-content: space-between; gap: 8px;
  padding: 2px 0; break-inside: avoid;
}
#ct-fam-modal .ctf-recap-row span { color: var(--ctf-dim); white-space: nowrap; }
#ct-fam-modal .ctf-recap-row b { text-align: right; }

#ct-fam-modal .ctf-banner {
  font-family: 'DM Sans', sans-serif; font-size: 12px; font-weight: 600;
  border-radius: 8px; padding: 7px 10px; margin-bottom: 8px; line-height: 1.4;
}
#ct-fam-modal .ctf-banner.warn { background: #fdf1c7; color: var(--ctf-warn); }
#ct-fam-modal .ctf-banner.info { background: #dbe7ff; color: var(--ctf-navy); }

/* Cartes famille */
#ct-fam-modal #ct-fam-list { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
#ct-fam-modal .ctf-fam {
  border: 1.5px solid var(--ctf-line); border-radius: 10px; padding: 7px 10px;
  background: #fff; transition: border-color .12s, background .12s;
}
#ct-fam-modal .ctf-fam.new { border-color: var(--ctf-gold); }
#ct-fam-modal .ctf-fam.over { border-color: var(--ctf-navy); background: #eef1fa; }
#ct-fam-modal .ctf-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
#ct-fam-modal .ctf-ord { display: flex; gap: 2px; }
#ct-fam-modal .ctf-ord button {
  width: 26px; height: 22px; border: 1px solid var(--ctf-line); border-radius: 5px;
  background: #fff; color: var(--ctf-navy); font-size: 10px; cursor: pointer; line-height: 1;
}
#ct-fam-modal .ctf-ord button:hover:not(:disabled) { border-color: var(--ctf-navy); background: #eef1fa; }
#ct-fam-modal .ctf-ord button:disabled { opacity: .3; cursor: default; }
#ct-fam-modal .ctf-lib {
  font-family: 'Exo 2', sans-serif; font-size: 14px; font-weight: 800; color: var(--ctf-navy);
  cursor: text; padding: 1px 6px; border-radius: 5px; border: 1px dashed transparent;
}
#ct-fam-modal .ctf-lib:hover { border-color: var(--ctf-navy); background: #eef1fa; }
#ct-fam-modal .ctf-lib-input {
  font-family: 'Exo 2', sans-serif; font-size: 14px; font-weight: 800; color: var(--ctf-navy);
  border: 1.5px solid var(--ctf-navy); border-radius: 5px; padding: 1px 6px; width: 180px;
}
#ct-fam-modal .ctf-badge-new {
  font-family: 'DM Sans', sans-serif; font-size: 10px; font-weight: 800; text-transform: uppercase;
  letter-spacing: .4px; color: #7a5c10; background: #fdf1c7; border-radius: 5px; padding: 2px 6px;
}
#ct-fam-modal .ctf-count { margin-left: auto; font-family: 'DM Sans', sans-serif; font-size: 11px; color: var(--ctf-dim); white-space: nowrap; }

/* Chips postes — draggables (le drag est réservé aux postes, jamais aux familles) */
#ct-fam-modal .ctf-postes { display: flex; flex-wrap: wrap; gap: 6px; min-height: 26px; }
#ct-fam-modal .ctf-poste {
  font-family: 'DM Sans', sans-serif; font-size: 12px; font-weight: 700; color: var(--ctf-navy);
  border: 1.5px solid var(--ctf-navy); border-radius: 6px; padding: 2px 8px;
  background: #fff; cursor: grab; user-select: none; display: inline-flex; align-items: center; gap: 5px;
}
#ct-fam-modal .ctf-poste:active { cursor: grabbing; }
#ct-fam-modal .ctf-poste.dragging { opacity: .4; }
/* Marqueur d'insertion du drag : barre avant/après le chip survolé
   (box-shadow : aucun décalage de mise en page pendant le survol) */
#ct-fam-modal .ctf-poste.ins-b { box-shadow: -4px 0 0 -1px var(--ctf-navy); }
#ct-fam-modal .ctf-poste.ins-a { box-shadow: 4px 0 0 -1px var(--ctf-navy); }
#ct-fam-modal .ctf-poste.new { border-color: var(--ctf-gold); background: #fdf7e3; }
#ct-fam-modal .ctf-poste em {
  font-style: normal; font-size: 9px; font-weight: 800; text-transform: uppercase;
  color: #7a5c10; background: #fdf1c7; border-radius: 4px; padding: 1px 4px;
}
#ct-fam-modal .ctf-empty { font-family: 'DM Sans', sans-serif; font-size: 12px; color: var(--ctf-dim); font-style: italic; padding: 2px 0; }

#ct-fam-modal #ct-fam-actions { display: flex; align-items: center; gap: 10px; }
#ct-fam-modal #ct-fam-add { margin-right: auto; }
