/* ===== EMOVTT Chatbot (flotante, responsive) ===== */
.emovtt-chatbot-container{
  position: fixed;
  right: calc(var(--emv-right, 20px) + env(safe-area-inset-right, 0px));
  bottom: calc(var(--emv-bottom, 20px) + env(safe-area-inset-bottom, 0px));
  inset-inline-start: auto;
  inset-block-start: auto;
  z-index: var(--emv-z, 9999);
  font-family: Arial, sans-serif;
}
/* Toggle */
.emovtt-chatbot-container .chatbot-toggle{
  width: clamp(52px, 7.5vw, 64px);
  height: clamp(52px, 7.5vw, 64px);
  background: var(--emv-primary, #2196F3);
  border-radius: 50%;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; border:0;
  box-shadow: 0 4px 12px rgba(0,0,0,.3);
  transition: transform .3s ease;
}
.emovtt-chatbot-container .chatbot-toggle.pulse{ animation: emv-pulse 2s infinite; }
.emovtt-chatbot-container .chatbot-toggle:hover{ transform: scale(1.08); animation: none; }
@keyframes emv-pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}100%{transform:scale(1)}}

/* Window */
.emovtt-chatbot-container .chatbot-window{
  width: clamp(320px, 32vw, 380px);
  height: min(70vh, 640px);
  background:#fff; border-radius:16px;
  box-shadow: 0 8px 25px rgba(0,0,0,.3);
  position:absolute; bottom: calc(70px + env(safe-area-inset-bottom,0px)); right: 0;
  display:flex; flex-direction:column; overflow:hidden;
  animation: emv-slideUp .28s ease-out;
}
@keyframes emv-slideUp{from{opacity:0; transform:translateY(20px)} to{opacity:1; transform:translateY(0)}}

/* Header */
.emovtt-chatbot-container .chatbot-header{
  background: linear-gradient(135deg, var(--emv-primary,#2196F3), #1976D2);
  color:#fff; padding:14px; display:flex; justify-content:space-between; align-items:center;
}
.emovtt-chatbot-container .bot-info{display:flex; gap:10px; align-items:center;}
.emovtt-chatbot-container .bot-avatar{font-size:24px; animation: emv-bounce 1s ease-in-out infinite alternate;}
@keyframes emv-bounce{from{transform:translateY(0)} to{transform:translateY(-3px)}}
.emovtt-chatbot-container .bot-title{font-weight:700; font-size:clamp(13px, 1.5vw, 14px);}
.emovtt-chatbot-container .bot-status{font-size:11px; opacity:.8;}
.emovtt-chatbot-container .close-chat{background:none; border:0; color:#fff; font-size:24px; cursor:pointer; padding:6px; border-radius:50%;}
.emovtt-chatbot-container .close-chat:hover{background:rgba(255,255,255,.2);}

/* Messages */
.emovtt-chatbot-container .chatbot-messages{flex:1; padding:14px; overflow-y:auto; background:#fafafa;}
.emovtt-chatbot-container .bot-message, .emovtt-chatbot-container .user-message{margin-bottom:14px; animation: emv-fadeIn .45s ease-in;}
@keyframes emv-fadeIn{from{opacity:0; transform:translateY(10px)} to{opacity:1; transform:translateY(0)}}
.emovtt-chatbot-container .message-content{
  padding:12px 14px; border-radius:18px;
  font-size: clamp(13px, 1.6vw, 14px);
  line-height:1.45; max-width:92%; word-wrap: break-word;
}
.emovtt-chatbot-container .bot-message .message-content{background:#fff; border:1px solid #e0e0e0; box-shadow:0 1px 3px rgba(0,0,0,.08);}
.emovtt-chatbot-container .user-message{text-align:right;}
.emovtt-chatbot-container .user-message .message-content{background: var(--emv-primary,#2196F3); color:#fff; display:inline-block; margin-left:auto;}

/* Typing */
.emovtt-chatbot-container .typing-indicator{padding:10px 14px; background:#fff; border-radius:18px; margin-bottom:12px; border:1px solid #e0e0e0;}
.emovtt-chatbot-container .typing-dots{display:flex; gap:4px;}
.emovtt-chatbot-container .typing-dots span{width:8px; height:8px; background:#999; border-radius:50%; animation: emv-typing 1.4s infinite ease-in-out; display:inline-block;}
.emovtt-chatbot-container .typing-dots span:nth-child(1){animation-delay:-.32s;}
.emovtt-chatbot-container .typing-dots span:nth-child(2){animation-delay:-.16s;}
@keyframes emv-typing{0%,80%,100%{transform:scale(.8); opacity:.5} 40%{transform:scale(1); opacity:1}}

/* Quick options */
.emovtt-chatbot-container .quick-options{display:flex; flex-direction:column; gap:8px; margin-top:8px;}
.emovtt-chatbot-container .option-btn{
  background:#fff; border:2px solid var(--emv-primary,#2196F3); color:var(--emv-primary,#2196F3);
  padding:11px 13px; border-radius:22px; cursor:pointer; font-size:13px; text-align:left; display:flex; align-items:center; gap:8px;
  transition:all .25s ease; min-height:40px;
}
.emovtt-chatbot-container .option-btn:hover{ background:var(--emv-primary,#2196F3); color:#fff; transform:translateY(-1px); box-shadow:0 4px 12px rgba(33,150,243,.28);}

/* Input */
.emovtt-chatbot-container .chatbot-input{ padding:12px; border-top:1px solid #eee; background:#fff; display:flex; gap:10px; }
.emovtt-chatbot-container .user-input{ flex:1; padding:12px 14px; border:1px solid #ddd; border-radius:22px; outline:none; font-size:14px; }
.emovtt-chatbot-container .user-input:focus{ border-color: var(--emv-primary,#2196F3); }
.emovtt-chatbot-container .send-btn{ background:var(--emv-primary,#2196F3); color:#fff; border:0; padding:12px 18px; border-radius:22px; cursor:pointer; font-size:14px; }
.emovtt-chatbot-container .send-btn:hover{ filter:brightness(.95); }



/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .emovtt-chatbot-container .chatbot-toggle,
  .emovtt-chatbot-container .bot-avatar,
  .emovtt-chatbot-container .bot-message,
  .emovtt-chatbot-container .user-message{
    animation: none !important;
    transition: none !important;
  }
}


/* Chatbot responsive */
@media (max-width: 576px) {
  .emovtt-chatbot-window {
    width: 92% !important;   /* un poco de margen lateral */
    max-width: 380px;        /* evita que crezca demasiado en landscape */
    right: 4% !important;    /* margen derecho */
    bottom: 80px !important; /* margen inferior */
    border-radius: 14px !important;
  }
}

@media (min-width: 577px) and (max-width: 768px) {
  .emovtt-chatbot-window {
    width: 360px !important;
    right: 20px !important;
    bottom: 80px !important;
  }
}