/* ==========================================================================
   Asistente de Decium — chatbot de preguntas frecuentes (sin IA, sin coste)
   Responde al instante lo habitual y deriva el resto a WhatsApp.
   ========================================================================== */

.dc-chat, .dc-chat * { box-sizing: border-box; }

/* Botón "Asistente" en la barra superior — discreto, como un enlace más del menú */
.nav__assistant {
  display: inline-flex; align-items: center; gap: 6px; cursor: pointer;
  background: transparent; border: none; border-radius: 0;
  color: var(--t-mid); font: inherit;
}
.nav__assistant:hover { background: transparent; color: var(--t-hi, #fff); }
.nav__assistant svg { width: 16px; height: 16px; flex: none; opacity: .85; }

/* En escritorio ocultamos la burbuja flotante: se abre desde la barra de arriba.
   En móvil (donde no hay barra visible) sí se mantiene la burbuja para acceso fácil. */
@media (min-width: 981px) {
  .dc-launcher, .dc-launcher__dot { display: none !important; }
}

/* ---- Botón lanzador (abajo a la derecha) ---- */
.dc-launcher {
  position: fixed; right: 22px; bottom: 22px; z-index: 900;
  width: 62px; height: 62px; border-radius: 50%; border: none; cursor: pointer;
  background: var(--lima, #BBE805); color: #0A0C08;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 14px 34px -10px rgba(187,232,5,.55), 0 6px 14px rgba(0,0,0,.35);
  transition: transform .2s ease, box-shadow .2s ease;
}
.dc-launcher:hover { transform: translateY(-3px) scale(1.04); }
.dc-launcher svg { width: 27px; height: 27px; }
.dc-launcher .dc-close-ico { display: none; }
.dc-chat.is-open .dc-launcher .dc-chat-ico { display: none; }
.dc-chat.is-open .dc-launcher .dc-close-ico { display: block; }
/* Punto de aviso "nuevo" */
.dc-launcher__dot {
  position: absolute; top: 2px; right: 2px; width: 16px; height: 16px;
  background: #ff4d4d; border: 2px solid #0A0C08; border-radius: 50%;
}
.dc-chat.is-open .dc-launcher__dot { display: none; }

/* ---- Panel ---- */
.dc-panel {
  position: fixed; right: 22px; bottom: 96px; z-index: 900;
  width: 370px; max-width: calc(100vw - 32px);
  height: 560px; max-height: calc(100vh - 130px);
  background: #0E1109; border: 1px solid rgba(255,255,255,.10);
  border-radius: 20px; overflow: hidden;
  display: flex; flex-direction: column;
  box-shadow: 0 40px 90px -30px rgba(0,0,0,.85);
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  opacity: 0; transform: translateY(12px) scale(.98); pointer-events: none;
  transition: opacity .22s ease, transform .22s ease;
}
.dc-chat.is-open .dc-panel { opacity: 1; transform: none; pointer-events: auto; }

/* Cabecera */
.dc-head {
  display: flex; align-items: center; gap: 12px; padding: 15px 16px;
  background: linear-gradient(180deg, rgba(187,232,5,.10), rgba(255,255,255,.02));
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.dc-head__logo {
  width: 40px; height: 40px; border-radius: 12px; object-fit: cover; flex: 0 0 auto;
}
.dc-head__t { flex: 1; min-width: 0; }
.dc-head__name {
  font-family: 'Poppins', sans-serif; font-weight: 600; font-size: 15px; color: #fff;
}
.dc-head__status { font-size: 12px; color: rgba(255,255,255,.55); display: flex; align-items: center; gap: 6px; margin-top: 1px; }
.dc-head__status::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #4ade80; }
.dc-head__close {
  background: none; border: none; color: rgba(255,255,255,.6); cursor: pointer;
  width: 30px; height: 30px; border-radius: 8px; font-size: 20px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
}
.dc-head__close:hover { background: rgba(255,255,255,.08); color: #fff; }

/* Mensajes */
.dc-msgs {
  flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 10px;
  scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.15) transparent;
}
.dc-msgs::-webkit-scrollbar { width: 6px; }
.dc-msgs::-webkit-scrollbar-thumb { background: rgba(255,255,255,.15); border-radius: 3px; }

.dc-msg { max-width: 85%; padding: 10px 13px; border-radius: 14px; font-size: 14px; line-height: 1.5; }
.dc-msg a { color: inherit; font-weight: 600; }
.dc-msg--bot {
  align-self: flex-start; background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08); color: rgba(255,255,255,.9);
  border-bottom-left-radius: 4px;
}
.dc-msg--user {
  align-self: flex-end; background: var(--lima, #BBE805); color: #0A0C08;
  font-weight: 500; border-bottom-right-radius: 4px;
}
.dc-msg strong { color: #fff; }
.dc-msg--user strong { color: #0A0C08; }

/* Indicador "escribiendo" */
.dc-typing { align-self: flex-start; display: flex; gap: 4px; padding: 12px 14px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); border-radius: 14px; border-bottom-left-radius: 4px; }
.dc-typing span { width: 7px; height: 7px; border-radius: 50%; background: rgba(255,255,255,.4); animation: dc-bounce 1.2s infinite; }
.dc-typing span:nth-child(2) { animation-delay: .15s; }
.dc-typing span:nth-child(3) { animation-delay: .3s; }
@keyframes dc-bounce { 0%,60%,100% { transform: translateY(0); opacity: .4; } 30% { transform: translateY(-5px); opacity: 1; } }

/* Chips de sugerencias */
.dc-chips { display: flex; flex-wrap: wrap; gap: 7px; padding: 0 16px 12px; }
.dc-chip {
  background: rgba(187,232,5,.10); border: 1px solid rgba(187,232,5,.30);
  color: var(--lima, #BBE805); font-family: 'Inter', sans-serif; font-size: 12.5px; font-weight: 500;
  padding: 8px 13px; border-radius: 999px; cursor: pointer; transition: background .15s;
}
.dc-chip:hover { background: rgba(187,232,5,.20); }

/* Barra de entrada */
.dc-input {
  display: flex; align-items: center; gap: 8px; padding: 12px 14px;
  border-top: 1px solid rgba(255,255,255,.08); background: #12150D;
}
.dc-input input {
  flex: 1; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.10);
  border-radius: 999px; padding: 11px 15px; color: #fff; font-family: 'Inter', sans-serif; font-size: 14px; outline: none;
}
.dc-input input::placeholder { color: rgba(255,255,255,.4); }
.dc-input input:focus { border-color: rgba(187,232,5,.5); }
.dc-input button {
  flex: 0 0 auto; width: 42px; height: 42px; border-radius: 50%; border: none; cursor: pointer;
  background: var(--lima, #BBE805); color: #0A0C08; display: flex; align-items: center; justify-content: center;
}
.dc-input button:hover { filter: brightness(1.05); }
.dc-input button svg { width: 19px; height: 19px; }

.dc-foot { text-align: center; font-size: 10.5px; color: rgba(255,255,255,.3); padding: 0 0 8px; background: #12150D; }

/* ---- Móvil: el asistente ocupa toda la pantalla ---- */
@media (max-width: 560px) {
  .dc-panel {
    top: 0; right: 0; bottom: 0; left: 0;
    width: 100%; max-width: 100%;
    height: 100vh; height: 100dvh; max-height: none;
    border: none; border-radius: 0;
  }
  /* Respetamos el notch y la barra inferior del móvil (safe areas). */
  .dc-head { padding-top: calc(15px + env(safe-area-inset-top)); }
  .dc-input { padding-bottom: calc(12px + env(safe-area-inset-bottom)); }
  .dc-foot { padding-bottom: calc(8px + env(safe-area-inset-bottom)); }
  /* Cabecera y burbujas un pelín más grandes: se lee mejor a pantalla completa. */
  .dc-head__name { font-size: 16px; }
  .dc-msgs { padding: 16px 16px 8px; gap: 11px; }
  .dc-msg { max-width: 88%; font-size: 15px; }
  .dc-input input { font-size: 16px; } /* 16px evita el zoom automático de iOS al enfocar */
  .dc-launcher { right: 16px; bottom: 16px; }
  /* A pantalla completa la burbuja sobra mientras el chat está abierto. */
  .dc-chat.is-open .dc-launcher { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .dc-panel, .dc-launcher { transition: none; }
  .dc-typing span { animation: none; }
}