/* casaitalia-chat.css — stile della finestra di chat dell'assistenza Casa Italia.
   Tutto sta sotto #casaitalia-chat con classi .cic-* per non litigare col tema
   (Flatsome). Il pubblico ha spesso più di 65 anni: testo 16px, contrasto alto,
   bottoni grandi. I colori del marchio arrivano dal JS come variabili. */

#casaitalia-chat{
  all:initial;
  --cic-colore:#ED7169;        /* corallo Casa Italia, sovrascritto dal JS */
  --cic-ink-colore:#14212B;    /* testo sopra il colore del marchio */
  --cic-z:999999;
  --cic-ink:#14212B;
  --cic-muto:#5B6B7A;
  --cic-fondo:#FFFFFF;
  --cic-fondo2:#F1F3F5;
  --cic-linea:#D9DEE3;
  --cic-errore:#B3261E;
  --cic-link:#0F5E8C;
  --cic-fuoco:#1E7FB4;
  position:fixed;bottom:0;right:0;width:0;height:0;overflow:visible;
  z-index:var(--cic-z);
  font-family:Montserrat,"Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;
  font-size:16px;line-height:1.45;color:var(--cic-ink);
  direction:ltr;text-align:left;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
#casaitalia-chat *,#casaitalia-chat *::before,#casaitalia-chat *::after{
  box-sizing:border-box;margin:0;padding:0;font-family:inherit;
}
#casaitalia-chat button{
  font:inherit;color:inherit;background:none;border:0;cursor:pointer;
  -webkit-appearance:none;appearance:none;line-height:1.2;
}
#casaitalia-chat [hidden]{display:none!important}
#casaitalia-chat button:focus-visible,#casaitalia-chat a:focus-visible{
  outline:3px solid var(--cic-fuoco);outline-offset:2px;
}
#casaitalia-chat svg{display:block;width:1em;height:1em}

/* ---- la bolla in basso ------------------------------------------------- */
#casaitalia-chat .cic-bolla{
  position:fixed;bottom:24px;right:24px;width:64px;height:64px;border-radius:50%;
  background:var(--cic-colore);color:var(--cic-ink-colore);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 20px rgba(0,0,0,.28);z-index:var(--cic-z);
  transition:transform .15s ease,box-shadow .15s ease;
}
#casaitalia-chat .cic-bolla:hover{transform:scale(1.06);box-shadow:0 8px 24px rgba(0,0,0,.32)}
#casaitalia-chat .cic-bolla svg{width:32px;height:32px}
#casaitalia-chat .cic-bolla.cic-nascosta{display:none}
#casaitalia-chat.cic-lato-sinistra .cic-bolla{right:auto;left:24px}
#casaitalia-chat .cic-badge{
  position:absolute;top:-3px;right:-3px;min-width:24px;height:24px;padding:0 6px;
  border-radius:12px;background:var(--cic-errore);color:#fff;font-size:13px;font-weight:700;
  display:flex;align-items:center;justify-content:center;border:2px solid #fff;
}

/* ---- la finestra --------------------------------------------------------- */
#casaitalia-chat .cic-finestra{
  position:fixed;bottom:24px;right:24px;width:380px;max-width:calc(100vw - 32px);
  height:600px;height:min(600px,85vh);
  display:flex;flex-direction:column;background:var(--cic-fondo);
  border-radius:16px;box-shadow:0 12px 40px rgba(0,0,0,.3);overflow:hidden;
  z-index:var(--cic-z);
}
#casaitalia-chat.cic-lato-sinistra .cic-finestra{right:auto;left:24px}

#casaitalia-chat .cic-testata{
  display:flex;align-items:center;gap:12px;padding:14px 12px 14px 18px;
  background:var(--cic-colore);color:var(--cic-ink-colore);flex:0 0 auto;
}
#casaitalia-chat .cic-titoli{flex:1 1 auto;min-width:0}
#casaitalia-chat .cic-titolo{font-size:17px;font-weight:700;line-height:1.25}
#casaitalia-chat .cic-sottotitolo{font-size:13.5px;opacity:.92;margin-top:2px}
#casaitalia-chat .cic-bollino{
  flex:0 0 auto;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  padding:4px 9px;border-radius:999px;background:#FFFFFF;color:#7A2E22;
  border:1px solid rgba(0,0,0,.18);
}
#casaitalia-chat .cic-chiudi{
  flex:0 0 auto;width:44px;height:44px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;color:inherit;
}
#casaitalia-chat .cic-chiudi svg{width:22px;height:22px}
#casaitalia-chat .cic-chiudi:hover{background:rgba(0,0,0,.14)}

/* ---- i messaggi ---------------------------------------------------------- */
#casaitalia-chat .cic-messaggi{
  flex:1 1 auto;overflow-y:auto;padding:16px 14px;
  display:flex;flex-direction:column;gap:10px;
  background:var(--cic-fondo2);overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
}
#casaitalia-chat .cic-msg{display:flex;flex-direction:column;max-width:88%}
#casaitalia-chat .cic-bot{align-self:flex-start;align-items:flex-start}
#casaitalia-chat .cic-tu{align-self:flex-end;align-items:flex-end}
#casaitalia-chat .cic-nuvola{
  padding:11px 14px;border-radius:16px;font-size:16px;line-height:1.5;
  overflow-wrap:anywhere;word-wrap:break-word;white-space:normal;
}
#casaitalia-chat .cic-bot .cic-nuvola{
  background:#FFFFFF;color:var(--cic-ink);border:1px solid var(--cic-linea);
  border-bottom-left-radius:6px;
}
#casaitalia-chat .cic-tu .cic-nuvola{
  background:var(--cic-colore);color:var(--cic-ink-colore);
  border-bottom-right-radius:6px;white-space:pre-wrap;
}
#casaitalia-chat .cic-nuvola p{margin:0 0 8px}
#casaitalia-chat .cic-nuvola p:last-child{margin-bottom:0}
#casaitalia-chat .cic-nuvola ul{margin:4px 0 8px;padding-left:22px;list-style:disc}
#casaitalia-chat .cic-nuvola ul:last-child{margin-bottom:0}
#casaitalia-chat .cic-nuvola li{margin:3px 0}
#casaitalia-chat .cic-nuvola b{font-weight:700}
#casaitalia-chat .cic-nuvola a{
  color:var(--cic-link);text-decoration:underline;font-weight:600;word-break:break-all;
}
#casaitalia-chat .cic-nuvola a:hover{color:#0B4467}

#casaitalia-chat .cic-errore{
  align-self:stretch;max-width:100%;color:var(--cic-errore);font-size:14.5px;font-weight:600;
  padding:6px 10px;border-left:3px solid var(--cic-errore);line-height:1.4;
}

/* pollice su / giù sotto la risposta del bot */
#casaitalia-chat .cic-voto{display:flex;gap:2px;margin:2px 0 0 6px}
#casaitalia-chat .cic-pollice{
  width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  color:var(--cic-muto);opacity:.7;border:1px solid transparent;
}
#casaitalia-chat .cic-pollice svg{width:18px;height:18px}
#casaitalia-chat .cic-giu svg{transform:rotate(180deg)}
#casaitalia-chat .cic-pollice:hover{background:#FFFFFF;opacity:1;border-color:var(--cic-linea)}
#casaitalia-chat .cic-pollice.cic-scelto{
  color:#FFFFFF;background:var(--cic-fuoco);opacity:1;border-color:var(--cic-fuoco);
}

/* domande frequenti sotto il benvenuto */
#casaitalia-chat .cic-chips{display:flex;flex-wrap:wrap;gap:8px;align-self:flex-start;max-width:100%}
#casaitalia-chat .cic-chip{
  font-size:15px;font-weight:600;padding:9px 14px;border-radius:999px;
  border:1.5px solid var(--cic-colore);color:var(--cic-ink);background:#FFFFFF;
  text-align:left;line-height:1.3;
}
#casaitalia-chat .cic-chip:hover{background:var(--cic-colore);color:var(--cic-ink-colore)}

/* "sta scrivendo" */
#casaitalia-chat .cic-digita .cic-nuvola{display:flex;gap:5px;align-items:center;padding:14px 16px}
#casaitalia-chat .cic-digita span{
  width:8px;height:8px;border-radius:50%;background:var(--cic-muto);
  animation:cic-punto 1.2s infinite ease-in-out;
}
#casaitalia-chat .cic-digita span:nth-child(2){animation-delay:.2s}
#casaitalia-chat .cic-digita span:nth-child(3){animation-delay:.4s}
@keyframes cic-punto{
  0%,80%,100%{opacity:.3;transform:translateY(0)}
  40%{opacity:1;transform:translateY(-3px)}
}

/* "Aggiungo al carrello…": nuvoletta provvisoria mentre il browser lavora sul carrello */
#casaitalia-chat .cic-attesa .cic-nuvola{display:flex;gap:10px;align-items:center;color:var(--cic-muto);font-style:italic}
#casaitalia-chat .cic-punti{display:inline-flex;gap:4px;align-items:center}
#casaitalia-chat .cic-punti span{
  width:7px;height:7px;border-radius:50%;background:var(--cic-muto);
  animation:cic-punto 1.2s infinite ease-in-out;
}
#casaitalia-chat .cic-punti span:nth-child(2){animation-delay:.2s}
#casaitalia-chat .cic-punti span:nth-child(3){animation-delay:.4s}

/* bottoni grandi sotto la risposta: "Vai al carrello", "Vai alla cassa" */
#casaitalia-chat .cic-pulsanti{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 2px}
#casaitalia-chat .cic-pulsante,#casaitalia-chat .cic-pulsante:visited{
  display:inline-block;font-size:15px;font-weight:700;line-height:1.2;padding:12px 18px;border-radius:12px;
  background:var(--cic-colore)!important;color:var(--cic-ink-colore)!important;
  text-decoration:none!important;border:0;box-shadow:0 2px 8px rgba(0,0,0,.14);
}
#casaitalia-chat .cic-pulsante:hover{filter:brightness(.93);text-decoration:none!important}

/* ---- il campo per scrivere ---------------------------------------------- */
/* Le regole del campo hanno !important perche' il tema (Flatsome) ha le sue su
   textarea e all'apertura il segnaposto usciva tagliato. */
#casaitalia-chat .cic-invio{
  display:flex;align-items:flex-end;gap:8px;padding:10px 12px;
  border-top:1px solid var(--cic-linea);background:var(--cic-fondo);flex:0 0 auto;
}
#casaitalia-chat .cic-campo{
  flex:1 1 auto!important;width:100%!important;min-width:0!important;
  min-height:52px!important;height:52px;max-height:120px!important;resize:none!important;
  box-sizing:border-box!important;margin:0!important;
  border:1.5px solid var(--cic-linea)!important;border-radius:12px!important;padding:12px 14px!important;
  font-family:inherit!important;font-size:16px!important;line-height:1.35!important;
  color:var(--cic-ink)!important;background:#FFFFFF!important;overflow-y:auto!important;
  box-shadow:none!important;-webkit-appearance:none;appearance:none;
}
#casaitalia-chat .cic-campo::placeholder{color:#6B7885!important;opacity:1!important;font-size:16px!important}
#casaitalia-chat .cic-campo:focus{
  outline:none!important;border-color:var(--cic-fuoco)!important;box-shadow:0 0 0 3px rgba(30,127,180,.25)!important;
}
#casaitalia-chat .cic-invia{
  flex:0 0 auto;width:46px;height:46px;border-radius:12px;padding:0;
  display:flex;align-items:center;justify-content:center;
  background:var(--cic-colore);color:var(--cic-ink-colore);
}
#casaitalia-chat .cic-invia svg{width:22px;height:22px;margin-left:2px}
#casaitalia-chat .cic-invia:hover:not(:disabled){filter:brightness(.93)}
#casaitalia-chat .cic-invia:disabled{opacity:.5;cursor:default}

/* ---- telefono: a tutto schermo ------------------------------------------ */
@media (max-width:600px){
  #casaitalia-chat .cic-finestra{
    top:0;left:0;right:0;bottom:0;width:100%;max-width:none;
    height:100%;height:100dvh;border-radius:0;
  }
  #casaitalia-chat.cic-lato-sinistra .cic-finestra{left:0}
  #casaitalia-chat .cic-bolla{bottom:16px;right:16px;width:60px;height:60px}
  #casaitalia-chat.cic-lato-sinistra .cic-bolla{left:16px}
}

@media (prefers-reduced-motion:reduce){
  #casaitalia-chat *{animation:none!important;transition:none!important}
}