/* ============================================================
   TapCard Bot · widget (todo scopeado a #tcbot-root con !important
   para que el tema de la web NO pueda pisar los estilos).
   ============================================================ */
#tcbot-root{
  --tcbot-negro:#1F1F1E; --tcbot-dorado1:#F0D070; --tcbot-dorado2:#C9A84C; --tcbot-crema:#F7F4EE;
  --tcbot-spring:cubic-bezier(.34,1.56,.64,1); --tcbot-ease:cubic-bezier(.16,1,.3,1);
}
#tcbot-root, #tcbot-root *{ box-sizing:border-box !important; }
#tcbot-root button{ margin:0 !important; text-transform:none !important; letter-spacing:normal !important; line-height:1 !important; }

/* ---------- Burbuja flotante ---------- */
#tcbot-root .tcbot-bubble{
  position:fixed !important; right:20px !important; bottom:20px !important; z-index:99998 !important;
  width:70px !important; height:70px !important; padding:0 !important;
  border:2px solid rgba(240,208,112,.9) !important; border-radius:50% !important;
  background:radial-gradient(circle at 32% 26%, #34332f, #1F1F1E 72%) !important;
  cursor:pointer !important; display:flex !important; align-items:center !important; justify-content:center !important;
  box-shadow:0 8px 26px rgba(0,0,0,.45) !important;
  transition:transform .25s var(--tcbot-spring), box-shadow .25s var(--tcbot-ease) !important;
  animation:tcbot-breathe 2.8s var(--tcbot-ease) infinite !important;
}
#tcbot-root .tcbot-bubble:hover{ transform:translateY(-3px) scale(1.05) !important; animation:none !important; box-shadow:0 12px 32px rgba(0,0,0,.5), 0 0 24px 5px rgba(240,208,112,.55) !important; }
#tcbot-root .tcbot-bubble:active{ transform:scale(.92) !important; }
#tcbot-root .tcbot-bubble svg{ width:46px !important; height:46px !important; display:block !important; }
#tcbot-root .tcbot-bubble.tcbot-hidden{ transform:scale(0) !important; pointer-events:none !important; }
@keyframes tcbot-breathe{
  0%,100%{ box-shadow:0 8px 26px rgba(0,0,0,.45), 0 0 0 0 rgba(240,208,112,0); }
  50%{ box-shadow:0 8px 26px rgba(0,0,0,.45), 0 0 20px 3px rgba(240,208,112,.45); }
}

/* ---------- Nubecita de auto-saludo ---------- */
#tcbot-root .tcbot-nudge{
  position:fixed !important; right:104px !important; bottom:36px !important; z-index:99998 !important;
  max-width:215px !important; padding:12px 17px !important;
  background:linear-gradient(135deg,var(--tcbot-dorado1),var(--tcbot-dorado2)) !important; color:#1F1F1E !important;
  font-family:'Poppins',sans-serif !important; font-size:14px !important; font-weight:600 !important; line-height:1.4 !important;
  border-radius:18px 18px 4px 18px !important;
  box-shadow:0 10px 30px rgba(0,0,0,.3) !important; cursor:pointer !important;
  opacity:0 !important; transform:translateY(12px) scale(.92) !important; pointer-events:none !important;
  transition:opacity .5s var(--tcbot-ease), transform .6s var(--tcbot-spring) !important;
}
#tcbot-root .tcbot-nudge.tcbot-show{ opacity:1 !important; transform:translateY(0) scale(1) !important; pointer-events:auto !important; }
#tcbot-root .tcbot-nudge-x{
  position:absolute !important; top:-8px !important; right:-8px !important; width:22px !important; height:22px !important;
  background:var(--tcbot-negro) !important; color:var(--tcbot-crema) !important; border-radius:50% !important;
  display:flex !important; align-items:center !important; justify-content:center !important; font-size:12px !important; border:none !important; cursor:pointer !important;
}

/* ---------- Panel ---------- */
#tcbot-root .tcbot-panel{
  position:fixed !important; right:20px !important; bottom:20px !important; z-index:99999 !important;
  width:370px !important; max-width:calc(100vw - 32px) !important;
  height:580px !important; max-height:calc(100vh - 100px) !important;
  background:var(--tcbot-negro) !important; border-radius:22px !important; overflow:hidden !important;
  display:flex !important; flex-direction:column !important;
  box-shadow:0 20px 60px rgba(0,0,0,.55) !important; border:1px solid rgba(201,168,76,.22) !important;
  font-family:'Poppins',-apple-system,sans-serif !important;
  transform:translateY(24px) scale(.96) !important; opacity:0 !important; pointer-events:none !important;
  transition:transform .38s var(--tcbot-spring), opacity .3s var(--tcbot-ease) !important;
}
#tcbot-root .tcbot-panel.tcbot-open{ transform:translateY(0) scale(1) !important; opacity:1 !important; pointer-events:auto !important; }

/* Header */
#tcbot-root .tcbot-header{
  display:flex !important; align-items:center !important; gap:12px !important; padding:15px 18px !important;
  background:rgba(240,208,112,.10) !important; backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(201,168,76,.25) !important;
}
#tcbot-root .tcbot-avatar{
  width:46px !important; height:46px !important; flex:0 0 46px !important; border-radius:50% !important; overflow:hidden !important;
  background:linear-gradient(135deg,var(--tcbot-dorado1),var(--tcbot-dorado2)) !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
}
#tcbot-root .tcbot-avatar svg{ width:32px !important; height:32px !important; display:block !important; }
#tcbot-root .tcbot-avatar img.tcbot-av-img{ width:100% !important; height:100% !important; object-fit:cover !important; object-position:center top !important; border-radius:50% !important; }
#tcbot-root .tcbot-htext{ flex:1 !important; min-width:0 !important; }
#tcbot-root .tcbot-hname{ color:var(--tcbot-crema) !important; font-weight:600 !important; font-size:15px !important; line-height:1.2 !important; margin:0 !important; }
#tcbot-root .tcbot-hstatus{ color:var(--tcbot-dorado1) !important; font-size:12px !important; display:flex !important; align-items:center !important; gap:5px !important; }
#tcbot-root .tcbot-dot{ width:7px !important; height:7px !important; border-radius:50% !important; background:#4ade80 !important; display:inline-block !important; box-shadow:0 0 6px rgba(74,222,128,.8) !important; }
#tcbot-root .tcbot-close{
  background:rgba(247,244,238,.10) !important; border:none !important; color:var(--tcbot-crema) !important;
  width:34px !important; height:34px !important; border-radius:50% !important; cursor:pointer !important;
  display:flex !important; align-items:center !important; justify-content:center !important; opacity:.9 !important;
  transition:color .2s ease, background .2s ease, opacity .2s ease !important;
}
#tcbot-root .tcbot-close:hover{ color:var(--tcbot-dorado1) !important; background:rgba(240,208,112,.18) !important; opacity:1 !important; }
#tcbot-root .tcbot-close svg{ width:18px !important; height:18px !important; display:block !important; }

/* Cuerpo */
#tcbot-root .tcbot-body{
  flex:1 !important; overflow-y:auto !important; padding:18px 16px 6px !important;
  display:flex !important; flex-direction:column !important; gap:12px !important;
  scrollbar-width:thin; scrollbar-color:rgba(201,168,76,.4) transparent;
}
#tcbot-root .tcbot-body::-webkit-scrollbar{ width:6px; }
#tcbot-root .tcbot-body::-webkit-scrollbar-thumb{ background:rgba(201,168,76,.4); border-radius:6px; }

#tcbot-root .tcbot-msg{
  max-width:82% !important; padding:11px 15px !important; margin:0 !important;
  font-size:14px !important; line-height:1.55 !important; color:var(--tcbot-crema) !important;
  border-radius:18px !important; white-space:pre-wrap !important; word-wrap:break-word !important;
  animation:tcbot-fadeup .38s cubic-bezier(.22,.61,.36,1) both !important;
}
#tcbot-root .tcbot-msg.bot{ align-self:flex-start !important; background:rgba(247,244,238,.06) !important; border:1px solid rgba(247,244,238,.08) !important; border-bottom-left-radius:6px !important; }
#tcbot-root .tcbot-msg.user{ align-self:flex-end !important; background:linear-gradient(135deg,var(--tcbot-dorado1),var(--tcbot-dorado2)) !important; color:var(--tcbot-negro) !important; font-weight:500 !important; border-bottom-right-radius:6px !important; }
@keyframes tcbot-fadeup{ from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:translateY(0);} }

/* Escribiendo */
#tcbot-root .tcbot-typing{ display:flex !important; gap:5px !important; align-items:center !important; padding:14px 16px !important; }
#tcbot-root .tcbot-typing span{ width:8px !important; height:8px !important; border-radius:50% !important; background:rgba(247,244,238,.55) !important; animation:tcbot-blink 1.2s infinite ease-in-out both !important; }
#tcbot-root .tcbot-typing span:nth-child(2){ animation-delay:.18s !important; }
#tcbot-root .tcbot-typing span:nth-child(3){ animation-delay:.36s !important; }
@keyframes tcbot-blink{ 0%,80%,100%{ transform:scale(.7); opacity:.4; } 40%{ transform:scale(1); opacity:1; } }

/* Botón de acción (compra / WhatsApp) */
#tcbot-root .tcbot-action{
  align-self:flex-start !important; display:inline-flex !important; align-items:center !important; gap:8px !important;
  padding:11px 20px !important; margin:0 !important; text-decoration:none !important;
  background:linear-gradient(135deg,var(--tcbot-dorado1),var(--tcbot-dorado2)) !important;
  color:var(--tcbot-negro) !important; font-weight:600 !important; font-size:14px !important; border-radius:40px !important;
  box-shadow:0 6px 18px rgba(201,168,76,.35) !important;
  transition:transform .25s var(--tcbot-spring), box-shadow .25s var(--tcbot-ease) !important;
  animation:tcbot-fadeup .5s var(--tcbot-ease) both !important;
}
#tcbot-root .tcbot-action:hover{ transform:translateY(-3px) !important; box-shadow:0 10px 24px rgba(201,168,76,.5) !important; color:var(--tcbot-negro) !important; }
#tcbot-root .tcbot-action:active{ transform:scale(.95) !important; }

/* Media en el chat */
#tcbot-root .tcbot-media-msg{ align-self:flex-start !important; max-width:82% !important; border-radius:16px !important; overflow:hidden !important; border:1px solid rgba(201,168,76,.25) !important; animation:tcbot-fadeup .5s var(--tcbot-ease) both !important; }
#tcbot-root .tcbot-media-msg img, #tcbot-root .tcbot-media-msg video{ display:block !important; width:100% !important; height:auto !important; }

/* Chips (solo modo guiado) */
#tcbot-root .tcbot-chips{ display:flex !important; flex-wrap:wrap !important; gap:8px !important; padding:8px 16px 12px !important; }
#tcbot-root .tcbot-chip{
  padding:8px 15px !important; font-size:13px !important; font-weight:500 !important; font-family:inherit !important;
  background:transparent !important; color:var(--tcbot-dorado1) !important; border:1px solid rgba(201,168,76,.45) !important; border-radius:40px !important; cursor:pointer !important;
  transition:transform .2s var(--tcbot-spring), box-shadow .2s var(--tcbot-ease), background .2s ease !important;
}
#tcbot-root .tcbot-chip:hover{ transform:translateY(-2px) !important; box-shadow:0 6px 16px rgba(201,168,76,.3) !important; background:rgba(201,168,76,.1) !important; }

/* Barra de entrada — glass dorado, letra CLARA */
#tcbot-root .tcbot-input{
  display:flex !important; gap:9px !important; align-items:center !important; padding:13px 14px !important;
  border-top:1px solid rgba(201,168,76,.22) !important;
  background:linear-gradient(180deg, rgba(240,208,112,.12), rgba(201,168,76,.06)) !important;
  backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
}
#tcbot-root .tcbot-input input{
  flex:1 !important; padding:12px 17px !important; font-size:14px !important; font-family:inherit !important;
  background:rgba(31,31,30,.55) !important; color:var(--tcbot-crema) !important; -webkit-text-fill-color:var(--tcbot-crema) !important;
  border:1px solid rgba(201,168,76,.45) !important; border-radius:30px !important; outline:none !important; box-shadow:none !important;
  transition:border-color .25s var(--tcbot-ease), background .25s var(--tcbot-ease), box-shadow .25s var(--tcbot-ease) !important;
}
#tcbot-root .tcbot-input input::placeholder{ color:rgba(247,244,238,.5) !important; }
#tcbot-root .tcbot-input input:focus{ border-color:rgba(240,208,112,.85) !important; box-shadow:0 0 0 3px rgba(240,208,112,.14) !important; }
#tcbot-root .tcbot-send{
  width:46px !important; height:46px !important; flex:0 0 46px !important; padding:0 !important; border:none !important; border-radius:50% !important;
  background:linear-gradient(135deg,var(--tcbot-dorado1),var(--tcbot-dorado2)) !important; cursor:pointer !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  box-shadow:0 4px 14px rgba(201,168,76,.4) !important;
  transition:transform .25s var(--tcbot-spring), box-shadow .25s var(--tcbot-ease) !important;
}
#tcbot-root .tcbot-send:hover{ transform:translateY(-2px) scale(1.04) !important; box-shadow:0 7px 18px rgba(201,168,76,.55) !important; }
#tcbot-root .tcbot-send:active{ transform:scale(.9) !important; }
#tcbot-root .tcbot-send svg{ width:20px !important; height:20px !important; display:block !important; margin-left:1px !important; }

/* Móvil */
@media (max-width:480px){
  #tcbot-root .tcbot-panel{ right:10px !important; bottom:10px !important; height:calc(100vh - 90px) !important; max-height:none !important; width:calc(100vw - 20px) !important; }
  #tcbot-root .tcbot-bubble{ right:16px !important; bottom:16px !important; }
  #tcbot-root .tcbot-nudge{ right:92px !important; }
}

/* ============================================================
   PANEL ADMIN (scope .tcbot-admin)
   ============================================================ */
.tcbot-admin .tcbot-ver{ font-size:13px; color:#C9A84C; font-weight:600; vertical-align:middle; margin-left:6px; }
.tcbot-admin .tcbot-sub{ max-width:720px; color:#555; }
.tcbot-admin .tcbot-card{ background:#fff; border:1px solid #e2e2e2; border-radius:12px; padding:20px 22px; margin:18px 0; max-width:840px; box-shadow:0 2px 10px rgba(0,0,0,.04); }
.tcbot-admin .tcbot-card h2{ margin-top:0; border-bottom:2px solid #F0D070; padding-bottom:8px; display:inline-block; }
.tcbot-admin .tcbot-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.tcbot-admin .tcbot-colors{ grid-template-columns:repeat(4,1fr); }
.tcbot-admin label{ display:block; font-weight:600; font-size:13px; color:#333; margin-bottom:4px; }
.tcbot-admin input[type=text], .tcbot-admin input[type=password], .tcbot-admin input[type=number], .tcbot-admin textarea, .tcbot-admin select{ width:100%; padding:9px 11px; border:1px solid #cfcfcf; border-radius:8px; font-size:14px; font-family:inherit; margin-top:3px; font-weight:400; }
.tcbot-admin .tcbot-full{ margin-top:12px; }
.tcbot-admin .tcbot-switch{ display:flex; align-items:center; gap:8px; font-weight:600; margin:10px 0; }
.tcbot-admin .tcbot-switch.tcbot-big{ font-size:16px; }
.tcbot-admin .tcbot-hint{ background:#FBF7EA; border-left:3px solid #C9A84C; padding:10px 14px; border-radius:6px; font-size:13px; color:#5a5140; }
.tcbot-admin .tcbot-hint code{ background:#efe4c4; padding:1px 6px; border-radius:4px; }
.tcbot-admin .tcbot-steps{ line-height:1.7; }
.tcbot-admin .tcbot-q{ font-weight:400; color:#9a8f77; font-size:12px; margin-left:6px; }
.tcbot-admin .tcbot-reset-brain{ display:inline-block; margin-left:8px; color:#8a6d1f; font-weight:600; text-decoration:none; }
.tcbot-admin .tcbot-reset-brain:hover{ text-decoration:underline; }

.tcbot-admin .tcbot-tabs{ display:flex; flex-wrap:wrap; gap:6px; margin:18px 0 0; border-bottom:2px solid #e3ddcb; }
.tcbot-admin .tcbot-tab{ background:transparent; border:none; padding:10px 16px; font-size:14px; font-weight:600; color:#7a7160; cursor:pointer; border-bottom:3px solid transparent; margin-bottom:-2px; border-radius:8px 8px 0 0; }
.tcbot-admin .tcbot-tab:hover{ background:#faf7ee; }
.tcbot-admin .tcbot-tab.active{ color:#1F1F1E; border-bottom-color:#C9A84C; background:#fff; }
.tcbot-admin .tcbot-pane{ display:none; }
.tcbot-admin .tcbot-pane.active{ display:block; }
.tcbot-admin .tcbot-status{ margin:14px 0; padding:11px 16px; border-radius:10px; font-size:14px; }
.tcbot-admin .tcbot-status.ok{ background:#eafaf0; border:1px solid #a7e0bd; color:#1c6b3e; }
.tcbot-admin .tcbot-status.off{ background:#fdf6e6; border:1px solid #e8cf94; color:#7a5a12; }
.tcbot-admin .tcbot-grid3{ display:grid; grid-template-columns:1fr 1fr 1.4fr; gap:12px; flex:1; }
.tcbot-admin .tcbot-row{ display:flex; gap:12px; align-items:flex-start; background:#faf9f6; border:1px solid #e5e0d3; border-radius:10px; padding:12px 14px; margin:12px 0; flex-wrap:wrap; }
.tcbot-admin .tcbot-media-row{ flex-direction:column; }
.tcbot-admin .tcbot-media-url{ display:flex; gap:8px; align-items:center; width:100%; margin-top:6px; }
.tcbot-admin .tcbot-url-field{ flex:1; }
.tcbot-admin .tcbot-avatar-preview{ width:44px; height:44px; border-radius:50%; object-fit:cover; }
.tcbot-admin .tcbot-del{ color:#b32d2e !important; border-color:#e0b4b4 !important; font-weight:700; border-radius:8px !important; height:34px; align-self:center; }
.tcbot-admin .tcbot-mono{ font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:13px; line-height:1.5; }
.tcbot-admin .tcbot-flow{ background:#faf9f6; border:1px solid #e5e0d3; border-radius:10px; padding:14px 16px; margin:14px 0; }
.tcbot-admin .tcbot-flow-head{ display:flex; align-items:center; gap:12px; margin-bottom:8px; }
.tcbot-admin .tcbot-flow-title{ flex:1; font-weight:600 !important; }
.tcbot-admin .tcbot-menu-check{ display:flex; align-items:center; gap:6px; font-size:13px; white-space:nowrap; margin:0; }
.tcbot-admin .tcbot-mini label{ font-size:12px; color:#666; }
.tcbot-admin .tcbot-actions{ margin:22px 0; }
