/* ============================================================================
   ASSISTENTE - riquadro «Hai una domanda?» (30/09/2026)

   Una conversazione a messaggi: a destra quello che scrive la persona, a
   sinistra l'assistente. Un solo foglio per tutti i layout (sito pubblico,
   area riservata, area candidato): per questo non eredita niente da nessuno.
   Ogni regola sta sotto .ias e i colori sono quelli del marchio, scritti qui.

   Dove sta: in basso a destra. Sul telefono sale sopra le barre fisse che gia'
   occupano il fondo (la barra «Iscriviti» del sito pubblico, l'«Avanti» dei
   moduli) e il pannello diventa un foglio a tutta larghezza.
   ========================================================================== */

.ias{
  --ias-navy:#2B3A8C;
  --ias-navy-2:#232C5E;
  --ias-azzurro:#2C8FCF;
  --ias-link:#1F6FA3;
  --ias-ink:#16202E;
  --ias-ink-2:#47566B;
  --ias-linea:#E3E7ED;
  --ias-fondo:#F1F4F9;
  --ias-ok:#1E7A46;
  font-family:'Public Sans','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  font-size:15px;
  line-height:1.5;
  color:var(--ias-ink);
  -webkit-font-smoothing:antialiased;
}
.ias *,.ias *::before,.ias *::after{box-sizing:border-box}
.ias button{font:inherit;color:inherit;cursor:pointer;margin:0}
/* I layout hanno regole loro su titoli, paragrafi e campi: qui valgono le nostre. */
.ias h2,.ias h3,.ias p,.ias li,.ias input,.ias a{font-family:inherit}
.ias p{margin:0}

/* ---------- Il pulsante ---------- */
.ias-apri{
  position:fixed; right:22px; bottom:22px; z-index:9990;
  display:inline-flex; align-items:center; gap:10px;
  height:50px; padding:0 20px 0 16px;
  border:0; border-radius:25px;
  background:var(--ias-navy); color:#fff !important;
  font-weight:600; font-size:15px; letter-spacing:.01em;
  box-shadow:0 10px 26px -8px rgba(35,44,94,.55), 0 2px 6px rgba(22,32,46,.18);
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.ias-apri:hover{background:var(--ias-navy-2); transform:translateY(-1px)}
.ias-apri:focus-visible{outline:3px solid #9CC9EA; outline-offset:2px}
.ias-apri svg{width:22px; height:22px; flex:none}
.ias.is-aperto .ias-apri{display:none}

/* ---------- Il pannello ---------- */
.ias-pannello{
  position:fixed; right:22px; bottom:22px; z-index:9991;
  width:410px; max-width:calc(100vw - 28px);
  height:640px; max-height:calc(100vh - 44px);
  display:none; flex-direction:column;
  background:#fff; border-radius:18px; overflow:hidden;
  box-shadow:0 30px 70px -20px rgba(22,32,46,.45), 0 0 0 1px rgba(22,32,46,.08);
}
.ias.is-aperto .ias-pannello{display:flex; animation:ias-su .18s ease-out}
@keyframes ias-su{from{opacity:0; transform:translateY(10px)} to{opacity:1; transform:none}}

.ias-testa{
  flex:none; padding:13px 12px 13px 14px;
  background:var(--ias-navy); color:#fff;
  display:flex; align-items:center; gap:10px;
}
.ias-avatar{
  flex:none; width:38px; height:38px; border-radius:50%;
  background:rgba(255,255,255,.14); color:#fff;
  display:inline-flex; align-items:center; justify-content:center;
}
.ias-avatar svg{width:22px; height:22px}
.ias-testa-testo{flex:1; min-width:0}
.ias-titolo{margin:0; font-size:16px; font-weight:700; line-height:1.25; color:#fff; letter-spacing:0}
.ias-sotto{margin:1px 0 0; font-size:12.5px; color:#C9D3F0; line-height:1.3; display:flex; align-items:center; gap:6px}
.ias-sotto::before{content:''; width:7px; height:7px; border-radius:50%; background:#5EE0A0; flex:none}
.ias-tasto{
  flex:none; width:34px; height:34px; border:0; border-radius:10px;
  background:rgba(255,255,255,.12); color:#fff !important;
  display:inline-flex; align-items:center; justify-content:center;
}
.ias-tasto:hover{background:rgba(255,255,255,.24)}
.ias-tasto svg{width:16px; height:16px}

/* ---------- La conversazione ---------- */
.ias-filo{
  flex:1; position:relative; overflow-y:auto; overscroll-behavior:contain;
  padding:16px 14px 8px; background:var(--ias-fondo);
  display:flex; flex-direction:column; gap:10px;
}
.ias-msg{display:flex; flex-direction:column; max-width:100%}
.ias-msg--io{align-items:flex-end}
.ias-msg--bot{align-items:flex-start}
.ias-bolla{
  max-width:88%; margin:0; padding:10px 14px;
  border-radius:16px; font-size:14.5px; line-height:1.5; word-wrap:break-word; overflow-wrap:anywhere;
}
.ias-msg--io .ias-bolla{background:var(--ias-navy); color:#fff; border-bottom-right-radius:5px}
.ias-msg--bot .ias-bolla{background:#fff; color:var(--ias-ink); border:1px solid var(--ias-linea); border-bottom-left-radius:5px}

/* La risposta: una bolla come le altre, solo piu' larga perche' ha passi e
   pulsante. Niente titolo: si risponde e basta. */
.ias-risposta{max-width:94%; padding:12px 15px 11px}
/* La risposta breve: una bolla come quelle di testo, larga quanto serve. */
.ias-risposta--breve{max-width:88%; padding:10px 14px}
.ias-risposta--breve .ias-testo p:last-child{margin-bottom:0}
.ias-risposta--breve .ias-nota{margin-top:8px}
/* Appena arrivata compare un pezzo dopo l'altro, come se venisse scritta. */
.ias-entra{opacity:0; animation:ias-entra .32s ease-out forwards}
@keyframes ias-entra{from{opacity:0; transform:translateY(4px)} to{opacity:1; transform:none}}
.ias-per-chi{
  display:inline-block; margin:0 0 8px; padding:3px 9px; border-radius:20px;
  background:#FFF4DA; color:#7A5200; font-size:12px; font-weight:600;
}
.ias-testo{font-size:14.5px; line-height:1.6; color:var(--ias-ink)}
.ias-testo p,.ias-testo li{color:var(--ias-ink); font-size:14.5px; line-height:1.6}
.ias-testo p{margin:0 0 10px}
.ias-testo ol,.ias-testo ul{margin:0 0 10px; padding-left:20px}
.ias-testo li{margin:0 0 6px}
.ias-testo strong{font-weight:700; color:var(--ias-ink)}
.ias-testo a{color:var(--ias-link); text-decoration:underline; text-underline-offset:2px}
.ias-testo > :last-child{margin-bottom:0}
/* Sotto una risposta con i dati della persona: sono suoi, li vede solo lei. */
.ias-nota{
  display:flex; align-items:center; gap:7px; margin:10px 0 2px; font-size:12.5px; line-height:1.4; color:var(--ias-ink-2);
}
.ias-nota svg{width:14px; height:14px; flex:0 0 14px}
/* Al posto di una risposta personale che il browser non ha conservato. */
.ias-bolla--tolta{font-style:italic; color:var(--ias-ink-2)}

.ias-vai{
  display:inline-flex; align-items:center; gap:8px; margin-top:12px; padding:10px 15px;
  border-radius:11px; background:var(--ias-navy); color:#fff !important; font-size:14.5px; font-weight:600; text-decoration:none !important;
}
.ias-vai:hover{background:var(--ias-navy-2)}
.ias-vai svg{width:14px; height:14px}
.ias-vai--solo{margin-top:0}

.ias-voto{
  display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:13px 0 0; padding:10px 0 0;
  border-top:1px solid var(--ias-linea); font-size:13px; color:var(--ias-ink-2);
}
.ias-voto span{flex:1; min-width:100px}
.ias-voto button{
  padding:5px 14px; border:1.5px solid #CBD3DF; border-radius:9px; background:#fff; font-size:13px; font-weight:600; color:var(--ias-ink);
}
.ias-voto button:hover{border-color:var(--ias-azzurro); color:var(--ias-link)}
.ias-voto.is-detto{color:var(--ias-ok); font-weight:600}

/* Le domande fra cui scegliere */
.ias-scelte{display:flex; flex-direction:column; align-items:flex-start; gap:6px; width:100%}
.ias-scelte-titolo{margin:2px 2px 0; font-size:11.5px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--ias-ink-2)}
.ias-scelta{
  max-width:100%; text-align:left; padding:9px 14px;
  border:1.5px solid #BFD9EC; border-radius:16px; background:#fff;
  font-size:14px; font-weight:600; line-height:1.35; color:var(--ias-link) !important;
  transition:background .12s ease, border-color .12s ease;
}
.ias-scelta:hover,.ias-scelta:focus-visible{background:#E8F3FB; border-color:var(--ias-azzurro); outline:none}
.ias-scelta--no{border-style:dashed; border-color:#C3CCD8; color:var(--ias-ink-2) !important; font-weight:500}

/* «Sta scrivendo» */
.ias-puntini{display:inline-flex; gap:4px; padding:13px 14px}
.ias-puntini i{width:7px; height:7px; border-radius:50%; background:#9AA8BA; animation:ias-punto 1s infinite ease-in-out}
.ias-puntini i:nth-child(2){animation-delay:.15s}
.ias-puntini i:nth-child(3){animation-delay:.3s}
@keyframes ias-punto{0%,80%,100%{opacity:.35; transform:translateY(0)} 40%{opacity:1; transform:translateY(-3px)}}

/* ---------- Il campo per scrivere ---------- */
.ias-scrivi{flex:none; display:flex; gap:8px; margin:0; padding:10px 12px; border-top:1px solid var(--ias-linea); background:#fff}
.ias-campo{
  flex:1; min-width:0; height:46px; padding:0 15px;
  border:1.5px solid #CBD3DF; border-radius:23px; background:#fff;
  font:inherit; font-size:16px; color:var(--ias-ink); /* 16px: sotto, iPhone ingrandisce la pagina */
  outline:none; box-shadow:none;
}
.ias-campo::placeholder{color:#8896A8}
.ias-campo:focus{border-color:var(--ias-azzurro); box-shadow:0 0 0 3px rgba(44,143,207,.18)}
.ias-invia{
  flex:none; width:46px; height:46px; border:0; border-radius:50%;
  background:var(--ias-azzurro); color:#fff !important;
  display:inline-flex; align-items:center; justify-content:center;
}
.ias-invia:hover{background:var(--ias-link)}
.ias-invia svg{width:19px; height:19px}

.ias-avviso{
  flex:none; margin:0; padding:2px 16px 0; background:#fff; font-size:11.5px; line-height:1.4; color:var(--ias-ink-2);
}
.ias-avviso a{color:var(--ias-link); font-weight:600; text-decoration:none}
.ias-avviso a:hover{text-decoration:underline}

.ias-piede{
  flex:none; display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:7px 16px 9px; background:#fff; font-size:12px; color:var(--ias-ink-2);
}
.ias-piede a{color:var(--ias-link); font-weight:600; text-decoration:none}
.ias-piede a:hover{text-decoration:underline}

@media (prefers-reduced-motion:reduce){
  .ias.is-aperto .ias-pannello,.ias-puntini i{animation:none}
  .ias-entra{opacity:1; animation:none}
  .ias-apri{transition:none}
}

/* Il «torna su» del gestionale sta nello stesso angolo: sale sopra il pulsante. */
body.ias-presente > button[aria-label="Torna su"]{bottom:84px !important; right:25px !important}

/* ---------- Telefono ---------- */
@media (max-width:768px){
  .ias-apri{
    right:14px; bottom:calc(82px + env(safe-area-inset-bottom, 0px));
    width:52px; height:52px; padding:0; justify-content:center; border-radius:50%;
  }
  .ias-apri .ias-apri-testo{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
  .ias-apri svg{width:24px; height:24px}
  .ias-pannello{
    right:0; left:0; bottom:0; width:auto; max-width:none;
    height:90vh; height:90dvh; max-height:none;
    border-radius:18px 18px 0 0;
  }
  .ias-piede{padding-bottom:calc(9px + env(safe-area-inset-bottom, 0px))}
  body.ias-presente > button[aria-label="Torna su"]{bottom:calc(144px + env(safe-area-inset-bottom, 0px)) !important; right:18px !important}
}

/* Stampa: il riquadro non c'entra con quello che si stampa. */
@media print{.ias{display:none !important}}
