/* CiVallo AI Chat Widget */
:root{
  --cw-dark:#0F0A1A;
  --cw-card:#1A1128;
  --cw-input:#231838;
  --cw-border:#3D2A5C;
  --cw-gold:#C9A35B;
  --cw-goldl:#E2C078;
  --cw-purple:#5F3286;
  --cw-magenta:#AB2A8D;
  --cw-text:#E8E4DC;
  --cw-muted:#9A9490;
  --cw-red:#E05555;
  --cw-grad:linear-gradient(135deg,var(--cw-purple),var(--cw-magenta));
  --cw-grad-gold:linear-gradient(135deg,var(--cw-goldl),var(--cw-gold));
}

#civallo-chat-launcher{
  position:fixed;
  right:24px;
  bottom:24px;
  width:60px;
  height:60px;
  border-radius:50%;
  border:none;
  background:var(--cw-grad);
  color:#fff;
  font-family:"Exo 2","DM Sans",sans-serif;
  font-size:26px;
  font-weight:800;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 10px 30px rgba(95,50,134,.45);
  z-index:9999;
  transition:transform .2s ease,box-shadow .2s ease;
  animation:cw-pulse 2.6s ease-in-out infinite;
}
#civallo-chat-launcher:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 36px rgba(171,42,141,.5);
}
#civallo-chat-launcher[data-open="true"]{display:none;}

@keyframes cw-pulse{
  0%,100%{box-shadow:0 10px 30px rgba(95,50,134,.45),0 0 0 0 rgba(171,42,141,.35);}
  50%{box-shadow:0 10px 30px rgba(95,50,134,.45),0 0 0 10px rgba(171,42,141,0);}
}

#civallo-chat-panel{
  position:fixed;
  right:24px;
  bottom:24px;
  width:380px;
  max-width:calc(100vw - 32px);
  height:560px;
  max-height:calc(100vh - 48px);
  background:var(--cw-card);
  border:1px solid var(--cw-border);
  border-radius:20px;
  box-shadow:0 24px 60px rgba(0,0,0,.5);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  font-family:"DM Sans",sans-serif;
  z-index:9999;
}
#civallo-chat-panel[hidden]{display:none;}

.cw-header{
  display:flex;
  align-items:center;
  gap:12px;
  padding:18px 20px;
  background:linear-gradient(180deg,rgba(95,50,134,.18),transparent);
  border-bottom:1px solid var(--cw-border);
}
.cw-icon{
  flex-shrink:0;
  width:38px;
  height:38px;
  border-radius:50%;
  background:var(--cw-grad-gold);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:"Exo 2",sans-serif;
  font-size:17px;
  font-weight:900;
  color:var(--cw-dark);
}
.cw-header-text{flex:1;}
.cw-header h2{
  font-family:"Exo 2",sans-serif;
  font-size:14px;
  font-weight:800;
  letter-spacing:.04em;
  color:var(--cw-text);
  margin:0;
}
.cw-header span{
  display:block;
  font-family:"DM Mono",monospace;
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--cw-gold);
  margin-top:3px;
}
.cw-close{
  background:transparent;
  border:1px solid var(--cw-border);
  color:var(--cw-muted);
  border-radius:8px;
  width:30px;
  height:30px;
  font-size:14px;
  line-height:1;
  cursor:pointer;
  flex-shrink:0;
  transition:color .2s ease,border-color .2s ease;
}
.cw-close:hover{color:var(--cw-gold);border-color:var(--cw-gold);}

.cw-messages{
  flex:1;
  overflow-y:auto;
  padding:20px;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.cw-msg{
  max-width:85%;
  padding:12px 16px;
  border-radius:16px;
  font-size:13px;
  line-height:1.65;
  white-space:pre-wrap;
  word-wrap:break-word;
}
.cw-msg.user{
  align-self:flex-end;
  background:var(--cw-grad);
  color:#fff;
  border-bottom-right-radius:4px;
}
.cw-msg.assistant{
  align-self:flex-start;
  background:var(--cw-input);
  color:var(--cw-text);
  border:1px solid var(--cw-border);
  border-bottom-left-radius:4px;
}
.cw-msg.error{
  align-self:flex-start;
  background:rgba(224,85,85,.1);
  color:var(--cw-red);
  border:1px solid rgba(224,85,85,.3);
}

.cw-typing{
  align-self:flex-start;
  display:flex;
  align-items:center;
  gap:5px;
  padding:14px 18px;
  border-radius:16px;
  border-bottom-left-radius:4px;
  background:var(--cw-input);
  border:1px solid var(--cw-border);
}
.cw-typing span{
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--cw-gold);
  opacity:.4;
  animation:cw-typing-bounce 1.2s infinite ease-in-out;
}
.cw-typing span:nth-child(2){animation-delay:.15s;}
.cw-typing span:nth-child(3){animation-delay:.3s;}
@keyframes cw-typing-bounce{
  0%,60%,100%{opacity:.35;transform:translateY(0);}
  30%{opacity:1;transform:translateY(-3px);}
}

.cw-form{
  display:flex;
  gap:10px;
  padding:16px;
  border-top:1px solid var(--cw-border);
  background:var(--cw-card);
}
.cw-input{
  flex:1;
  resize:none;
  background:var(--cw-input);
  border:1px solid var(--cw-border);
  border-radius:12px;
  color:var(--cw-text);
  font-family:"DM Sans",sans-serif;
  font-size:13px;
  padding:11px 14px;
  line-height:1.5;
  max-height:90px;
}
.cw-input:focus{outline:none;border-color:var(--cw-gold);}
.cw-input::placeholder{color:var(--cw-muted);}
.cw-send{
  padding:0 18px;
  background:var(--cw-grad);
  border:none;
  border-radius:12px;
  color:#fff;
  font-family:"Exo 2",sans-serif;
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  cursor:pointer;
  transition:opacity .2s ease;
}
.cw-send:hover{opacity:.9;}
.cw-send:disabled{opacity:.5;cursor:not-allowed;}

.cw-cta-group{
  display:flex;
  flex-direction:column;
  gap:10px;
  align-self:stretch;
  width:100%;
}
.cw-cta{
  display:block;
  text-align:center;
  padding:12px 18px;
  border-radius:12px;
  font-family:"Exo 2",sans-serif;
  font-size:12px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  text-decoration:none;
  cursor:pointer;
  transition:opacity .2s ease,border-color .2s ease,color .2s ease,transform .2s ease;
}
.cw-cta:not(.cw-cta-secondary){
  background:var(--cw-grad);
  color:#fff;
  border:none;
  box-shadow:0 8px 24px rgba(171,42,141,.3);
}
.cw-cta:not(.cw-cta-secondary):hover{opacity:.9;transform:translateY(-1px);}
.cw-cta-secondary{
  background:transparent;
  color:var(--cw-gold);
  border:1px solid var(--cw-gold);
}
.cw-cta-secondary:hover{background:rgba(201,163,91,.08);}

@media (max-width:480px){
  #civallo-chat-panel{
    right:16px;
    left:16px;
    bottom:16px;
    width:auto;
  }
}