/*
    « Superviseur de nuit » — les écrans de la maquette superviseur-nuit (Karim, 27 oct) : le lot de l'agente
    sur le tableau de bord, la pastille « À reprendre » de la boîte, la vue du responsable, les réglages.
    Le rouge NBT #9B1024 de la maquette ; les cartes et traits des autres feuilles nbt-*.
*/
:root{
    --sup-rouge:#9B1024; --sup-encre:#1F1A1E; --sup-gris:#6b6470; --sup-trait:#E7E5EA;
    --sup-fond:#F4F2F0; --sup-rose:#F3D6DB;
}
.nbt-sup{display:grid;gap:14px}
.nbt-sup h3,.nbt-sup h4{margin:0;font-size:16px;color:var(--sup-encre)}
.nbt-sup p{margin:4px 0 0;color:var(--sup-gris);font-size:13px}
.nbt-sup-strip{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;
    background:#fff;border:1px solid var(--sup-trait);border-left:4px solid var(--sup-rouge);border-radius:16px;padding:18px 20px}
.nbt-sup-card{background:#fff;border:1px solid var(--sup-trait);border-radius:16px;overflow:hidden}
.nbt-sup-tete{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:18px 20px 0}
.nbt-sup-tete-g{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.nbt-sup-resume{font-size:15px;font-weight:600;color:var(--sup-encre)}
.nbt-sup-resume span{color:var(--sup-gris);font-weight:400}
.nbt-sup-barre{width:calc(100% - 40px);display:block;margin:14px 20px 4px;height:7px;accent-color:var(--sup-rouge)}
.nbt-sup-notes{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:0 20px 14px;color:var(--sup-gris);font-size:12px}
.nbt-sup-pastille{display:inline-block;border-radius:99px;background:var(--sup-fond);color:var(--sup-gris);padding:3px 10px;font-size:11px;font-weight:500}
.nbt-sup-rose{background:var(--sup-rose);color:var(--sup-rouge)}
/* D-WA117 : l'avis IA d'une ligne tranchée par l'agente — grisé, derrière son résultat, la raison au survol. */
.nbt-sup-avis-ia{display:inline-block;border-radius:99px;background:transparent;border:1px dashed var(--sup-trait);color:var(--sup-gris);padding:2px 9px;font-size:11px;font-weight:400;opacity:.75;cursor:help}
.nbt-sup-ligne{border-top:1px solid var(--sup-trait);padding:18px 20px;transition:opacity .18s,transform .18s}
.nbt-sup-ligne.nbt-sup-part{opacity:0;transform:translateX(20px)}
.nbt-sup-ident{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.nbt-sup-raison{color:var(--sup-encre) !important}
.nbt-sup-extrait{border-left:2px solid var(--sup-rose);padding-left:12px;margin:8px 0 0 !important;font-size:13px;color:var(--sup-gris) !important;overflow-wrap:anywhere}
.nbt-sup-gestes{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.nbt-sup-issues{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.nbt-sup-btn{display:inline-block;border:1px solid var(--sup-trait);background:#fff;border-radius:10px;
    padding:9px 13px;min-height:40px;font-weight:600;font-size:12px;color:var(--sup-encre);text-decoration:none;cursor:pointer}
.nbt-sup-btn:hover:not(:disabled):not(.nbt-sup-primary){border-color:var(--sup-rouge)}
.nbt-sup-btn:disabled{cursor:not-allowed;opacity:.45}
.nbt-sup-primary{background:var(--sup-rouge);color:#fff;border-color:var(--sup-rouge)}
.nbt-sup-verrou{margin-top:8px !important;font-size:11px}
.nbt-sup-vide{padding:22px 20px}
.nbt-sup-vide h4{font-size:15px}
.nbt-sup-pied{margin:0;font-size:12px;color:var(--sup-gris)}

/* La vue du responsable : la ligne « Cette nuit », la table par agent, le partage. */
.nbt-sup-nuit{background:#FCF3F5;color:var(--sup-rouge);border-radius:8px;padding:12px 16px;font-weight:600}
.nbt-sup-nuit small{display:block;color:var(--sup-rouge);opacity:.75;font-weight:400;font-size:12px;margin-top:2px}
.nbt-sup-table-wrap{overflow-x:auto}
table.nbt-sup-table{border-collapse:collapse;width:100%;font-size:13px;white-space:nowrap}
.nbt-sup-table th,.nbt-sup-table td{text-align:left;padding:13px 14px;border-bottom:1px solid var(--sup-trait)}
.nbt-sup-table th{font-size:11px;color:var(--sup-gris);font-weight:500}
.nbt-sup-table tbody tr:last-child td{border-bottom:0}
.nbt-sup-chiffre{color:var(--sup-rouge);font-weight:600}

/* Les réglages (Paramètres › Superviseur) : rangées comme l'onglet « Prise en charge ». */
.nbt-sup-regles{display:grid;gap:2px}
.nbt-sup-regle{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 0;border-bottom:1px solid var(--sup-trait);flex-wrap:wrap}
.nbt-sup-regle:last-child{border-bottom:0}
.nbt-sup-regle b{font-size:14px;color:var(--sup-encre)}
.nbt-sup-regle .nbt-sup-aide{color:var(--sup-gris);font-size:12px;margin-top:2px}
.nbt-sup-regle input{border:1px solid var(--sup-trait);border-radius:8px;background:#fff;padding:9px;width:110px;text-align:right}
.nbt-sup-regle input[type="time"]{width:130px;text-align:left}

@media(max-width:600px){
    .nbt-sup-strip{padding:16px}
    .nbt-sup-issues{display:grid;grid-template-columns:1fr 1fr}
    .nbt-sup-ligne{padding:16px}
}

@media(prefers-reduced-motion:reduce){.nbt-sup-ligne{transition:none}}

/* Le dialogue « Partager » (vue du responsable) et ses cadres. */
.nbt-sup-cadre{margin:14px 20px 20px}
.nbt-sup-cadre-table{margin:14px 20px 20px}
.nbt-sup-dialogue{border:1px solid var(--sup-trait);border-radius:16px;padding:24px;max-width:460px;width:calc(100% - 32px);color:var(--sup-encre)}
.nbt-sup-dialogue::backdrop{background:#1f1a1e66}
.nbt-sup-formulaire{display:grid;gap:8px}
.nbt-sup-formulaire label{font-size:12px;color:var(--sup-gris);margin-top:8px}
.nbt-sup-formulaire select,.nbt-sup-formulaire input{border:1px solid var(--sup-trait);border-radius:8px;background:#fff;padding:10px;width:100%;font:inherit;color:inherit}
.nbt-sup-dacts{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}