:root{
  /* Colores corporativos */
  --chat-brand:#0098A6;
  --chat-brand-700:#007783;

  --chat-bg:#ffffff;
  --chat-text:#0f172a;
  --chat-muted:#64748b;
  --chat-ring:#e5e7eb;

  --shadow-lg:0 24px 60px rgba(0,0,0,.28), 0 4px 10px rgba(0,0,0,.08);
  --chat-radius:14px;
  --btn-pill:999px;

  /* Tamaños base (se ajustan en media queries) */
  --panel-w: 360px;
  --panel-h: 560px;

  /* Posición del botón (5 cm arriba en desktop) */
  --fab-bottom: 5cm;
  --fab-right: 22px;
  --fab-left: auto;
}

/* ===== BOTÓN FLOTANTE ===== */
#ac-chat-launcher{
  position: fixed;
  bottom: var(--fab-bottom);
  right: var(--fab-right);
  left: var(--fab-left);
  z-index: 2147483000;
  background: var(--chat-brand);
  color: #fff;
  border: none;
  border-radius: var(--btn-pill);
  padding: 11px 16px;
  cursor: pointer;
  font: 400 14px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
  box-shadow: 0 8px 22px rgba(0,0,0,.25);
  transition: transform .2s ease, background .2s ease, box-shadow .2s ease, bottom .2s ease, right .2s ease, left .2s ease;
  display: inline-flex; align-items: center; gap: 8px;
  letter-spacing: .1px;
}
#ac-chat-launcher:hover{ background: var(--chat-brand-700); box-shadow: 0 10px 26px rgba(0,0,0,.30); }
#ac-chat-launcher:active{ transform: translateY(1px); }
@keyframes ac-pulse { 0%{transform:scale(1)}40%{transform:scale(1.06)}100%{transform:scale(1)} }
#ac-chat-launcher.ac-attn { animation: ac-pulse .9s ease-out 1; }

/* ===== OVERLAY ===== */
#ac-chat-overlay{
  position: fixed; inset: 0; background: rgba(15,23,42,.35);
  z-index: 2147482999;
}
#ac-chat-overlay[hidden]{ display:none; }

/* ===== PANEL ===== */
#ac-chat-panel{
  position: fixed;
  bottom: calc(var(--fab-bottom) + 64px);
  right: var(--fab-right);
  left: var(--fab-left);
  width: min(94vw, var(--panel-w));
  max-height: min(85vh, var(--panel-h));
  display: flex; flex-direction: column;
  border-radius: var(--chat-radius);
  box-shadow: var(--shadow-lg);
  background: var(--chat-bg);
  overflow: hidden;
  z-index: 2147483001;
  font: 400 14px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
  transform-origin: 100% 100%;
  opacity: 0; transform: translateY(16px) scale(.96);
  transition: opacity .18s ease, transform .18s ease;
}
#ac-chat-panel[hidden]{ display:none; }
#ac-chat-panel.is-open{ opacity:1; transform: translateY(0) scale(1); }
#ac-chat-panel.minimized{ display:none; }

/* ===== CABECERA ===== */
#ac-chat-panel .ac-head{
  background: linear-gradient(135deg,var(--chat-brand), var(--chat-brand-700));
  color:#fff; padding: 10px 12px;
  display:flex; align-items: center; justify-content: space-between;
}
#ac-chat-panel .ac-head .title{ font-size:14px; font-weight:400; letter-spacing:.2px; }
#ac-chat-panel .ac-head .tools{ display:flex; gap:6px; }
#ac-chat-panel .ac-head button{
  background: rgba(255,255,255,.14); color:#fff; border:0; width:28px; height:28px;
  border-radius: 8px; cursor:pointer; font: 400 14px/1 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
}
#ac-chat-panel .ac-head button:hover{ background: rgba(255,255,255,.22); }

/* ===== MENSAJES ===== */
#ac-body{ flex:1; padding:10px; overflow-y:auto; background: #fafbfc; }
.ac-msg{ margin: 0 0 8px; display:flex; gap:8px; }
.ac-msg .bubble{
  padding:8px 10px; border-radius: 12px; max-width: 78%;
  font-size: 13px; word-wrap: break-word; overflow-wrap: anywhere;
}
.ac-msg.bot .bubble{ background:#f1f5f9; color: var(--chat-text); }
.ac-msg.me{ justify-content: flex-end; }
.ac-msg.me .bubble{ background: var(--chat-brand); color:#fff; }

/* Acciones rápidas */
.ac-quick{ display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
.ac-chip{
  border:1px solid var(--chat-ring); background:#fff; border-radius: 999px;
  padding:6px 10px; font: 400 12px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial; cursor:pointer;
}
.ac-chip:hover{ background:#f8fafc; }

/* ===== PIE (input + botón) ===== */
#ac-chat-panel .ac-foot{
  padding:8px; border-top:1px solid var(--chat-ring);
  display:flex; gap:8px; background:#fff;
}
#ac-input{
  flex:1; border:1px solid var(--chat-ring); border-radius:10px; padding:8px 10px;
  font:400 13px/1.3 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial; outline:none; background:#fff; color:var(--chat-text);
}
#ac-input::placeholder{ color:#94a3b8; }
#ac-input:focus{ border-color: var(--chat-brand); box-shadow: 0 0 0 4px rgba(0,152,166,.15); }
#ac-send{
  background: var(--chat-brand); border:0; border-radius:10px; padding:8px 12px; color:#fff; cursor:pointer;
  font:400 13px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
}
#ac-send:hover{ background: var(--chat-brand-700); }

/* ===== RESPONSIVE ===== */
@media (max-width: 1024px){
  :root{ --fab-bottom: 22px; }
}

@media (max-width: 560px){
  :root{ --panel-w: 100vw; --panel-h: 78vh; }
  #ac-chat-panel{
    left: 0; right: 0; width: 100%; bottom: 0;
    border-radius: 16px 16px 0 0; transform-origin: 50% 100%;
  }
  #ac-chat-launcher{
    right: 18px; left: auto; bottom: 18px; /* sobreescribe 5cm en móvil */
    padding: 10px 14px;
  }
}