/* ═══════════════════════════════════════════════════════════════════════════
   COMPTAGE PHYSIQUE — styles propres au module (Bloc 4)
   ───────────────────────────────────────────────────────────────────────────
   Fichier SÉPARÉ de inventaire.css volontairement : celui-ci fait déjà 46 Ko
   et couvre sept écrans. Un fichier par chantier reste relisible, se déploie
   sans toucher à l'existant, et se retire d'un bloc si le module évolue.

   ON N'Y REDÉFINIT RIEN de ce qui existe déjà. Les écrans réutilisent
   .page-header, .inv-recap, .inv-barre, .inv-chip, .inv-table, .inv-statut,
   .btn — voir l'en-tête de js/inventaire/comptage.js. Seules les briques
   réellement nouvelles sont ici.

   Toutes les couleurs viennent des variables de css/base.css : aucune valeur
   en dur qui dériverait le jour où la charte change.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ─── Barre d'avancement (liste + en-tête de campagne) ─────────────────── */
.cpt-prog { display:flex; align-items:center; gap:9px; min-width:132px; }
.cpt-rail {
  flex:1; height:6px; border-radius:4px;
  background:var(--wood-pale); overflow:hidden; min-width:60px;
}
.cpt-fill {
  height:100%; border-radius:4px; background:var(--accent);
  transition:width .25s ease;
}
.cpt-fill.cpt-done { background:var(--green); }
.cpt-prog-txt {
  font-size:12px; color:var(--text-muted); white-space:nowrap;
  font-variant-numeric:tabular-nums;
}

/* ─── Écarts ────────────────────────────────────────────────────────────
   Rouge en manque, ORANGE en surplus. Le surplus n'est pas une bonne
   nouvelle — c'est une erreur dans l'autre sens : le vert le ferait lire
   comme un gain, alors qu'il signale un stock tout aussi faux.            */
.cpt-ecart { font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap; }
.cpt-moins { color:var(--red); }
.cpt-plus  { color:var(--orange); }
.cpt-zero  { color:var(--text-muted); font-weight:500; }

/* En attente : une valeur qu'on n'a PAS encore, à ne jamais confondre
   visuellement avec un zéro mesuré.                                       */
.cpt-attente {
  color:var(--wood-light); font-style:italic; font-size:12px; white-space:nowrap;
}
/* Écart réel mais non chiffrable (article sans prix). Souligné en pointillés
   pour inviter au survol, qui explique pourquoi.                          */
.cpt-nonval {
  color:var(--orange); font-size:12px; font-weight:600;
  border-bottom:1px dotted currentColor; cursor:help; white-space:nowrap;
}

/* Ligne en écart : teinte très légère, lisible sans crier. */
.inv-table tbody tr.cpt-l-ecart { background:#FEF7F5; }

/* ─── Boutons compacts de fin de ligne ─────────────────────────────────── */
.cpt-btn-s { padding:5px 11px !important; font-size:12px !important; }
.cpt-btn-danger { color:var(--red) !important; border-color:var(--red-line) !important; }
.cpt-btn-danger:hover { background:var(--red-soft) !important; }

/* ─── Retour depuis la vue détail ──────────────────────────────────────── */
.cpt-retour {
  background:none; border:none; padding:0; margin:0 0 6px;
  font-family:inherit; font-size:12px; font-weight:600;
  color:var(--accent); cursor:pointer;
}
.cpt-retour:hover { text-decoration:underline; }

/* ─── Modale de lancement ──────────────────────────────────────────────── */
.cpt-mod-body { display:flex; flex-direction:column; gap:18px; padding:4px 0 2px; }

.cpt-champ { display:flex; flex-direction:column; gap:8px; }
.cpt-champ > label {
  font-size:11px; font-weight:700; letter-spacing:.6px;
  text-transform:uppercase; color:var(--text-muted);
}
.cpt-input {
  border:1px solid var(--border); border-radius:8px; padding:9px 12px;
  font-family:inherit; font-size:13.5px; color:var(--text);
  background:var(--white); width:100%;
}
.cpt-input:focus { outline:2px solid var(--accent); outline-offset:-1px; border-color:var(--accent); }

/* Cartes de choix du périmètre */
.cpt-rcards { display:grid; grid-template-columns:repeat(auto-fit,minmax(172px,1fr)); gap:9px; }
.cpt-rcard {
  border:1.5px solid var(--border); border-radius:12px; padding:12px 13px;
  text-align:left; background:var(--white); cursor:pointer;
  font-family:inherit; transition:border-color .15s, background .15s;
}
.cpt-rcard:hover:not([disabled]) { border-color:var(--wood-light); }
.cpt-rcard.actif { border-color:var(--accent); background:var(--accent-soft); }
.cpt-rcard[disabled] { opacity:.55; cursor:not-allowed; background:var(--wood-bg); }
.cpt-rcard-t { font-weight:600; font-size:13px; color:var(--text); }
.cpt-rcard.actif .cpt-rcard-t { color:var(--accent); }
.cpt-rcard-s { font-size:12px; color:var(--text-muted); margin-top:4px; line-height:1.45; }

/* Compteur dans une puce de catégorie / emplacement */
.cpt-cnt { opacity:.7; font-size:11px; font-weight:500; }

/* Aperçu de ce qui sera compté */
.cpt-apercu {
  background:var(--wood-pale); border-radius:8px; padding:13px 15px;
  display:flex; gap:26px; flex-wrap:wrap; align-items:center;
}
.cpt-apercu-vide {
  color:var(--text-muted); font-size:12px; font-style:italic; display:block;
}
.cpt-ap-i { display:flex; flex-direction:column; gap:2px; }
.cpt-ap-v {
  font-size:19px; font-weight:700; color:var(--wood-dark);
  letter-spacing:-.3px; font-variant-numeric:tabular-nums;
}
.cpt-ap-l { font-size:11px; color:var(--text-muted); }
.cpt-ap-detail {
  margin-left:auto; font-size:12px; color:var(--text-muted); font-style:italic;
}

/* Avertissement de périmètre incomplet */
.cpt-avert {
  font-size:12px; color:var(--orange-text); background:var(--orange-soft, #FCF3E2);
  border:1px solid var(--orange-line); border-radius:8px; padding:8px 11px; line-height:1.45;
}

/* Case « comptage à l'aveugle » dans le pied de modale */
.cpt-aveugle-lbl {
  display:flex; align-items:center; gap:8px;
  font-size:12px; color:var(--text-muted); cursor:pointer; user-select:none;
}
.cpt-aveugle-lbl input { width:15px; height:15px; accent-color:var(--accent); cursor:pointer; }

/* ─── Encadrés d'information ───────────────────────────────────────────── */
.cpt-note {
  display:flex; gap:11px; align-items:flex-start;
  padding:13px 15px; border-radius:8px; border:1px solid;
  font-size:12px; line-height:1.55; margin-top:14px;
}
.cpt-note-ico {
  flex:0 0 18px; width:18px; height:18px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:11px; font-weight:700; color:var(--white); margin-top:1px;
}
.cpt-note-info { background:var(--accent-soft); border-color:var(--accent-line); color:var(--wood-dark); }
.cpt-note-info .cpt-note-ico { background:var(--accent); }
.cpt-note-warn { background:var(--orange-soft); border-color:var(--orange-line); color:var(--orange-text); }
.cpt-note-warn .cpt-note-ico { background:var(--orange); }

/* ─── Mobile / tablette ────────────────────────────────────────────────── */
@media (max-width:768px) {
  .cpt-rcards { grid-template-columns:1fr; }
  .cpt-apercu { gap:16px; }
  .cpt-ap-detail { margin-left:0; width:100%; }
  .cpt-prog { min-width:104px; }
  /* Les boutons de fin de ligne passent l'un sous l'autre plutôt que de
     forcer un défilement horizontal du tableau. */
  .inv-table .cpt-btn-s { display:block; width:100%; margin:2px 0; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   BLOC 5 — SAISIE (poste + tablette)
   ═══════════════════════════════════════════════════════════════════════════ */

/* ─── Barre d'outils de l'écran de campagne ────────────────────────────── */
.cpt-barre-droite { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.cpt-recherche-row { margin:0 0 10px; }

/* ─── Champ de saisie dans le tableau ──────────────────────────────────── */
.cpt-saisie {
  width:88px; padding:6px 9px; text-align:right;
  font-family:inherit; font-size:14px; font-weight:600;
  font-variant-numeric:tabular-nums;
  color:var(--text); background:var(--white);
  border:1px solid var(--border); border-radius:8px;
}
.cpt-saisie::placeholder { color:var(--wood-light); font-weight:400; }
.cpt-saisie:focus {
  outline:none; border-color:var(--accent); border-width:2px;
  padding:5px 8px;                      /* compense la bordure, pas de saut */
  box-shadow:0 0 0 3px var(--accent-soft);
}
/* Déjà compté : fond discret, pour distinguer d'un coup d'œil ce qui reste. */
.cpt-saisie-ok { background:var(--green-soft); border-color:var(--green-line); }
/* Refusé : la bordure rouge ne part qu'à la frappe suivante. */
.cpt-saisie-ko { border-color:var(--red) !important; background:var(--red-soft); }
.cpt-saisie:disabled { opacity:.6; cursor:wait; }

/* Éclair vert à l'enregistrement — un retour visuel par ligne plutôt qu'un
   toast : sur 150 articles, 150 toasts seraient insupportables. */
@keyframes cpt-flash-anim {
  0%   { background:var(--green-soft); }
  100% { background:transparent; }
}
.inv-table tbody tr.cpt-flash td { animation:cpt-flash-anim .7s ease-out; }
@media (prefers-reduced-motion:reduce) {
  .inv-table tbody tr.cpt-flash td { animation:none; }
}

/* Colonnes de saisie : largeur stable pour que le tableau ne « danse » pas
   quand une théorique masquée est remplacée par un nombre. */
.cpt-table-saisie .cpt-c-theo,
.cpt-table-saisie .cpt-c-ecart   { min-width:78px; }
.cpt-table-saisie .cpt-c-saisie  { min-width:104px; }
.cpt-table-saisie .cpt-c-impact  { min-width:96px; }

/* ═══ MODE TABLETTE ════════════════════════════════════════════════════════
   Plein écran par-dessus l'application. Volontairement dépouillé : au dépôt on
   tient la tablette d'une main, parfois avec des gants, et on lit à bout de
   bras. Cibles tactiles ≥ 48 px, contrastes appuyés.                        */

body.cpt-tab-actif { overflow:hidden; }   /* le fond ne défile plus derrière */

.cpt-tab-overlay {
  position:fixed; inset:0; z-index:9000;
  background:#0E2836; display:flex; justify-content:center;
  padding:0; overflow-y:auto;
}
.cpt-tab-frame {
  width:100%; max-width:560px; background:var(--wood-bg);
  display:flex; flex-direction:column; min-height:100%;
}

.cpt-tab-top {
  background:var(--wood-dark); color:var(--white); padding:14px 16px;
  display:flex; align-items:center; gap:12px;
}
.cpt-tab-titre { font-weight:600; font-size:15px; flex:1; min-width:0; }
.cpt-tab-titre small {
  display:block; font-weight:400; opacity:.65; font-size:12px; margin-top:2px;
}
.cpt-tab-cpt {
  font-size:14px; font-weight:700; white-space:nowrap;
  background:rgba(255,255,255,.14); padding:6px 12px; border-radius:20px;
  font-variant-numeric:tabular-nums;
}
.cpt-tab-x {
  background:none; border:none; color:var(--white); opacity:.7;
  font-size:20px; line-height:1; cursor:pointer; padding:8px; border-radius:8px;
}
.cpt-tab-x:hover { opacity:1; background:rgba(255,255,255,.12); }

.cpt-tab-prog { height:4px; background:rgba(255,255,255,.16); }
.cpt-tab-prog i { display:block; height:100%; background:#5FA8CC; transition:width .25s ease; }

.cpt-tab-body { padding:18px 16px 26px; display:flex; flex-direction:column; gap:15px; flex:1; }

.cpt-tab-art {
  background:var(--white); border:1px solid var(--border);
  border-radius:12px; padding:16px;
}
.cpt-tab-nom {
  font-size:19px; font-weight:700; color:var(--wood-dark);
  line-height:1.3; letter-spacing:-.2px;
}
.cpt-tab-meta { display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.cpt-tab-tag {
  background:var(--wood-pale); border-radius:8px; padding:5px 10px;
  font-size:12px; color:var(--wood-mid);
}
.cpt-tab-tag b { color:var(--wood-dark); font-weight:600; }

.cpt-tab-saisie {
  background:var(--white); border:1px solid var(--border);
  border-radius:12px; padding:16px; text-align:center;
}
.cpt-tab-lbl {
  font-size:11px; font-weight:700; letter-spacing:.7px;
  text-transform:uppercase; color:var(--text-muted);
}
.cpt-tab-valeur {
  font-size:46px; font-weight:700; color:var(--wood-dark);
  line-height:1.1; margin:8px 0 2px; letter-spacing:-1.5px;
  font-variant-numeric:tabular-nums;
}
.cpt-tab-vide { color:var(--wood-light); }
.cpt-tab-unite { font-size:13px; color:var(--text-muted); min-height:18px; }
.cpt-tab-aveugle {
  margin-top:12px; padding:8px 12px; background:var(--wood-pale);
  border-radius:8px; font-size:12px; color:var(--wood-mid);
}

/* Pavé numérique — cibles larges, pensées pour le pouce. */
.cpt-pave { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
.cpt-pave button {
  background:var(--white); border:1px solid var(--border); border-radius:12px;
  padding:16px 0; font-family:inherit; font-size:22px; font-weight:600;
  color:var(--wood-dark); cursor:pointer; min-height:56px;
  font-variant-numeric:tabular-nums; transition:background .1s;
  -webkit-tap-highlight-color:transparent;
}
.cpt-pave button:active { background:var(--wood-pale); }
.cpt-pave-eff { color:var(--red) !important; font-size:15px !important; }

.cpt-tab-actions { display:flex; gap:9px; }
.cpt-tab-btn {
  flex:1; justify-content:center; padding:15px 18px !important;
  font-size:15px !important; border-radius:12px !important; min-height:52px;
}
.cpt-tab-valider { flex:1.7; }
.cpt-tab-btn[disabled] { opacity:.45; cursor:not-allowed; }

/* Retour sur l'article précédent : c'est là que la théorique est révélée. */
.cpt-tab-retour {
  border-radius:8px; padding:11px 14px; font-size:12px;
  line-height:1.5; border:1px solid;
}
.cpt-tab-ok    { background:var(--green-soft); border-color:var(--green-line); color:#1E5A39; }
.cpt-tab-ecart { background:var(--orange-soft); border-color:var(--orange-line); color:var(--orange-text); }

/* Écran de fin */
.cpt-tab-fin { align-items:center; text-align:center; justify-content:center; gap:12px; padding-top:60px; }
.cpt-tab-fin-ico {
  width:64px; height:64px; border-radius:50%; background:var(--green-soft);
  color:var(--green); font-size:32px; font-weight:700;
  display:flex; align-items:center; justify-content:center;
}
.cpt-tab-fin-t { font-size:21px; font-weight:700; color:var(--wood-dark); }
.cpt-tab-fin-s { font-size:14px; color:var(--text-muted); }
.cpt-tab-fin-n {
  font-size:12px; color:var(--wood-mid); background:var(--wood-pale);
  border-radius:8px; padding:12px 15px; max-width:38ch; line-height:1.55;
}

@media (max-width:768px) {
  .cpt-barre-droite { width:100%; justify-content:space-between; }
  .cpt-saisie { width:72px; }
  .cpt-tab-nom { font-size:17px; }
  .cpt-tab-valeur { font-size:40px; }
}

/* ═══════════════════════════════════════════════════════════════════════════
   BLOC 6 — CLÔTURE
   ═══════════════════════════════════════════════════════════════════════════ */

.cpt-titre-bloc { font-weight:600; font-size:13.5px; color:var(--wood-dark); }
.cpt-titre-bloc .cpt-cnt { font-weight:400; margin-left:6px; }

/* ─── Motif d'écart ────────────────────────────────────────────────────── */
.cpt-motif {
  border:1px solid var(--border); border-radius:8px; padding:6px 9px;
  font-family:inherit; font-size:12px; color:var(--text);
  background:var(--white); min-width:186px; max-width:100%; cursor:pointer;
}
.cpt-motif:focus { outline:2px solid var(--accent); outline-offset:-1px; }
/* Motif exigé mais absent : la ligne se signale d'elle-même, sans qu'il faille
   la chercher dans un message d'erreur. */
.cpt-motif-vide {
  border-color:var(--orange); background:var(--orange-soft); color:var(--orange-text); font-weight:600;
}
.cpt-motif-libre { margin-top:6px; }
.cpt-motif-libre .cpt-input { font-size:12px; padding:6px 9px; }

/* ─── Encadré « tout va bien » ─────────────────────────────────────────── */
.cpt-note-ok { background:var(--green-soft); border-color:var(--green-line); color:#1E5A39; }
.cpt-note-ok .cpt-note-ico { background:var(--green); }

/* ─── Bilan chiffré ────────────────────────────────────────────────────── */
.cpt-bilan {
  background:var(--white); border:1px solid var(--border); border-radius:12px;
  padding:16px 18px; margin-top:14px;
  display:flex; gap:30px; flex-wrap:wrap; align-items:center;
}
.cpt-bilan-i { display:flex; flex-direction:column; gap:2px; }
.cpt-bilan-v { font-size:21px; font-weight:700; letter-spacing:-.4px; font-variant-numeric:tabular-nums; }
.cpt-bilan-abs { color:var(--wood-dark); }
.cpt-bilan-l {
  font-size:11px; font-weight:600; letter-spacing:.5px;
  text-transform:uppercase; color:var(--text-muted);
}
.cpt-bilan-note {
  margin-left:auto; max-width:36ch; font-size:12px;
  color:var(--text-muted); line-height:1.5;
}

/* ─── Barre d'action de clôture ────────────────────────────────────────── */
.cpt-cloture-actions {
  display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-top:16px;
}
.btn-lg { padding:12px 22px !important; font-size:15px !important; border-radius:12px !important; }
.cpt-cloture-actions .btn[disabled] { opacity:.45; cursor:not-allowed; }
.cpt-bloque { font-size:12px; color:var(--orange); font-weight:600; }

/* ─── Compte rendu après clôture ───────────────────────────────────────── */
.cpt-fin-bloc {
  background:var(--white); border:1px solid var(--border); border-radius:12px;
  padding:24px; margin-bottom:14px;
  display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center;
}
.cpt-fin-ico {
  width:56px; height:56px; border-radius:50%; background:var(--green-soft);
  color:var(--green); font-size:28px; font-weight:700;
  display:flex; align-items:center; justify-content:center;
}
.cpt-fin-t { font-size:20px; font-weight:700; color:var(--wood-dark); }
.cpt-fin-s { font-size:13.5px; color:var(--text-muted); }

@media (max-width:768px) {
  .cpt-bilan { gap:18px; }
  .cpt-bilan-note { margin-left:0; max-width:none; }
  .cpt-motif { min-width:0; width:100%; }
}

/* ─── Correction de réception (B3, 01/09/2026) ──────────────────────────── */
/* Le bouton vit dans la cellule « reçu » du détail d'un bon : discret tant
   qu'on ne le cherche pas, évident quand on en a besoin. */
.inv-dercep {
  padding:1px 7px !important; font-size:12px !important;
  line-height:1.4 !important; margin-left:5px;
  color:var(--text-muted) !important; border-color:var(--border) !important;
}
.inv-dercep:hover { color:var(--red) !important; border-color:var(--red-line) !important; background:var(--red-soft) !important; }

/* ─── Bascule « Archivés » de l'écran Articles (01/09/2026) ─────────────── */
/* Ce n'est pas un filtre de plus mais un CHANGEMENT DE VUE : on le distingue
   des puces de catégorie par une bordure pleine et un léger fond. */
.inv-chip-vue {
  border-style:solid !important; border-color:var(--wood-light) !important;
  background:var(--wood-pale) !important; font-weight:600 !important;
  margin-right:6px;
}
.inv-chip-vue.actif {
  background:var(--wood-dark) !important; border-color:var(--wood-dark) !important;
  color:var(--white) !important;
}

/* ─── Comptage à la pièce (23/09/2026, R-COMPTAGE-PIECE) ────────────────────
   Page plein écran du téléphone (mobile.js : .m-page) + journal de l'écran
   Comptage. Couleurs reprises de la couche mobile, avec repli bureau. */
.cpc-barre-btns { display:flex; gap:8px; flex-wrap:wrap; }
.cpc-btn { display:inline-flex; align-items:center; gap:8px; }
.cpc-btn svg { width:18px; height:18px; }
.m-inv-compter { background:var(--white) !important; color:var(--m-accent, #1E5A73) !important; }

.cpc-charge { padding:28px 8px; text-align:center; color:var(--m-muted, #6B7075); }
.cpc-carte { display:flex; gap:14px; align-items:center; background:var(--white); border-radius:16px; padding:14px;
  box-shadow:0 1px 2px rgba(0,0,0,.05); margin-bottom:12px; }
.cpc-photo { width:76px; height:76px; flex:none; object-fit:contain; border-radius:12px; background:var(--wood-bg); border:1px solid var(--wood-pale); }
.cpc-carte-txt { min-width:0; }
.cpc-cat { display:inline-block; font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--m-muted, #6B7075); }
.cpc-nom { font-size:19px; font-weight:800; letter-spacing:-.015em; color:var(--m-ink, #1B1F23); line-height:1.2; margin-top:2px; }
.cpc-ref { font-size:12px; color:var(--m-muted, #6B7075); margin-top:3px; }
.cpc-empl { display:inline-block; margin-top:8px; font-size:17px; font-weight:800; color:var(--white); background:var(--m-accent, #1E5A73);
  border-radius:12px; padding:4px 11px; }

.cpc-avis { display:flex; flex-direction:column; gap:3px; border-radius:16px; padding:12px 14px; margin:0 0 12px; font-size:14px; line-height:1.45; }
.cpc-avis b { font-size:15px; }
.cpc-vert { background:#DDF1E4; color:#1F5B35; }
.cpc-bleu { background:var(--accent-soft); color:#1E4A5E; }
.cpc-ambre { background:var(--orange-soft); color:#6B4205; }
.cpc-rouge { background:#F7D9D6; color:#8E2A20; }

.cpc-saisie { background:var(--white); border-radius:16px; padding:16px 14px; box-shadow:0 1px 2px rgba(0,0,0,.05); margin-bottom:12px; }
.cpc-q { display:block; text-align:center; font-size:15px; font-weight:700; color:var(--m-ink, #1B1F23); margin-bottom:10px; }
.cpc-compteur { display:flex; align-items:center; gap:12px; }
.cpc-pm { width:58px; height:58px; flex:none; border-radius:16px; border:1.5px solid var(--wood-pale); background:var(--wood-bg);
  font-size:28px; font-weight:700; color:var(--m-accent, #1E5A73); cursor:pointer; }
.cpc-pm:disabled { opacity:.4; cursor:not-allowed; }
.cpc-compteur input { flex:1; min-width:0; text-align:center; font-size:42px; font-weight:800; letter-spacing:-.04em;
  font-variant-numeric:tabular-nums; color:var(--m-ink, #1B1F23); border:none; border-bottom:2px solid var(--wood-pale);
  background:transparent; padding:4px 0; border-radius:0; }
.cpc-compteur input:focus { outline:none; border-bottom-color:var(--m-accent, #1E5A73); }
.cpc-compteur input[readonly] { color:var(--m-muted, #6B7075); }
.cpc-unite { text-align:center; font-size:12px; color:var(--m-muted, #6B7075); margin:8px 0 14px; }
.cpc-motifs { border:none; padding:0; margin:0 0 10px; display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.cpc-motifs legend { font-size:12px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--m-muted, #6B7075); margin-bottom:8px; }
.cpc-motif-choix { display:flex; align-items:center; gap:8px; border:1.5px solid var(--wood-pale); border-radius:12px; padding:10px; font-size:13.5px; cursor:pointer; background:var(--wood-bg); }
.cpc-motif-choix:has(input:checked) { border-color:var(--m-accent, #1E5A73); background:var(--accent-soft); font-weight:700; }
.cpc-motif-choix input { accent-color:var(--m-accent, #1E5A73); }
.cpc-libre { width:100%; box-sizing:border-box; border:1.5px solid var(--wood-pale); border-radius:12px; padding:12px; font:inherit; font-size:16px; margin-bottom:12px; }
.cpc-primaire, .cpc-second { width:100%; display:flex; align-items:center; justify-content:center; gap:10px; border-radius:16px;
  padding:15px; font:inherit; font-size:16px; font-weight:800; cursor:pointer; }
.cpc-primaire { border:none; color:var(--white); background:var(--m-accent, #1E5A73); box-shadow:0 6px 16px rgba(30,90,115,.25); }
.cpc-primaire:disabled { opacity:.55; cursor:progress; }
.cpc-primaire svg { width:20px; height:20px; }
.cpc-second { border:1.5px solid var(--wood-pale); background:var(--white); color:var(--m-ink, #1B1F23); }
.cpc-primaire:focus-visible, .cpc-second:focus-visible, .cpc-pm:focus-visible { outline:3px solid #8FB3C4; outline-offset:2px; }
.cpc-actions { display:flex; flex-direction:column; gap:8px; margin-top:4px; }
.cpc-dernier { font-size:12px; color:var(--m-muted, #6B7075); text-align:center; }

.cpc-journal { margin-top:28px; }
.cpc-journal-tete { margin-bottom:10px; }
.cpc-journal-titre { font-size:18px !important; }
.cpc-ok { color:var(--green); font-weight:700; }
.cpc-moins { color:var(--red); font-weight:700; }
.cpc-plus { color:var(--accent); font-weight:700; }