/* ===== KUZAI NEON THEME (LAYOUT FIX) ===== */

#kuzaiChatBtn{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:99999;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(0,204,255,.45);
  background:rgba(0,10,20,.78);
  color:#d8f4ff;
  font-weight:800;
  cursor:pointer;
  backdrop-filter:blur(10px);
  box-shadow:0 0 18px rgba(0,204,255,.18);
}

#kuzaiChatBox{
  position:fixed;
  right:18px;
  bottom:70px;
  width:450px;
  max-width:92vw;
  height:750px;            /* ajustez ici si besoin */
  max-height:80vh;         /* important mobile */
  z-index:99999;

  border-radius:18px;
  border:1px solid rgba(0,204,255,.38);
  background:rgba(0,8,18,.88);
  backdrop-filter:blur(12px);
  box-shadow:0 0 28px rgba(0,204,255,.14);

  display:none;
  overflow:hidden;

  /* FIX LAYOUT */
  display:flex;
  flex-direction:column;
}

#kuzaiChatHdr{
  padding:12px 12px;
  border-bottom:1px solid rgba(0,204,255,.18);
  color:#e9fbff;
  font-weight:900;
  letter-spacing:.5px;

  display:flex;
  justify-content:space-between; 
  align-items:center;

  background:linear-gradient(180deg, rgba(0,204,255,.10), rgba(0,0,0,0));
}

#kuzaiChatClose{
  border:1px solid rgba(0,204,255,.25);
  background:rgba(0,0,0,.25);
  color:#cfefff;
  border-radius:10px;
  padding:2px 10px;
  cursor:pointer;
  font-weight:900;
}

#kuzaiChatLog{
  padding:12px 12px;

  /* FIX: le log prend l'espace restant */
  flex:1;
  min-height:0;
  overflow:auto;

  color:#d8f4ff;
  font-size:13px;
  line-height:1.45;

  background:
    radial-gradient(800px 300px at 20% 0%, rgba(0,204,255,.06), transparent 55%),
    radial-gradient(600px 240px at 80% 20%, rgba(0,120,255,.06), transparent 60%);
}

#kuzaiChatForm{
  display:flex;
  gap:10px;
  padding:12px 12px;
  border-top:1px solid rgba(0,204,255,.18);

  /* FIX: reste collé en bas */
  margin-top:auto;

  background:rgba(0,0,0,.18);
}

#kuzaiChatInput{
  flex:1;
  border-radius:12px;
  border:1px solid rgba(0,204,255,.22);
  background:rgba(0,0,0,.35);
  color:#e9fbff;
  padding:10px 12px;
  outline:none;
}

#kuzaiChatInput:focus{
  border-color:rgba(0,204,255,.55);
  box-shadow:0 0 0 3px rgba(0,204,255,.12);
}

#kuzaiChatSend{
  border-radius:12px;
  border:1px solid rgba(0,204,255,.38);
  background:rgba(0,204,255,.10);
  color:#e9fbff;
  font-weight:900;
  padding:10px 14px;
  cursor:pointer;
}

#kuzaiChatSend:hover{
  background:rgba(0,204,255,.16);
  box-shadow:0 0 16px rgba(0,204,255,.18);
}

.kmsg{margin:0 0 10px; white-space:pre-wrap}
.kme{color:#ffffff}
.kai{color:#00ccff}

/* Mobile */
@media (max-width:480px){
  #kuzaiChatBox{
    right:12px;
    left:12px;
    width:auto;
    height:72vh;
    bottom:64px;
  }
  #kuzaiChatBtn{
    right:12px;
    bottom:12px;
  }
}

/* ===== EXPAND MODE ===== */

#kuzaiChatExpand{
  border:1px solid rgba(0,204,255,.25);
  background:rgba(0,0,0,.25);
  color:#cfefff;
  border-radius:10px;
  padding:2px 8px;
  cursor:pointer;
  font-weight:900;
}

#kuzaiChatExpand:hover{
  background:rgba(0,204,255,.12);
}

/* Mode agrandi */
#kuzaiChatBox.kuzai-expanded{
  width:80vw !important;
  height:80vh !important;
  max-width:80vw !important;
  max-height:80vh !important;

  right:10vw !important;
  left:auto !important;
  bottom:10vh !important;
}

/* Mobile */
@media (max-width:768px){
  #kuzaiChatBox.kuzai-expanded{
    width:96vw !important;
    height:90vh !important;
    right:2vw !important;
    bottom:5vh !important;
  }
}

/* ===== HEADER BUTTONS SIZE CONTROL ===== */

#kuzaiChatHdr button{
  transition: background .2s ease, transform .15s ease;
  width: 35px;              /* taille du bouton */
  height: 35px;
  line-height: 26px;        /* centre le symbole verticalement */
  font-size: 18px;          /* taille de l’icône */
  padding: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 8px;
  cursor: pointer;
}

#kuzaiChatHdr button:hover{
  transform: scale(1.08);
}

/* Bouton expand */
#kuzaiChatExpand{
  font-size: 18px;          /* icône ⤢ / ⤡ légèrement plus petite */
}

/* Bouton close */
#kuzaiChatClose{
  font-size: 18px;          /* × plus visible */
  font-weight: 900;
}

/* ===== HEADER BUTTONS ALIGNMENT ===== */

#kuzaiChatHdr{
  display: flex;
  align-items: center;
}

/* Conteneur des boutons (expand + close) */
#kuzaiChatHdr > div{
  margin-left: auto;      /* pousse les boutons complètement à droite */
  display: flex;
  align-items: center;
  gap: 6px;
}
