/**
 * Ivy Wizard Pro — Chat Widget Positioning Fix
 * LEFT-DOCKED, site-wide, theme-proof.
 * Uses !important throughout to defeat hostile theme CSS.
 */

/* ═══ KILL EXISTING BROKEN RULES ═══════════════════════════════ */
/* Reset any old right-side positioning */
#ivy-launcher,
#ivy-panel {
  right: auto !important;
}

/* ═══ LAUNCHER — left-docked ════════════════════════════════════ */
#ivy-launcher {
  position: fixed !important;
  bottom: 28px !important;
  left: 28px !important;
  right: auto !important;
  z-index: 99995 !important;

  display: flex !important;
  align-items: center !important;
  gap: 10px !important;

  /* Use Silver Ivy blue gradient for the chat launcher */
  background: linear-gradient(135deg, #6ea8ff 0%, #8abdfd 100%) !important;
  color: #0a1730 !important;
  border: none !important;
  border-radius: 999px !important;
  padding: 11px 22px 11px 11px !important;
  cursor: pointer !important;

  box-shadow: 0 8px 32px rgba(110,168,255,.55), 0 2px 8px rgba(0,0,0,.5) !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: .01em !important;
  white-space: nowrap !important;
  line-height: 1 !important;
  font-family: 'Inter', -apple-system, 'Segoe UI', sans-serif !important;

  transition: transform 280ms cubic-bezier(.22,1,.36,1),
              box-shadow 280ms,
              bottom 320ms cubic-bezier(.22,1,.36,1),
              opacity 280ms !important;

  /* Defeat theme transforms / floats */
  float: none !important;
  margin: 0 !important;
  transform: none !important;
  text-transform: none !important;
}

#ivy-launcher:hover {
  transform: translateY(-3px) scale(1.03) !important;
  box-shadow: 0 14px 40px rgba(110,168,255,.65), 0 4px 12px rgba(0,0,0,.5) !important;
}

#ivy-launcher:active {
  transform: scale(.97) !important;
}

/* When panel open: slide launcher off screen to the left */
#ivy-chat[data-open="1"] #ivy-launcher {
  bottom: -120px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* On wizard pages with bottom bar, keep launcher clear */
body.page-template-wizard #ivy-launcher,
body.ivy-wizard-page #ivy-launcher {
  bottom: 90px !important;
}

/* ═══ LAUNCHER AVATAR ═══════════════════════════════════════════ */
.ivy-l-av {
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
  border: 2px solid rgba(0,0,0,.2) !important;
  background: linear-gradient(155deg,#0c1c36,#1a3060) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.ivy-l-av img, .ivy-l-av video {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* Unread dot */
#ivy-unread-dot {
  position: absolute !important;
  top: -4px !important;
  right: -4px !important;
  left: auto !important;
  width: 14px !important;
  height: 14px !important;
  border-radius: 50% !important;
  background: #FF4B6E !important;
  border: 2.5px solid #060912 !important;
  display: none !important;
}
#ivy-chat[data-unread="1"] #ivy-unread-dot {
  display: block !important;
}

/* ═══ PANEL — left-docked ════════════════════════════════════════ */
#ivy-panel {
  position: fixed !important;
  bottom: 28px !important;
  left: 28px !important;
  right: auto !important;
  z-index: 99996 !important;

  width: 400px !important;
  max-width: calc(100vw - 56px) !important;

  background: rgba(6,9,20,0.96) !important;
  backdrop-filter: blur(56px) saturate(2.2) !important;
  -webkit-backdrop-filter: blur(56px) saturate(2.2) !important;

  border: 1px solid rgba(255,255,255,.12) !important;
  border-top: 2px solid rgba(110,168,255,.35) !important;
  border-radius: 28px !important;

  box-shadow:
    0 0 0 1px rgba(110,168,255,.06) inset,
    0 40px 120px rgba(0,0,0,.90),
    0 8px 32px rgba(0,0,0,.6) !important;

  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
  max-height: min(660px, calc(100dvh - 80px)) !important;

  /* Hidden state */
  transform: translateY(20px) scale(.96) !important;
  opacity: 0 !important;
  pointer-events: none !important;

  transition: transform 320ms cubic-bezier(.22,1,.36,1),
              opacity 260ms ease !important;

  /* Defeat theme */
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

#ivy-chat[data-open="1"] #ivy-panel {
  transform: translateY(0) scale(1) !important;
  opacity: 1 !important;
  pointer-events: all !important;
}

/* ═══ PANEL HEADER ══════════════════════════════════════════════ */
#ivy-hd {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 16px 18px !important;
  border-bottom: 1px solid rgba(255,255,255,.07) !important;
  flex-shrink: 0 !important;
  background: rgba(8,12,28,.80) !important;
  position: relative !important;
}

.ivy-hd-av {
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
  border: 2px solid rgba(110,168,255,.35) !important;
  box-shadow: 0 0 0 4px rgba(110,168,255,.10) !important;
}
.ivy-hd-av img,
.ivy-hd-av video {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}
.ivy-hd-av-txt {
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(135deg,#0c1c36,#1a3060) !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  color: #6ea8ff !important;
}

.ivy-hd-info {
  flex: 1 !important;
  min-width: 0 !important;
}
.ivy-hd-name {
  font-size: 15px !important;
  font-weight: 800 !important;
  color: #F4F7FF !important;
  letter-spacing: -.01em !important;
  font-family: 'Inter',-apple-system,sans-serif !important;
}
.ivy-hd-meta {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin-top: 2px !important;
}
.ivy-hd-dot {
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  /* Use the brand accent for the online dot and glow */
  background: var(--g, #6ea8ff) !important;
  flex-shrink: 0 !important;
  box-shadow: 0 0 6px rgba(var(--gr, 110,168,255),.8) !important;
  animation: ivy-pulse 2.4s ease infinite !important;
}
@keyframes ivy-pulse {
  0%,100%{opacity:1}50%{opacity:.4}
}
.ivy-hd-status {
  font-size: 12px !important;
  color: rgba(185,205,245,.55) !important;
  font-weight: 500 !important;
  font-family: 'Inter',-apple-system,sans-serif !important;
}

#ivy-close {
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.05) !important;
  color: rgba(185,205,245,.6) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  transition: background 150ms, color 150ms, transform 150ms !important;
  padding: 0 !important;
  line-height: 1 !important;
}
#ivy-close:hover {
  background: rgba(255,80,80,.15) !important;
  color: #ff8080 !important;
  border-color: rgba(255,80,80,.25) !important;
  transform: scale(1.08) !important;
}
#ivy-close svg {
  width: 13px !important;
  height: 13px !important;
  pointer-events: none !important;
}

/* ═══ NAME TAG ══════════════════════════════════════════════════ */
#ivy-name-tag {
  margin: 10px 16px 0 !important;
  padding: 9px 13px !important;
  /* Replace neon green with subtle accent */
  background: rgba(var(--gr,110,168,255),.07) !important;
  border: 1px solid rgba(var(--gr,110,168,255),.18) !important;
  border-radius: 12px !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
  color: rgba(185,205,245,.80) !important;
  display: none !important;
  flex-shrink: 0 !important;
  align-items: center !important;
  gap: 8px !important;
  font-family: 'Inter',-apple-system,sans-serif !important;
}
#ivy-name-tag.visible {
  display: flex !important;
}
#ivy-name-tag strong {
  color: var(--g, #6ea8ff) !important;
}

/* ═══ MESSAGES AREA ═════════════════════════════════════════════ */
#ivy-msgs {
  flex: 1 !important;
  overflow-y: auto !important;
  min-height: 0 !important;
  padding: 14px 15px 8px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  scroll-behavior: smooth !important;
}
#ivy-msgs::-webkit-scrollbar { width: 3px !important; }
#ivy-msgs::-webkit-scrollbar-track { background: transparent !important; }
#ivy-msgs::-webkit-scrollbar-thumb { background: rgba(255,255,255,.08) !important; border-radius: 3px !important; }

.ivy-row {
  display: flex !important;
  align-items: flex-end !important;
  gap: 8px !important;
  animation: ivy-msg-in 200ms cubic-bezier(.22,1,.36,1) both !important;
}
.ivy-row.you { flex-direction: row-reverse !important; }
@keyframes ivy-msg-in {
  from { opacity:0; transform:translateY(6px); }
  to   { opacity:1; transform:none; }
}

.ivy-mini-av {
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
  overflow: hidden !important;
  border: 1.5px solid rgba(var(--gr,110,168,255),.25) !important;
  background: linear-gradient(135deg,#0c1c36,#1a3060) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.ivy-mini-av img,
.ivy-mini-av video {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}
.ivy-mini-av.you-av {
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.12) !important;
  font-size: 13px !important;
}

.ivy-bubble {
  max-width: min(84%, 320px) !important;
  padding: 10px 14px !important;
  border-radius: 18px !important;
  font-size: 13.5px !important;
  line-height: 1.55 !important;
  font-family: 'Inter',-apple-system,sans-serif !important;
}
.ivy-row.ai .ivy-bubble {
  background: rgba(255,255,255,.07) !important;
  color: #e8eeff !important;
  border-radius: 4px 18px 18px 18px !important;
  border: 1px solid rgba(255,255,255,.06) !important;
}
.ivy-row.ai .ivy-bubble p { margin: 0 0 7px !important; }
.ivy-row.ai .ivy-bubble p:last-child { margin-bottom: 0 !important; }
.ivy-row.ai .ivy-bubble ul,
.ivy-row.ai .ivy-bubble ol { padding-left: 17px !important; margin: 4px 0 7px !important; }
.ivy-row.ai .ivy-bubble li { margin-bottom: 3px !important; }
.ivy-row.ai .ivy-bubble strong { color: var(--g, #6ea8ff) !important; }
.ivy-row.ai .ivy-bubble a { color: var(--g, #6ea8ff) !important; text-decoration: none !important; }
.ivy-row.ai .ivy-bubble hr { border-color: rgba(255,255,255,.1) !important; margin: 8px 0 !important; }

.ivy-row.you .ivy-bubble {
  /* Sent messages use the Silver Ivy gradient and darker text */
  background: linear-gradient(135deg, var(--g, #6ea8ff) 0%, var(--g2, #8abdfd) 100%) !important;
  color: #0c1a33 !important;
  border-radius: 18px 4px 18px 18px !important;
  font-weight: 600 !important;
}

/* Typing indicator */
.ivy-typing-row {
  display: flex !important;
  align-items: flex-end !important;
  gap: 8px !important;
}
.ivy-typing-bubble {
  padding: 12px 16px !important;
  border-radius: 4px 18px 18px 18px !important;
  background: rgba(255,255,255,.07) !important;
  border: 1px solid rgba(255,255,255,.06) !important;
  display: flex !important;
  gap: 5px !important;
  align-items: center !important;
}
.ivy-td {
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: rgba(var(--gr,110,168,255),.6) !important;
  animation: ivy-td 1.2s ease infinite !important;
}
.ivy-td:nth-child(2) { animation-delay: .18s !important; }
.ivy-td:nth-child(3) { animation-delay: .36s !important; }
@keyframes ivy-td {
  0%,80%,100%{transform:scale(.8);opacity:.5}
  40%{transform:scale(1);opacity:1}
}

/* ═══ SUGGESTIONS ═══════════════════════════════════════════════ */
#ivy-sugg {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  padding: 4px 15px 10px !important;
  flex-shrink: 0 !important;
}
.ivy-sq {
  padding: 7px 13px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(var(--gr,110,168,255),.25) !important;
  background: rgba(var(--gr,110,168,255),.07) !important;
  color: rgba(185,205,245,.85) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: background 130ms, transform 130ms, color 130ms !important;
  white-space: nowrap !important;
  font-family: 'Inter',-apple-system,sans-serif !important;
}
.ivy-sq:hover {
  background: rgba(var(--gr,110,168,255),.18) !important;
  color: var(--g, #6ea8ff) !important;
  transform: translateY(-1px) !important;
}

/* ═══ WHATSAPP CARD ═════════════════════════════════════════════ */
#ivy-wa-card {
  margin: 0 15px 10px !important;
  padding: 13px 15px !important;
  border-radius: 14px !important;
  background: rgba(37,211,102,.08) !important;
  border: 1px solid rgba(37,211,102,.22) !important;
  display: none !important;
  align-items: center !important;
  gap: 11px !important;
  flex-shrink: 0 !important;
}
#ivy-wa-card.visible { display: flex !important; }
.ivy-wa-icon { width: 34px !important; height: 34px !important; border-radius: 50% !important; background: rgba(37,211,102,.15) !important; display: flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; }
.ivy-wa-icon svg { width: 18px !important; height: 18px !important; }
.ivy-wa-body { flex: 1 !important; min-width: 0 !important; }
.ivy-wa-title { font-size: 13px !important; font-weight: 700 !important; color: #F4F7FF !important; font-family: 'Inter',-apple-system,sans-serif !important; }
.ivy-wa-sub { font-size: 11.5px !important; color: rgba(185,205,245,.5) !important; margin-top: 2px !important; }
.ivy-wa-btn {
  padding: 8px 14px !important;
  border-radius: 10px !important;
  border: none !important;
  background: #25D366 !important;
  color: #fff !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  display: inline-block !important;
  transition: background 130ms, transform 130ms !important;
  flex-shrink: 0 !important;
  font-family: 'Inter',-apple-system,sans-serif !important;
}
.ivy-wa-btn:hover { background: #1ebe5a !important; transform: scale(1.04) !important; }

/* ═══ INPUT FOOTER ══════════════════════════════════════════════ */
#ivy-foot {
  padding: 12px 15px 15px !important;
  border-top: 1px solid rgba(255,255,255,.07) !important;
  flex-shrink: 0 !important;
  background: rgba(4,6,16,.65) !important;
}
#ivy-input-row {
  display: flex !important;
  align-items: flex-end !important;
  gap: 9px !important;
}
#ivy-inp {
  flex: 1 !important;
  min-height: 44px !important;
  max-height: 110px !important;
  background: rgba(255,255,255,.07) !important;
  border: 1.5px solid rgba(255,255,255,.11) !important;
  border-radius: 14px !important;
  color: #F4F7FF !important;
  font-size: 13.5px !important;
  line-height: 1.5 !important;
  padding: 11px 14px !important;
  resize: none !important;
  outline: none !important;
  transition: border-color 160ms, background 160ms, box-shadow 160ms !important;
  overflow-y: auto !important;
  font-family: 'Inter',-apple-system,sans-serif !important;
  -webkit-appearance: none !important;
}
#ivy-inp:focus {
  border-color: rgba(var(--gr,110,168,255),.45) !important;
  background: rgba(255,255,255,.10) !important;
  box-shadow: 0 0 0 3px rgba(var(--gr,110,168,255),.11) !important;
}
#ivy-inp::placeholder {
  color: rgba(180,200,240,.28) !important;
}
#ivy-send {
  width: 44px !important;
  height: 44px !important;
  flex-shrink: 0 !important;
  /* Send button uses the brand gradient and accent glow */
  background: linear-gradient(135deg,var(--g, #6ea8ff) 0%,var(--g2, #8abdfd) 100%) !important;
  border: none !important;
  border-radius: 13px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  box-shadow: 0 4px 18px rgba(var(--gr,110,168,255),.40) !important;
  transition: transform 150ms, box-shadow 150ms, opacity 150ms !important;
  padding: 0 !important;
}
#ivy-send:hover { transform: scale(1.08) !important; box-shadow: 0 8px 28px rgba(var(--gr,110,168,255),.60) !important; }
#ivy-send:active { transform: scale(.92) !important; }
#ivy-send:disabled { opacity: .35 !important; cursor: not-allowed !important; transform: none !important; box-shadow: none !important; }
#ivy-send svg { width: 17px !important; height: 17px !important; color: #021A0E !important; pointer-events: none !important; }

.ivy-foot-hint {
  font-size: 11px !important;
  color: rgba(180,200,240,.25) !important;
  text-align: center !important;
  margin-top: 7px !important;
  font-family: 'Inter',-apple-system,sans-serif !important;
}

/* ═══ MOBILE ════════════════════════════════════════════════════ */
@media(max-width: 560px) {
  #ivy-launcher {
    bottom: 18px !important;
    left: 16px !important;
    padding: 10px 18px 10px 10px !important;
    font-size: 13px !important;
  }
  #ivy-panel {
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    border-radius: 24px 24px 0 0 !important;
    max-height: 88dvh !important;
  }
}


/* v31.1.1 chat readability + scroll */
#ivy-panel{
  width:min(560px,calc(100vw - 32px)) !important;
  max-width:calc(100vw - 32px) !important;
  height:min(760px,calc(100dvh - 32px)) !important;
  max-height:min(760px,calc(100dvh - 32px)) !important;
}
#ivy-msgs{
  overflow-y:auto !important;
  overscroll-behavior:contain !important;
  -webkit-overflow-scrolling:touch !important;
  padding:16px 18px 12px !important;
}
.ivy-row{align-items:flex-start !important;}
.ivy-bubble{
  max-width:min(100%,420px) !important;
  white-space:normal !important;
  overflow-wrap:anywhere !important;
  word-break:break-word !important;
}
#ivy-foot{padding:12px 16px 16px !important;}

/* v31.2.0 chat readability */
#ivy-panel{height:min(820px,calc(100dvh - 20px)) !important;max-height:min(820px,calc(100dvh - 20px)) !important;}
#ivy-msgs{overflow-y:auto !important;min-height:0 !important;max-height:none !important;padding-bottom:18px !important;}
.ivy-bubble{max-width:min(94%,560px) !important;white-space:pre-wrap !important;}
.ivy-row.ai .ivy-bubble,.ivy-row.you .ivy-bubble{overflow-wrap:anywhere !important;word-break:break-word !important;}
#ivy-ft{flex-shrink:0 !important;}

/* v31.3.0 chat scroll lock */
#ivy-panel{display:grid !important;grid-template-rows:auto minmax(0,1fr) auto !important;overflow:hidden !important;}
#ivy-msgs{min-height:0 !important;height:auto !important;overflow-y:auto !important;overscroll-behavior:contain !important;}
#ivy-foot{position:relative !important;z-index:2 !important;}


/* ===== v31.4.0 chat scroll fix ===== */
#ivy-panel{display:grid!important;grid-template-rows:auto auto minmax(0,1fr) auto auto auto!important;}
#ivy-msgs{min-height:0!important;height:100%!important;max-height:none!important;overflow-y:auto!important;overscroll-behavior:contain!important;-webkit-overflow-scrolling:touch!important;}
.ivy-bubble{max-width:min(88%,340px)!important;word-break:break-word!important;overflow-wrap:anywhere!important;}


/* v51.0.8 bubble scroll + rich actions */
#ivy-msgs{touch-action:pan-y!important;overscroll-behavior:contain!important;overscroll-behavior-y:contain!important;-webkit-overflow-scrolling:touch!important;scrollbar-gutter:stable!important;}
#ivy-msgs a{pointer-events:auto!important;}
.ivy-chat-btn{display:inline-flex!important;align-items:center!important;justify-content:center!important;padding:10px 14px!important;border-radius:12px!important;background:linear-gradient(135deg,rgba(110,168,255,.24),rgba(110,168,255,.12))!important;border:1px solid rgba(110,168,255,.34)!important;color:#eef6ff!important;text-decoration:none!important;font-weight:800!important;}


/* v51.0.17 final chat scroll override */
#ivy-panel{
  display:flex!important;
  flex-direction:column!important;
  grid-template-rows:none!important;
  overflow:hidden!important;
}
#ivy-hd,#ivy-name-tag,#ivy-sugg,#ivy-foot{
  flex-shrink:0!important;
}
#ivy-msgs{
  flex:1 1 auto!important;
  min-height:0!important;
  height:auto!important;
  max-height:none!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior:contain!important;
  overscroll-behavior-y:contain!important;
  touch-action:pan-y!important;
  scroll-behavior:auto!important;
  scrollbar-gutter:auto!important;
}
#ivy-msgs *{
  touch-action:auto;
}