@import url("https://fonts.googleapis.com/css2?family=Big+Shoulders+Display:wght@600;700&display=swap");

/* Base */
.ca-widget,
.ca-widget * { box-sizing: border-box; }

/* =========================
   TOGGLE BUTTON (doodle #fec414 via mask)
========================= */
#cactus-assistant-btn.ca-btn{
  width:56px;
  height:56px;
  border-radius:999px;
  border:none;
  cursor:pointer;

  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 999999;

  background-color:#fec414;
  -webkit-mask-image:url("http://wearesalento.it/wp-content/uploads/2025/12/ico-copia.png");
  mask-image:url("http://wearesalento.it/wp-content/uploads/2025/12/ico-copia.png");
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-size:72%;
  mask-size:72%;

  color: transparent;
  font-size: 0;
  line-height: 0;

  box-shadow:0 8px 22px rgba(0,0,0,.12);
  transition: transform .18s ease, box-shadow .18s ease;
}
#cactus-assistant-btn.ca-btn:hover{
  transform: translateY(-1px) scale(1.03);
  box-shadow:0 10px 26px rgba(0,0,0,.14);
}
#cactus-assistant-btn.ca-btn:active{ transform: translateY(0) scale(0.99); }

/* Chat aperta: nascondo toggle (evita icona extra) */
.ca-widget.ca-open #cactus-assistant-btn.ca-btn{
  opacity: 0;
  pointer-events: none;
}

/* =========================
   PANEL (finestra)
========================= */
#cactus-assistant-panel.ca-panel{
  position: fixed;
  right: 18px;
  bottom: 88px;
  z-index: 999998;

  width: 380px;
  height: 580px;

  border-radius: 18px;
  overflow: hidden;

  background: #ffffff;
  box-shadow: 0 14px 40px rgba(0,0,0,.20);

  display: none;
}
#cactus-assistant-panel.ca-panel[aria-hidden="false"]{
  display: block;
}

/* =========================
   TOPBAR
========================= */
.ca-topbar{
  height: 46px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 0 12px;

  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(0,0,0,.08);
}

.ca-title{
  font-family: "Big Shoulders Display", inherit;
  font-weight: 700;
  font-size: 22px;
  letter-spacing: .6px;
  line-height: 1;
  color: #0075c6;
}

.ca-close{
  width: 34px;
  height: 34px;
  border-radius: 12px;
  border: none;
  cursor: pointer;
  background: #fec414;
  transition: transform .18s ease;
}
.ca-close:hover{ transform: scale(1.03); }

/* =========================
   BODY
========================= */
.ca-body{
  height: calc(100% - 46px);
  display:flex;
  flex-direction:column;
  min-height:0;
}

/* ✅ QUI: riduco il riquadro 3D */
.ca-canvas{
  height: 240px;          /* prima era ~300+ */
  width: 100%;
  flex: 0 0 auto;
  background: #f4f4f4;
}

/* chat area */
.ca-chat{
  flex: 1 1 auto;
  min-height: 0;
  display:flex;
  flex-direction:column;
  background: #fff;
  border-top: 1px solid rgba(0,0,0,.08);
}

.ca-messages{
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: 14px 16px 10px;
  display:flex;
  flex-direction:column;
  gap: 12px;

  /* ✅ NON tocchiamo font: eredita dal tema */
  color: #000;
  font-size: inherit;
  line-height: inherit;
}

.ca-bubble{
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  max-width: 100% !important;
  white-space: pre-wrap;
}

/* CTA */
.ca-choices{
  display:flex;
  flex-direction:column;
  gap: 4px;
  margin-top: 6px;
}

.ca-choice{
  width: 100%;
  border: none;
  border-radius: 999px;
  padding: 12px 14px;
  background: #0075c6;
  color: #fff;
  cursor: pointer;

  /* ✅ font ereditato */
  font: inherit;
  font-weight: 700;
  line-height: 1.15;

  box-shadow: 0 12px 26px rgba(0,0,0,.10);
  transition: transform .15s ease, box-shadow .15s ease;
}
.ca-choice:hover{
  transform: translateY(-1px);
  box-shadow: 0 16px 34px rgba(0,0,0,.12);
}

/* form */
.ca-form{
  display:flex;
  gap: 10px;
  padding: 12px;
  border-top: 1px solid rgba(0,0,0,.08);
  background: #fff;
}
.ca-input{
  flex:1;
  border: 1px solid rgba(0,0,0,.14);
  border-radius: 14px;
  padding: 12px 14px;
  outline: none;
  font: inherit;
}
.ca-input:focus{
  border-color: rgba(0,117,198,.45);
  box-shadow: 0 0 0 3px rgba(0,117,198,.18);
}
.ca-send{
  border:none;
  border-radius: 14px;
  padding: 12px 14px;
  background: #111;
  color:#fff;
  cursor:pointer;
  font: inherit;
  font-weight: 700;
  transition: transform .18s ease, box-shadow .18s ease;
}
.ca-send:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 26px rgba(0,0,0,.14);
}
.ca-send:active{ transform: translateY(0); }

/* Mobile */
@media (max-width: 420px){
  #cactus-assistant-panel.ca-panel{
    width: min(92vw, 380px);
    height: 72vh;
    right: 12px;
    bottom: 84px;
  }
  .ca-canvas{ height: 230px; }
}

/* Riduce spazio tra ultimo bottone e primo messaggio testuale */
#ca-messages .ca-choices {
  margin-bottom: 4px;
}

#ca-messages .ca-bot:first-of-type {
  margin-top: 0;
}