/* =========================================
   CHATBOT FLOATER
========================================= */

.chatbot-trigger {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 1100;
  width: 60px;
  height: 60px;
  border: 0;
  border-radius: 50%;
  background: linear-gradient(135deg, #e07212, #f28e36);
  color: #100204;
  box-shadow: 0 18px 42px rgba(224,114,18, 0.28);
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: transform 0.22s ease, box-shadow 0.22s ease, filter 0.22s ease;
}

.chatbot-trigger:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 24px 52px rgba(224,114,18, 0.36);
}

.chatbot-trigger svg {
  width: 26px;
  height: 26px;
}

.chatbot-panel {
  position: fixed;
  right: 22px;
  bottom: 92px;
  z-index: 1200;
  width: min(390px, calc(100vw - 24px));
  height: min(620px, calc(100vh - 130px));
  display: none;
  grid-template-rows: auto 1fr auto;
  overflow: hidden;
  border-radius: 24px;
  border: 1px solid rgba(255,255,255,0.12);
  background: linear-gradient(180deg, rgba(16,8,9,0.98), rgba(18,10,11,0.98));
  box-shadow: 0 24px 80px rgba(0,0,0,0.45);
  backdrop-filter: blur(16px);
}

.chatbot-panel.open {
  display: grid;
}

.chatbot-panel__header {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 16px 14px;
  background: radial-gradient(circle at 20% 0%, rgba(224,114,18,0.24), transparent 44%),
              linear-gradient(135deg, rgba(224,114,18,0.14), rgba(255,255,255,0.02));
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.chatbot-panel__avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #e07212, #f28e36);
  color: #100204;
  flex: 0 0 auto;
}

.chatbot-panel__title {
  display: grid;
  gap: 2px;
}

.chatbot-panel__title strong {
  font-size: 0.98rem;
  line-height: 1.1;
}

.chatbot-panel__title span {
  color: #b9b3ae;
  font-size: 0.76rem;
}

.chatbot-panel__actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 8px;
}

.chatbot-panel__icon-btn {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.10);
  background: rgba(255,255,255,0.03);
  color: #fff;
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: background 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
}

.chatbot-panel__icon-btn:hover {
  transform: translateY(-1px);
  border-color: rgba(224,114,18,0.55);
  background: rgba(224,114,18,0.08);
}

.chatbot-panel__messages {
  padding: 16px;
  overflow-y: auto;
  display: grid;
  align-content: start;
  gap: 10px;
}

.chatbot-msg {
  max-width: 88%;
  padding: 12px 14px;
  border-radius: 16px;
  font-size: 0.92rem;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
  border: 1px solid transparent;
}

.chatbot-msg.bot {
  background: rgba(255,255,255,0.04);
  border-color: rgba(255,255,255,0.06);
  color: #faf9f7;
  border-top-left-radius: 6px;
}

.chatbot-msg.user {
  margin-left: auto;
  background: linear-gradient(135deg, #e07212, #f28e36);
  color: #100204;
  border-top-right-radius: 6px;
}

.chatbot-quick {
  padding: 0 16px 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.chatbot-quick button {
  border: 1px solid rgba(224,114,18,0.24);
  background: rgba(255,255,255,0.03);
  color: #f5f2ee;
  border-radius: 999px;
  padding: 8px 11px;
  font-size: 0.78rem;
  cursor: pointer;
  transition: transform 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.chatbot-quick button:hover {
  transform: translateY(-1px);
  border-color: rgba(224,114,18,0.6);
  background: rgba(224,114,18,0.08);
}

.chatbot-panel__form {
  display: flex;
  gap: 10px;
  padding: 14px;
  border-top: 1px solid rgba(255,255,255,0.08);
  background: rgba(0,0,0,0.12);
}

.chatbot-panel__form input {
  flex: 1;
  min-width: 0;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.03);
  color: #fff;
  padding: 0 16px;
  height: 46px;
  outline: none;
}

.chatbot-panel__form input:focus {
  border-color: rgba(224,114,18,0.72);
  box-shadow: 0 0 0 3px rgba(224,114,18,0.08);
}

.chatbot-panel__form button {
  height: 46px;
  border: 0;
  border-radius: 999px;
  padding: 0 18px;
  background: linear-gradient(135deg, #e07212, #f28e36);
  color: #100204;
  font-weight: 800;
  cursor: pointer;
}

.chatbot-panel__footer-link {
  margin: 0 14px 14px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.chatbot-panel__footer-link a {
  text-align: center;
  border-radius: 12px;
  padding: 10px 12px;
  border: 1px solid rgba(224,114,18,0.22);
  background: rgba(255,255,255,0.03);
  color: #faf9f7;
  font-size: 0.82rem;
  transition: transform 0.2s ease, border-color 0.2s ease;
}

.chatbot-panel__footer-link a:hover {
  transform: translateY(-1px);
  border-color: rgba(224,114,18,0.58);
}

@media (max-width: 680px) {
  .chatbot-panel {
    right: 12px;
    left: 12px;
    width: auto;
    bottom: calc(84px + env(safe-area-inset-bottom));
    height: min(72vh, 640px);
  }

  .chatbot-trigger {
    right: 12px;
    bottom: 12px;
  }
}


@media (max-width: 680px) {
  .chatbot-trigger {
    width: 56px;
    height: 56px;
    right: max(12px, env(safe-area-inset-right));
    bottom: max(12px, env(safe-area-inset-bottom));
  }

  .chatbot-panel {
    right: max(12px, env(safe-area-inset-right));
    left: max(12px, env(safe-area-inset-left));
    bottom: calc(84px + env(safe-area-inset-bottom));
    width: auto;
  }
}

/* ===================== CHATBOT INTELIGENTE PREMIUM ===================== */
.chatbot-trigger::after{content:"IA";position:absolute;right:-3px;top:-4px;min-width:20px;height:20px;padding:0 5px;border-radius:99px;display:grid;place-items:center;background:#130608;color:#e07212;border:1px solid rgba(224,114,18,.45);font-size:.56rem;font-weight:900;letter-spacing:.03em;box-shadow:0 5px 16px rgba(0,0,0,.28)}
.chatbot-trigger{transition:transform .22s ease,box-shadow .22s ease,filter .22s ease}
.chatbot-panel{animation:chatPanelIn .22s ease-out}
.chatbot-panel__header{position:relative;overflow:hidden}
.chatbot-panel__header::after{content:"";position:absolute;inset:auto -30% -55px -30%;height:110px;background:radial-gradient(circle,rgba(224,114,18,.16),transparent 62%);pointer-events:none}
.chatbot-panel__avatar{box-shadow:0 0 0 5px rgba(224,114,18,.07),0 10px 26px rgba(224,114,18,.14)}
.chatbot-msg-wrap{display:flex;width:100%}
.chatbot-msg-wrap.user{justify-content:flex-end}
.chatbot-msg{position:relative}
.chatbot-msg__meta{display:block;margin-top:8px;color:rgba(185,179,174,.62);font-size:.66rem;letter-spacing:.02em}
.chatbot-msg a{color:var(--primary);font-weight:800;text-decoration:underline;text-decoration-color:rgba(224,114,18,.35);text-underline-offset:3px}
.chatbot-msg.user .chatbot-msg__meta{color:rgba(16,2,4,.55)}
.chatbot-typing{display:flex;align-items:center;gap:4px;width:max-content;min-width:52px}
.chatbot-typing i{width:5px;height:5px;border-radius:50%;background:#e07212;opacity:.35;animation:chatTyping 1s infinite}
.chatbot-typing i:nth-child(2){animation-delay:.15s}
.chatbot-typing i:nth-child(3){animation-delay:.3s}
.chatbot-panel__form button{position:relative;overflow:hidden}
@keyframes chatTyping{0%,60%,100%{transform:translateY(0);opacity:.35}30%{transform:translateY(-4px);opacity:1}}
@keyframes chatPanelIn{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
@media(max-width:680px){
 .chatbot-panel{border-radius:22px;max-height:calc(100svh - 112px)}
 .chatbot-panel__messages{padding:14px}
 .chatbot-msg{font-size:.9rem;max-width:92%}
}
@media(prefers-reduced-motion:reduce){.chatbot-panel{animation:none!important}.chatbot-typing i{animation:none!important}}
