/* Dossier › Décisions (decisions.js) — l'onglet du dossier, la fenêtre « Nouvelle décision » (à gauche ce qu'on écrit,
   à droite ce que le client verra) et la lecture d'une décision publiée ou validée. Maquette « Espace client en trois
   profils » (27 sept. 2026). Toutes les classes portent le préfixe dec- : les classes d’état courtes sont globales ici. */

/* ---- l'onglet ---- */
.dec-barre{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-bottom:12px;border-bottom:1px solid var(--border)}
.dec-phrase{margin-right:auto;font-size:12.5px;color:var(--ink-3)}
.dec-ligne .dec-ic{background:rgba(237,88,71,.1);color:var(--gold-deep)}
.dec-ligne.dec-brouillon .dec-ic,.dec-ligne.dec-retiree .dec-ic{background:var(--surface-2);color:var(--ink-3)}
.dec-ligne.dec-validee .dec-ic{background:rgba(21,122,71,.12);color:var(--pos)}
html[data-theme="dark"] .dec-ligne .dec-ic{background:rgba(240,128,110,.14);color:var(--coral-text)}
html[data-theme="dark"] .dec-ligne.dec-validee .dec-ic{background:rgba(72,209,137,.14);color:var(--pos)}
html[data-theme="dark"] .dec-ligne.dec-brouillon .dec-ic,html[data-theme="dark"] .dec-ligne.dec-retiree .dec-ic{background:var(--surface-2);color:var(--ink-3)}
.dec-ouvrir{background:none;border:0;padding:0;text-align:left;font:inherit;color:inherit;cursor:pointer;display:block}
.dec-ouvrir .row-name,.dec-ouvrir .row-sub{display:block}
.dec-ouvrir:hover .row-name{color:var(--coral-text)}
.dec-ouvrir:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}
.dec-retiree{opacity:.75}
.dec-ligne.dec-retiree .row-name{color:var(--ink-3)}
.dec-vide{display:grid;justify-items:center;gap:6px;padding:34px 18px 26px;text-align:center;color:var(--ink-3);font-size:13px;line-height:1.55}
.dec-vide b{color:var(--ink-2);font-size:14px}
.dec-vide span{max-width:52ch}

/* ---- le genre (6 nov. 2026) : un choix ou une validation ---- */
.dec-genre{display:grid;gap:6px}
.dec-genre .seg{justify-self:start}
/* l'aperçu d'une validation : la carte de réponse, en réduit */
.dec-m-rep{display:grid;gap:8px;padding:12px;border:1.5px solid var(--border);border-radius:var(--r-bloc);background:var(--surface)}
.dec-m-rep b{font:650 13.5px/1.3 'Switzer',sans-serif;color:var(--ink)}
.dec-m-rep p{margin:0;font-size:12.5px;line-height:1.5;color:var(--ink-2)}
.dec-m-rep p b{font:inherit;font-weight:650}
.dec-m-btns{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}
.dec-m-btns span{font-size:11.5px;font-weight:600;padding:5px 9px;border-radius:var(--r-ctrl);border:1px solid var(--border-strong);color:var(--ink-2)}
.dec-m-btns span.plein{background:var(--accent-strong);border-color:var(--accent-strong);color:#fff}
/* les remarques du client, dans la lecture */
.dec-remarques{display:grid;gap:10px}
.dec-remarque{display:grid;gap:4px}
.dec-remarque small{font-size:12px;color:var(--ink-3)}
.dec-remarque.reprise{opacity:.7}

/* l'échéance (6 nov. 2026) : son nom dans le champ, en gris, tant qu'aucune date n'est choisie */
.dec-date{position:relative;display:inline-block}
.dec-date input{min-width:290px}
.dec-date input.vide:not(:focus){color:transparent}
.dec-date-ph{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--ink-3);pointer-events:none;font-size:var(--champ-taille); font-weight:var(--champ-graisse);white-space:nowrap} /* le placeholder du kit : .9 × 13.5 px */
.dec-date input:not(.vide) + .dec-date-ph,.dec-date input:focus + .dec-date-ph{display:none}

/* ---- la fenêtre : deux volets qui défilent chacun ---- */
.dec-volets{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr)}
.dec-form{padding:18px 24px 22px;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:14px}
.dec-vue{background:var(--surface-2);border-left:1px solid var(--border);padding:16px 20px 20px;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:10px}
.dec-form > *,.dec-vue > *{flex:none}
.dec-form .field{margin:0}
.dec-form .edt{--edt-min:96px;--edt-max:260px}
.dec-label{display:flex;align-items:center;font-size:11.5px;font-weight:600;color:var(--ink-2);margin-bottom:6px}
.dec-label .opt{margin-left:auto;font-size:10px;font-weight:500;color:var(--ink-3)}
.dec-fs{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.dec-pied{margin-right:auto;font-size:12px;color:var(--ink-3)}
.dec-echeance input{max-width:220px}

/* les visuels en puces : ouvrir, retirer */
.dec-pj{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.dec-puce{display:inline-flex;align-items:center;border:1px solid var(--border-strong);border-radius:99px;background:var(--surface);max-width:100%}
.dec-puce-o{display:inline-flex;align-items:center;gap:6px;min-width:0;background:none;border:0;padding:5px 6px 5px 11px;font:inherit;font-size:12.5px;color:var(--ink-2);cursor:pointer}
.dec-puce-o span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}
.dec-puce-o small{font-size:11px;color:var(--ink-3)}
.dec-puce-o:hover span{color:var(--coral-text)}
.dec-puce-x{display:grid;place-items:center;width:26px;height:26px;margin-right:2px;border:0;border-radius:50%;background:none;color:var(--ink-3);cursor:pointer}
.dec-puce-x:hover{background:var(--surface-2);color:var(--neg)}
.dec-puce-o:focus-visible,.dec-puce-x:focus-visible,.dec-pj-aj:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.dec-pj-aj{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border:1px dashed var(--border-strong);border-radius:99px;background:none;font:inherit;font-size:12.5px;font-weight:600;color:var(--ink-2);cursor:pointer}
.dec-pj-aj:hover{border-color:var(--accent);color:var(--coral-text)}

/* une option qu'on écrit */
.dec-options{display:grid;gap:10px}
.dec-oed{display:grid;gap:8px;padding:12px;border:1px solid var(--border);border-radius:var(--r-bloc);background:var(--surface)}
.dec-oed.dec-reco{border-color:rgba(237,88,71,.45)}
.dec-oed-h{display:flex;align-items:center;gap:9px}
.dec-oed-h input,.dec-oed textarea{border:1px solid var(--field-border);border-radius:var(--r-ctrl);padding:9px 12px;font:inherit;font-size:var(--champ-taille);font-weight:var(--champ-graisse);color:var(--ink);background:var(--surface);transition:border-color .15s,box-shadow .15s}
.dec-oed-h input:focus,.dec-oed textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(237,88,71,.16)}
.dec-oed-h input{flex:1;min-width:0;font-weight:600}
.dec-oed textarea{min-height:56px;resize:vertical;field-sizing:content;max-height:180px;line-height:1.5}
.dec-oed-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
.dec-prefixe{display:flex;align-items:center;gap:2px;min-height:40px;padding:0 4px 0 11px;border:1px solid var(--field-border);border-radius:var(--r-md);background:var(--surface);cursor:text}
.dec-prefixe span{font-size:12.5px;color:var(--ink-3);white-space:nowrap}
.dec-prefixe input{flex:1;min-width:0;border:0;background:transparent;box-shadow:none;padding:8px 6px;min-height:0;font:inherit;font-size:var(--champ-taille);font-weight:var(--champ-graisse);color:var(--ink)}
.dec-prefixe input:focus{outline:none;box-shadow:none}
.dec-prefixe:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px rgba(237,88,71,.14)}
.dec-oed-bas{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.dec-lettre{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--surface-2);font:700 12px/1 'Switzer',sans-serif;color:var(--ink);flex:none}
.dec-oed.dec-reco .dec-lettre{background:var(--accent-strong);color:#fff}
.dec-rad{display:inline-flex;align-items:center;gap:7px;padding:4px 2px;border:0;background:none;font:inherit;font-size:12.5px;font-weight:600;color:var(--ink-2);cursor:pointer}
.dec-rad i{width:16px;height:16px;border-radius:50%;border:1.5px solid var(--border-strong);display:grid;place-items:center;flex:none}
.dec-rad.dec-rad-on{color:var(--coral-text)}
.dec-rad.dec-rad-on i{border-color:var(--accent-strong)}
.dec-rad.dec-rad-on i::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent-strong)}
.dec-rad:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
.dec-ajout{display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 12px;border:1px dashed var(--border-strong);border-radius:var(--r-ctrl);background:none;font:inherit;font-size:12.5px;font-weight:600;color:var(--ink-2);cursor:pointer}
.dec-ajout:hover{border-color:var(--accent);color:var(--coral-text)}
.dec-ajout[hidden]{display:none}

/* ---- ce que voit le client : la page, en réduit ---- */
.dec-mini{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-bloc);padding:14px;display:grid;gap:9px}
.dec-m-fil{font-size:11.5px;color:var(--ink-3)}
.dec-m-h1{font:650 17px/1.25 'Switzer',sans-serif;letter-spacing:-.01em;color:var(--ink);text-wrap:balance;overflow-wrap:anywhere}
.dec-m-ph{color:var(--ink-3);font-weight:500}
.dec-m-puces{display:flex;gap:6px;flex-wrap:wrap}
.dec-m-ctx{font-size:12.5px;line-height:1.55;color:var(--ink-2)}
.dec-m-ctx p{margin:0 0 6px}
.dec-m-ctx ul,.dec-m-ctx ol{margin:0 0 6px;padding-left:20px}
.dec-m-opts{display:grid;gap:12px;margin-top:4px}
.dec-m-opc,.dec-l-opc{position:relative;display:grid;gap:6px;padding:12px;border:1.5px solid var(--border);border-radius:var(--r-bloc);background:var(--surface)}
.dec-m-opc p,.dec-l-opc p{margin:0;font-size:12.5px;line-height:1.5;color:var(--ink-2)}
.dec-m-oh{display:flex;align-items:center;gap:9px}
.dec-m-oh b{font:650 13.5px/1.3 'Switzer',sans-serif;color:var(--ink);min-width:0;overflow-wrap:anywhere}
.dec-m-oh .dec-retenue{margin-left:auto}
.dec-m-radio{margin-left:auto;width:17px;height:17px;border-radius:50%;border:1.5px solid var(--border-strong);flex:none}
.dec-m-reco{position:absolute;top:-9px;left:12px;font:700 9.5px/1 'Satoshi',sans-serif;letter-spacing:.07em;text-transform:uppercase;background:var(--surface);color:var(--coral-text);border:1px solid rgba(237,88,71,.45);border-radius:99px;padding:3px 8px}
.dec-m-faits{display:flex;gap:6px;flex-wrap:wrap}
.dec-m-faits span{font-size:11.5px;padding:3px 8px;border-radius:99px;background:var(--surface-2);color:var(--ink-2);white-space:nowrap}
.dec-m-faits span.dec-plus{background:var(--warn-soft);color:var(--warn)}
/* les visuels, comme l'espace du client les montre (portail.html : .opt-visuel, .pj) : le premier d'une option en
   grand — une image recadrée, une page d'artefact en réduit, un PDF —, les autres en puces */
.dec-m-vis{position:relative;display:block;width:100%;height:150px;border-radius:var(--r-ctrl);background:var(--surface-2);border:1px solid var(--border);overflow:hidden;padding:0;cursor:zoom-in}
.dec-m-vis img{display:block;width:100%;height:100%;object-fit:cover}
.dec-m-page iframe{position:absolute;top:0;left:0;width:1280px;height:800px;border:0;transform-origin:0 0;pointer-events:none;background:#fff}
.dec-m-page .dec-m-grand{position:absolute;right:8px;bottom:8px;z-index:1}
.dec-m-pdf{display:flex;align-items:center;justify-content:center;gap:8px;height:auto;min-height:64px;cursor:pointer;color:var(--ink-2);text-decoration:none;font-size:12.5px;font-weight:600}
.dec-m-pj{display:flex;gap:8px;flex-wrap:wrap}
.dec-m-pjb{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border:1px solid var(--border-strong);border-radius:99px;font:inherit;font-size:12.5px;color:var(--ink-2);background:var(--surface);cursor:pointer;max-width:100%}
.dec-m-pjb span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dec-m-pjb:hover{color:var(--ink);border-color:var(--ink-3)}
.dec-m-vis:focus-visible,.dec-m-pjb:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ---- la lecture d'une décision publiée, validée ou retirée ---- */
.dec-lecture{display:grid;gap:14px}
.dec-lecture .hint.ic{margin:0}
.dec-l-ctx{font-size:13.5px;line-height:1.6;color:var(--ink-2)}
.dec-l-ctx p{margin:0 0 8px}
.dec-l-ctx ul,.dec-l-ctx ol{margin:0 0 8px;padding-left:22px}
.dec-l-opts{display:grid;gap:14px;margin-top:4px}
.dec-l-opc.dec-choisie{border-color:var(--accent-strong);box-shadow:0 0 0 4px rgba(237,88,71,.1)}
.dec-l-opc.dec-choisie .dec-lettre{background:var(--accent-strong);color:#fff}
.dec-l-opc.dec-eteinte{opacity:.55}
.dec-recu{display:flex;align-items:center;gap:12px;padding:13px 15px;border-radius:var(--r-bloc);background:rgba(21,122,71,.1);border:1px solid rgba(21,122,71,.25);color:var(--pos)}
html[data-theme="dark"] .dec-recu{background:rgba(72,209,137,.12);border-color:rgba(72,209,137,.3)}
.dec-recu b{display:block;font:650 14px/1.3 'Switzer',sans-serif;color:var(--ink)}
.dec-recu small{display:block;font-size:12px;color:var(--ink-2)}
.dec-citation{margin:0;border-left:3px solid var(--border-strong);padding:2px 0 2px 12px;font-size:13px;line-height:1.55;color:var(--ink-2);white-space:pre-line}

@media(max-width:900px){
  /* au téléphone, un seul défilement : ce qu'on écrit, puis ce que voit le client */
  .dec-volets{grid-template-columns:minmax(0,1fr);overflow:auto}
  .dec-form,.dec-vue{overflow:visible;min-height:auto}
  .dec-form{padding:16px}
  .dec-vue{border-left:0;border-top:1px solid var(--border);padding:14px 16px 18px}
  .dec-pied{display:none}
  .dec-oed-g{grid-template-columns:minmax(0,1fr)}
  .dec-oed-h input,.dec-oed textarea,.dec-prefixe input{font-size:var(--champ-taille-tel)}
}

/* Réglages du dossier › L'espace client (index.html) : l'interrupteur à droite de son texte */
.field.dm-module{display:flex;flex-direction:row;align-items:center;gap:16px}
.dm-module .rg-bascule-txt{flex:1;min-width:0}
.dm-module .rg-bascule-txt .hint{margin-top:2px}