/* BOTÓN FLOTANTE */
#chatbot-btn{
  position:fixed;
  bottom:20px;
  right:20px;
  background:#072268;
  color:white;
  padding:15px;
  border-radius:50%;
  cursor:pointer;
  box-shadow:0 6px 18px rgba(0,0,0,.25);
  font-size:20px;
  z-index:9999;
  transition:.3s;
}
#chatbot-btn:hover{
  transform:scale(1.08);
}

/* CAJA DEL CHAT */
#chatbot-box{
  position:fixed;
  bottom:80px;
  right:20px;
  width:340px;
  height:460px;
  background:#ffffff;
  border-radius:14px;
  box-shadow:0 12px 35px rgba(0,0,0,.25);
  display:none;
  flex-direction:column;
  overflow:hidden;
  z-index:9999;
  font-family: Arial, Helvetica, sans-serif;
}

/* HEADER */
#chatbot-header{
  background:#072268;
  color:#ffffff;
  padding:15px;
  font-weight:bold;
  font-size:15px;
  letter-spacing:.3px;
}

/* ÁREA MENSAJES */
#chatbot-messages{
  flex:1;
  padding:14px;
  overflow-y:auto;
  font-size:14px;
  background:#f4f6ff;
  color:#000; /* TEXTO NEGRO GENERAL */
}

/* MENSAJE BOT */
.bot-msg{
  background:#2f4fbf;
  color:#000; /* TEXTO NEGRO LEGIBLE */
  padding:10px 14px;
  border-radius:12px;
  margin:8px 0;
  max-width:82%;
  line-height:1.5;
  box-shadow:0 2px 4px rgba(0,0,0,.05);
}

/* MENSAJE USUARIO */
.user-msg{
  background:#072268;
  color:#ffffff;
  padding:10px 14px;
  border-radius:12px;
  margin:8px 0;
  margin-left:auto;
  max-width:82%;
  line-height:1.5;
  box-shadow:0 2px 6px rgba(0,0,0,.15);
}

/* INPUT ZONA */
#chatbot-input{
  display:flex;
  border-top:1px solid #e2e6ff;
  background:#ffffff;
}

#chatbot-input input{
  flex:1;
  padding:13px;
  border:none;
  outline:none;
  color:#000; /* TEXTO NEGRO */
  background:#ffffff;
  font-size:14px;
}

#chatbot-input input::placeholder{
  color:#666;
}

#chatbot-input button{
  background:#072268;
  color:#ffffff;
  border:none;
  padding:0 18px;
  cursor:pointer;
  font-weight:bold;
  transition:.2s;
}

#chatbot-input button:hover{
  background:#051a4f;
}

/* SCROLL BONITO */
#chatbot-messages::-webkit-scrollbar{
  width:6px;
}
#chatbot-messages::-webkit-scrollbar-thumb{
  background:#b7c4ff;
  border-radius:10px;
}
/* FORZAR TEXTO NEGRO AL ESCRIBIR */
#chatbot-input input,
#chatbot-input input:focus,
#chatbot-input input:active{
  color:#000 !important;
  -webkit-text-fill-color:#000 !important;
  background:#fff !important;
  caret-color:#072268; /* color del cursor */
}