/* =====================================================================
   📬 COMUNICA · stile unico chiaro (25/10/2026)
   Cos'è: il nuovo aspetto della finestra «📬 COMUNICA» (fondo bianco,
   un colore per canale: 💬 SMS verde, 🔗 LINK lilla, ✉️ EMAIL blu,
   📨 PEC viola), come nell'anteprima approvata il 25/10/2026.
   Dove si carica: ULTIMO in cssList, dopo comunicazioni-*.css, perché
   deve vincere sulle regole di prima (che restano dove sono).
   Cosa tocca: SOLO la finestra COMUNICA. Ogni regola parte da
   .cm2-dialog, quindi il resto di Espo non cambia.
   Il colore «scelto» (pillole, pulsante, fasce) viene dalla classe
   can-sms / can-link / can-email / can-pec sul contenitore .cm2-lancia.
   ===================================================================== */

/* ---------- colori: valori di partenza (LINK) e per canale ---------- */
.cm2-dialog{
  --cm-c:#534AB7; --cm-l:#EEEDFE; --cm-t:#3C3489; --cm-b:#534AB7;
  --cm-sb:#F4F3FE; --cm-ss:#dcd9fa;
  --modal-header-bg:#fff; --modal-footer-bg:#fff; --modal-content-bg:#fff; --input-bg:#fff;
}
.cm2-dialog .cm2-lancia.can-sms  {--cm-c:#3B6D11;--cm-l:#EAF3DE;--cm-t:#27500A;--cm-b:#3B6D11;--cm-sb:#F3F8EC;--cm-ss:#d9e8c6}
.cm2-dialog .cm2-lancia.can-link {--cm-c:#534AB7;--cm-l:#EEEDFE;--cm-t:#3C3489;--cm-b:#534AB7;--cm-sb:#F4F3FE;--cm-ss:#dcd9fa}
.cm2-dialog .cm2-lancia.can-email{--cm-c:#1d5fa8;--cm-l:#E6F1FB;--cm-t:#0C447C;--cm-b:#1d5fa8;--cm-sb:#EEF4FC;--cm-ss:#cfe0f5}
.cm2-dialog .cm2-lancia.can-pec  {--cm-c:#7A2E8E;--cm-l:#F4E9F7;--cm-t:#5b1f6b;--cm-b:#7A2E8E;--cm-sb:#FAF3FC;--cm-ss:#ead7f0}

/* ---------- finestra bianca ---------- */
.cm2-dialog .modal-content,
.cm2-dialog .modal-header,
.cm2-dialog .modal-body,
.cm2-dialog .modal-footer{background:#fff!important}
.cm2-dialog .modal-footer{border-top:1px solid #eee}
.cm2-dialog .cm2-lancia{color:#222}
.cm2-dialog .cm2-lancia .form-control{background:#fff;border:1px solid #d5d3cc;border-radius:6px}
.cm2-dialog .cm2-lancia .form-control:focus{border-color:var(--cm-c);box-shadow:0 0 0 2px var(--cm-l)}

/* ---------- canali in alto ---------- */
.cm2-dialog .cm2-canali{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 12px;padding-top:9px}
.cm2-dialog .cm2-can{position:relative;display:inline-block;font-size:13px;font-weight:bold;line-height:1.3;padding:7px 12px;
  border-radius:7px;border:2px solid #d5d3cc;background:#fff;cursor:pointer;user-select:none;white-space:nowrap}
.cm2-dialog .cm2-can.t-sms{color:#3B6D11}.cm2-dialog .cm2-can.t-link{color:#534AB7}
.cm2-dialog .cm2-can.t-email{color:#1d5fa8}.cm2-dialog .cm2-can.t-pec{color:#7A2E8E}
.cm2-dialog .cm2-can:hover{border-color:currentColor}
.cm2-dialog .cm2-can.on{color:#fff!important}
.cm2-dialog .cm2-can.t-sms.on{background:#3B6D11;border-color:#3B6D11}
.cm2-dialog .cm2-can.t-link.on{background:#534AB7;border-color:#534AB7}
.cm2-dialog .cm2-can.t-email.on{background:#1d5fa8;border-color:#1d5fa8}
.cm2-dialog .cm2-can.t-pec.on{background:#7A2E8E;border-color:#7A2E8E}
.cm2-dialog .cm2-star{position:absolute;top:-9px;right:-6px;font-size:10px;font-weight:bold;line-height:1.4;background:#EF9F27;color:#fff;
  border-radius:8px;padding:1px 6px;white-space:nowrap;pointer-events:none}

/* vecchie linguette (se ricompaiono): colore del canale, niente bordeaux */
.cm2-dialog .cm2-tabs{background:#fff;border-bottom-color:#e3e0d6}
.cm2-dialog .cm2-tabs div{color:#666}
.cm2-dialog .cm2-tabs div.on{color:var(--cm-c);border-bottom-color:var(--cm-c)}

/* ---------- fasce di avviso ---------- */
.cm2-dialog .cm2-hint{font-size:13px;line-height:1.45;border-radius:8px;padding:8px 11px;margin:0 0 10px;
  background:var(--cm-l);color:var(--cm-t);border:1px solid transparent}
.cm2-dialog .cm2-hint.giallo,
.cm2-dialog .cm2-corso,
.cm2-dialog .cm2-ok.giallo{background:#FFF8E6;color:#7a4b00;border:1px solid #F2D06B}
.cm2-dialog .cm2-corso{border-radius:8px;padding:7px 11px;margin-bottom:10px;font-size:13px}
.cm2-dialog .cm2-corso>b{color:#7a4b00}
.cm2-dialog .cm2-chip.giallo{background:#FAEEDA;color:#633806}
.cm2-dialog .cm2-chip.blu{background:#E6F1FB;color:#0C447C}
.cm2-dialog .cm2-avv{color:#7a4b00}

/* ---------- titoletti e testi ---------- */
.cm2-dialog .cm2-pr,
.cm2-dialog .cm2-lancia label{color:#555}
.cm2-dialog .cm2-pr small,
.cm2-dialog .cm2-lancia label small{color:#888}
.cm2-dialog .cm2-leg,
.cm2-dialog .cm2-nota{color:#777}
.cm2-dialog .cm2-p2t{color:#222;border-bottom-color:#eee}
.cm2-dialog .cm2-indietro{color:var(--cm-c)!important;text-decoration:none}
.cm2-dialog .cm2-indietro:hover{text-decoration:underline}

/* ---------- carte da scegliere ---------- */
.cm2-dialog .cm2-mb{background:#fbfaf6;border:1.5px solid #9db3d6;border-radius:10px;padding:12px 14px}
.cm2-dialog .cm2-mb:hover{background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.cm2-dialog .cm2-mb small{color:#666}
.cm2-dialog .cm2-mb.in{border-color:#e0a3ad}
.cm2-dialog .cm2-mb.out{border-color:#9db3d6}
.cm2-dialog .cm2-mb.rt{border-color:#93c9a8}
.cm2-dialog .cm2-mb.pec{border-color:#c49ad1}
/* consigliata: segue il canale in uso (EMAIL blu, PEC viola…) */
.cm2-dialog .cm2-mb.sug,
.cm2-dialog .cm2-mb.sug:hover{border-color:var(--cm-b);background:var(--cm-sb);box-shadow:0 0 0 2px var(--cm-ss)}
.cm2-dialog .cm2-mb.pec.sug,
.cm2-dialog .cm2-mb.pec.sug:hover{border-color:#7A2E8E;background:#FAF3FC;box-shadow:0 0 0 2px #ead7f0}
/* non disponibile qui */
.cm2-dialog .cm2-mb.off,
.cm2-dialog .cm2-mb.off:hover{opacity:.5;border-style:dashed;background:#fbfaf6;box-shadow:none;cursor:default}

/* ---------- scelte piccole (a chi, entro, canale) ---------- */
.cm2-dialog .cm2-sc{background:#fff;color:#444;border:1.5px solid #d5d3cc;border-radius:16px;padding:5px 12px}
.cm2-dialog .cm2-sc:hover{border-color:var(--cm-c)}
.cm2-dialog .cm2-sc.on{background:var(--cm-c);border-color:var(--cm-c);color:#fff}

/* ---------- voci da spuntare ---------- */
.cm2-dialog .cm2-voci .cm2-vc{color:#222!important;border-top-color:#f0eee8}
.cm2-dialog .cm2-voci .cm2-vc input[type=checkbox]{accent-color:var(--cm-c)}
.cm2-dialog .cm2-voci .cm2-vc small{color:#888}

/* ---------- pulsanti ---------- */
.cm2-dialog .cm2-btn.b1{background:var(--cm-c);border:1.5px solid var(--cm-c);color:#fff!important}
.cm2-dialog .cm2-btn.b5{background:#fff;border:1.5px solid #ccc;color:#555!important}
.cm2-dialog .cm2-btn.big{border-radius:8px}

/* ---------- destinatari email/PEC ---------- */
.cm2-dialog .cm2-dest{display:inline-flex;align-items:center;gap:6px;background:var(--cm-l);color:var(--cm-t);border-radius:14px;
  padding:3px 4px 3px 11px;margin:0 6px 6px 0;font-size:13px;line-height:1.5;vertical-align:middle;max-width:100%}
.cm2-dialog .cm2-dest i{font-style:normal;font-size:11.5px;opacity:.8;white-space:nowrap}
.cm2-dialog .cm2-dest-x{display:inline-flex;align-items:center;justify-content:center;flex:none;width:18px;height:18px;border-radius:50%;
  background:#fff;color:#A32D2D!important;border:1px solid #f0c4c4;font-size:10px;line-height:1;cursor:pointer;text-decoration:none!important}
.cm2-dialog .cm2-dest-x:hover{background:#A32D2D;color:#fff!important;border-color:#A32D2D}
.cm2-dialog .cm2-dest-add{display:inline-block;border:1.5px dashed var(--cm-c);color:var(--cm-c);background:#fff;border-radius:14px;
  padding:2px 11px;margin:0 6px 6px 0;font-size:13px;cursor:pointer;vertical-align:middle}
.cm2-dialog .cm2-dest-add:hover{background:var(--cm-l)}
.cm2-dialog .cm2-da{display:inline-block;background:#f1efe8;color:#555;border:1px solid #e0ddd4;border-radius:14px;padding:3px 11px;
  font-size:13px;vertical-align:middle}

/* oggetto evidenziato nell'anteprima */
.cm2-dialog em.cm2-evid{font-style:normal;background:#FFF4C2;border-radius:3px;padding:0 3px}

/* ---------- anteprima del messaggio e contatore SMS ---------- */
.cm2-dialog .cm2-anteprima{background:#fbfaf6;border:1px solid #e3e0d6;border-radius:8px;padding:9px 11px;font-size:13px;line-height:1.5;color:#222;margin-bottom:4px}
.cm2-dialog .cm2-ogg-prev{font-weight:bold;font-size:13px}
.cm2-dialog .cm2-cnt{font-size:12px;color:#3B6D11;margin-top:4px}
.cm2-dialog .cm2-cnt.lungo{color:#BA7517}
/* fascia gialla «risposta richiesta» */
.cm2-dialog .cm2-risp{background:#FFF4C2;border:1px solid #F2D06B;border-radius:6px;padding:7px 10px;font-weight:bold;color:#5a4500;
  font-size:13px;line-height:1.4;width:auto;max-width:100%;margin:6px 0}

/* ---------- note piccole nelle liste (vincono su .cm2-vc small) ---------- */
.cm2-dialog small.cm2-manca,.cm2-dialog .cm2-voci .cm2-vc small.cm2-manca{color:#A32D2D}
.cm2-dialog small.cm2-solopec,.cm2-dialog .cm2-voci .cm2-vc small.cm2-solopec{color:#7A2E8E}
.cm2-dialog small.cm2-valuta,.cm2-dialog .cm2-voci .cm2-vc small.cm2-valuta{color:#8a5a00}
.cm2-dialog small.cm2-scad,.cm2-dialog .cm2-voci .cm2-vc small.cm2-scad{color:#A32D2D;font-weight:bold}

/* ---------- PEC agli enti e anteprima: toni chiari ---------- */
.cm2-dialog .cm2-fisso{background:#f7f6f2;border-color:#e3e0d6;color:#222}
.cm2-dialog .cm2-pcb{background:#fbfaf6;border:1px solid #e3e0d6}
.cm2-dialog .cm2-chain .an.now{border-color:var(--cm-c);box-shadow:0 0 0 2px var(--cm-l)}
.cm2-dialog .cm2-evs .ev{border-top-color:#f0eee8}

/* ---------- telefono ---------- */
@media (max-width:600px){
  .cm2-dialog .cm2-mod,
  .cm2-dialog .cm2-2c{grid-template-columns:1fr}
  .cm2-dialog .cm2-fb{flex-direction:column}
}
