

/* ===========================
   Core tokens / Theme
   =========================== */
:root, .bz-scope{
  --dock-nudge-x: -15px;
  --bubble-nudge-x: 0px;
  /* Colors */
  --bg:#EEF1F5;
  --surface:#FFFFFF;
  --plate:#FAFBFE;
  --tile: clamp(72px, 24vw, 92px);
  --ring:#DCE1E8;
  --ink:#1F1F1F;
  --ink-mid:#2B2B2B;
  --ink-muted:#5F6368;
  --blue:#1A73E8;

  /* Layout / sizing */
  --frame-x:34px;
  --frame-y:34px;
  --logo-desktop:220px;
  --logo-mobile:100px;
  --logo-nudge:40px;
  --footer-h:54px;

  /* Bubble paddings + heights */
  --chat-pad-x:56px;
  --chat-pad-r:2px;
  --chat-pad-y:40px;
  --bubble-mh-desktop: clamp(200px, 24svh, 360px);  /* min useful desktop height */
  --bubble-default-h-mobile: clamp(40px, 34svh, 140px);     /* default open on phones */
  --bubble-h-mobile-expanded: 75vh;                             /* expanded on phones */
  --chat-bottom-cushion-expanded: 78px;     /* expanded only */

  --card-gap-x: 8px;
  --card-gap-y: 4px;
  --label-h: 14px;}html, body{
  margin:0; padding:0;
  min-height:100%;
  background: #EEF1F5;  /* unified main BG */
  font-family:"Nunito Sans","Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  color:var(--ink);

}/* Root container width guard */
#bizipy-assistant{ max-width:980px; margin:0 auto; }/* ===========================
   Header / Logo
   =========================== */
.bz-header{
  display:flex; justify-content:center; align-items:center;
  margin:10px 0 16px;
}.bz-logo{
  height:auto; width:100%; max-width:var(--logo-desktop);
  filter:drop-shadow(0 1px 3px rgba(0,0,0,.06));
  transition:filter .25s ease, transform .2s ease;
}.bz-typing .bz-logo{
  filter:brightness(1.08) saturate(1.1) drop-shadow(0 0 10px rgba(26,115,232,.45)) blur(.3px);
  transform:translateZ(0);
}/* ===========================
   Bubble (chat window)
   =========================== */
.bz-answer{
  transform: translateX(calc(-50% + var(--bubble-nudge-x, 0px)));
position:relative; z-index:10;
  margin:12px 0 10px;
  background:rgba(17,17,17,0.9);
  color:#fff;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 10px 30px rgba(0,0,0,.28);
  opacity:0; visibility:hidden;
  transition:opacity .22s ease, transform .2s ease;
  overflow:hidden;
}.bz-answer.active{ opacity:1; visibility:visible; }
/* --- Desktop: remove all scrollbars inside bubble (keeps mobile untouched) --- */
@media (min-width:1024px){
  .bz-answer,
  .bz-answer *{
    scrollbar-width: none;          /* Firefox */
    -ms-overflow-style: none;       /* IE/Edge legacy */
  }
  .bz-answer::-webkit-scrollbar,
  .bz-answer *::-webkit-scrollbar{
    display: none;                  /* Chrome/Safari/Edge */
  }
  /* Keep the bubble’s inner scroller on desktop so the last lines never hide */
  .bz-answer .bz-scroll-area{overflow-y: auto;
    max-height: calc(100svh - var(--footer-h, 54px) - 160px);
    /* breathing room so the last line clears the bottom edge & action rail */
    -webkit-overflow-scrolling: touch;
    padding: var(--chat-pad-y) 40px 56px var(--chat-pad-x);
  }

/* Inner scroller */

.bz-scroll-area{
    max-height:var(--bubble-mh-desktop);
}
}/* Right action stack inside bubble */
.bz-actions{
  position:absolute; top:50%; right:16px; transform:translateY(-50%);
  display:flex; flex-direction:column; gap:6px; z-index:3;
}.bz-act-btn{
  width:28px; height:28px; border-radius:8px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.12);
  color:#fff; display:grid; place-items:center; cursor:pointer;
}.bz-act-btn svg{ width:16px; height:16px; }/* Messages */
.bz-msg{ display:flex; align-items:flex-start; gap:8px; margin:8px 0; line-height:1.5; font-size:15px; }.bz-badge{ display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:50%; font-weight:700; font-size:13px; flex-shrink:0; }.bz-msg.user{ color:#d0e3ff; }.bz-msg.user .bz-badge{ background:#e0a40f; color:#fff; }.bz-msg.bot{ color:#fff; }.bz-msg.bot .bz-badge{ background:var(--blue); color:#fff; }/* ===========================
   Dock (input bar)
   =========================== */
.bz-dock{ display:flex; justify-content:center; margin:20px 0 12px; }.bz-field{
  position:relative; display:flex; align-items:center; gap:10px; flex:1; max-width:900px;
  background:var(--surface); border:1px solid var(--ring); border-radius:999px; padding:10px 16px;
  box-shadow:0 1px 2px rgba(0,0,0,.05);
  transition:border-color .2s;
  flex-wrap:nowrap;
}.bz-field.focus{ border-color:var(--blue); }.bz-icon{ display:grid; place-items:center; }.bz-icon svg{ width:18px; height:18px; stroke:#9CA3AF; stroke-width:2; fill:none; transition:stroke .25s; }.bz-field.focus .bz-icon svg{ stroke:var(--blue); }.bz-input{
  flex:1 1 auto; min-width:0; border:none; outline:none; background:transparent;
  color:var(--ink-muted); font-size:16px; font-weight:400; letter-spacing:.01em;
  font-family:"Nunito Sans","Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}.bz-input::placeholder{ color:var(--ink-muted); }.bz-btn{
  border:none; background:var(--blue); color:#fff; border-radius:999px; padding:10px 16px; font-weight:700;
  cursor:pointer; display:inline-flex; align-items:center; gap:8px; flex:0 0 auto;
}.bz-btn .bz-btn-label{ display:inline-block; }.bz-btn .bz-arrow{ width:20px; height:20px; stroke:#fff; fill:none; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }.bz-mic{
  position:relative; border:1px solid var(--ring); background:#fff; border-radius:50%;
  width:34px; height:34px; display:grid; place-items:center; cursor:pointer;
  transition:box-shadow .2s, border-color .2s, transform .12s;
}.bz-mic svg{ width:18px; height:18px; stroke:#5F6368; fill:none; stroke-width:1.7; }.bz-mic:hover, .bz-mic:focus-visible{ border-color:var(--blue); box-shadow:0 0 0 4px rgba(26,115,232,.14), 0 10px 22px rgba(26,115,232,.28), inset 0 0 0 2px var(--blue); }.bz-mic.active{ border-color:var(--blue); box-shadow:0 0 0 4px rgba(26,115,232,.12), inset 0 0 0 2px var(--blue); }.bz-mic.active svg{ stroke:var(--blue); }.bz-mic.active::after{ content:""; position:absolute; inset:-6px; border-radius:999px; border:2px solid rgba(26,115,232,.25); animation:bzPulse 1.2s ease-out infinite; }
@keyframes bzPulse{ 0%{ opacity:.8; transform:scale(.95); } 100%{ opacity:0; transform:scale(1.2); } }/* History dropdown */
.bz-history{
  position:absolute; top:110%; left:12px; right:12px;
  background:#fff; border:1px solid var(--ring); border-radius:12px;
  box-shadow:0 4px 12px rgba(0,0,0,.08);
  list-style:none; margin:4px 0 0; padding:6px 0; z-index:50; display:none; max-height:240px; overflow:auto;
}.bz-history li{ padding:9px 12px; font-size:14px; color:var(--ink-mid); cursor:pointer; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.bz-history li:hover{ background:var(--tile); }/* ===========================
   Cards Grid
   =========================== */
.bz-grid{
  display:grid;
  grid-template-columns: repeat(5, 130px); /* match card width */
  column-gap: 6px;                          /* now this actually tightens spacing */
  row-gap:16px;
  justify-content: center;                  /* keep the grid centered */
  padding:0 0 16px 0;
}
@media (min-width:1024px){
  .bz-grid{
    column-gap:2px;
    row-gap:16px;
    grid-template-columns: repeat(5, 130px); /* match .bz-card width */
  }
}.bz-card{
  width:130px;
  height:148px;
  background:transparent;
  border:none;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  cursor:pointer;
}.tile{
  width:100%; aspect-ratio:1/1; border-radius:16px; background:var(--tile);
  border:1px solid var(--ring); display:grid; place-items:center; box-shadow:0 2px 10px rgba(0,0,0,.05);
}.wz-badge{ width:94%; height:94%; border-radius:12px; display:grid; place-items:center; background:var(--plate); border:1px solid var(--ring); }.bz-label{
  font-size:13px; font-weight:700; color:var(--ink-muted); letter-spacing:.01em;
  font-family:"Nunito Sans","Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}/* Hover (desktop pointer) */
@media (hover:hover) and (pointer:fine){
  .bz-card{ transition:transform .22s cubic-bezier(.2,.8,.2,1), box-shadow .22s cubic-bezier(.2,.8,.2,1), background-color .22s ease; will-change:transform, box-shadow; }
  .bz-card .tile{ transition:transform .22s cubic-bezier(.2,.8,.2,1), filter .22s ease; will-change:transform, filter; }
  .bz-card .wz-badge{ transition:transform .22s cubic-bezier(.2,.8,.2,1); }
  .bz-card .bz-label{ transition:color .18s ease, letter-spacing .18s ease; }
  .bz-card:hover{ transform:translateY(-6px); box-shadow:0 14px 34px rgba(17,24,39,.14); background:color-mix(in srgb, var(--tile) 96%, white); }
  .bz-card:hover .tile{ transform:scale(1.04); filter:saturate(1.05); }
  .bz-card:hover .wz-badge{ transform:translateY(-2px) scale(1.02); }
  .bz-card:hover .bz-label{ color:var(--ink); letter-spacing:.15px; }
}/* ===========================
   Drawer (sessions/history)
   =========================== */
.bz-drawer{
  position:fixed; left:0; top:0; bottom:0; width:300px;
  background:#0f1115; color:#eef2ff;
  border-right:1px solid rgba(255,255,255,.08);
  box-shadow:0 10px 40px rgba(0,0,0,.4);
  transform:translateX(-102%); transition:transform .22s ease; z-index:1100; padding:12px;
}.bz-drawer.open{ transform:translateX(0); }.bz-drawer h4{ margin:6px 6px 10px; font-size:14px; color:#d9e1ff; }.bz-drawer-close{
  position:absolute; top:14px; right:12px; width:26px; height:26px; border-radius:999px;
  border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.15); color:#fff;
  display:grid; place-items:center; cursor:pointer; transition:background .2s, transform .15s;
}.bz-drawer-close:hover{ background:rgba(255,255,255,.25); transform:scale(1.05); }.bz-sessions{ list-style:none; padding:0; margin:28px 0 0; display:flex; flex-direction:column; gap:8px; max-height:calc(100vh - 114px); overflow:auto; }.bz-sessions li{ background:#171a21; border:1px solid rgba(255,255,255,.06); border-radius:10px; padding:10px; cursor:pointer; }.bz-sessions li b{ display:block; font-size:13px; color:#fff; }.bz-sessions li span{ display:block; font-size:12px; color:#a8b3cf; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.bz-drawer-actions{ display:flex; gap:8px; margin:10px 6px 0; }.bz-mini{ padding:6px 10px; border-radius:8px; border:1px solid rgba(255,255,255,.12); background:#121620; color:#e6ecff; cursor:pointer; font-size:12px; }/* ===========================
   Quick Reply Chips
   =========================== */
.bz-quickbar{ display:flex; flex-wrap:wrap; gap:8px; margin-left:8px; vertical-align:middle; }.bz-chip{
  appearance:none; border:1px solid var(--ring); background:#ffffff; color:#1f1f1f;
  padding:6px 14px; border-radius:999px;
  font:600 13px/1.2 "Nunito Sans","Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  cursor:pointer; box-shadow:0 2px 4px rgba(0,0,0,.06);
  transition:background .2s ease, transform .12s ease, border-color .2s ease;
}.bz-chip:hover{ background:#f7f9fc; transform:translateY(-1px); }.bz-chip[disabled]{ opacity:.5; cursor:default; transform:none; }.bz-chip.bz-yes{ background:#2f7dff; color:#fff; border-color:#2f7dff; box-shadow:0 2px 6px rgba(47,125,255,.30); }.bz-chip.bz-yes:hover{ background:#4b8fff; }.bz-chip.bz-no{ background:#eceff4; color:#111; border-color:#d7dbe2; }.bz-chip.bz-no:hover{ background:#e6ebf3; }/* Inline options inside dark bubble */
.bz-inline-option{
  background:rgba(255,255,255,0.12);
  color:#fff;
  border:1px solid rgba(255,255,255,0.20);
  border-radius:12px; padding:4px 12px; font-size:.95em; line-height:1.3; cursor:pointer;
  transition:background .2s ease, border-color .2s ease;
}.bz-inline-option:hover{ background:rgba(255,255,255,0.20); border-color:rgba(255,255,255,0.30); }.bz-inline-option[disabled]{ opacity:.55; cursor:default; }.bz-msg.bot .bz-inline-option{ color:inherit; }/* ===========================
   Footer (simple black bar)
   =========================== */
.bz-footer{
  position:fixed; left:0; right:0; bottom:0;
  background:#000; color:#fff; height:var(--footer-h);
  display:flex; align-items:center; justify-content:center; z-index:1005;
  box-shadow:0 -6px 24px rgba(0,0,0,.25);
}.bz-footer__links{ display:flex; gap:36px; align-items:center; flex-wrap:wrap; padding:0 16px; }.bz-footer__links a{ color:#fff; text-decoration:none; font-weight:600; font-size:14px; opacity:.92; }.bz-footer__links a:hover{ opacity:1; text-decoration:underline; }/* ===========================
   WPBakery wrapper neutralizer
   =========================== */
/* ===== WPBakery wrapper neutralizer for Bizipy ===== */
:is(.wpb_text_column, .wpb_wrapper, .vc_row, .vc_column_container, .vc_column-inner):has(#bizipy-assistant-root), :is(.wpb_text_column, .wpb_wrapper, .vc_row, .vc_column_container, .vc_column-inner):has(#bizipy-scope){
  background: transparent !important;
  box-shadow: none !important;
}#bizipy-assistant-root{ display:block; }.wpb_text_column > .wpb_wrapper > p{ margin:0; }/* ===========================
   Desktop
   =========================== */
@media (min-width:1024px){
  #bizipy-scope{
    position:fixed;
    top:var(--frame-y);
    bottom:calc(var(--footer-h) + 14px);
    left:50%;
    width:calc(100svw - (2 * var(--frame-x)));
    transform:translateX(-50%);
/* background: transparent; */  /* disabled */
    background: transparent;
    
    
    overflow:hidden;
    box-sizing:border-box;
    padding:56px 44px 44px;
  }
  .bz-header{ position:relative; top:var(--logo-nudge); margin-bottom:calc(-1 * var(--logo-nudge)); }
  .bz-dock{ width:100%; padding-inline:0; box-sizing:border-box; }
  .bz-field{ width:min(100%, 900px); max-width:900px; }
}

/* ===========================
   Mobile (<=600px)
   =========================== */
@media (max-width:600px){

  /* mobile tokens in one place */
  .bz-scope{
    --logo-mobile: 100px;              /* adjust as you like */
    --card-gap-x: 8px;                 /* horizontal */
    --card-gap-y: 2px;                 /* vertical */
    --tile: clamp(64px, 22vw, 84px);   /* square tile size */
    --label-h: 15px;                   /* smaller = tighter rows */
    --bubble-h-mobile: 34svh;           /* scroller height cap */
    --chat-bottom-cushion: 32px;       /* small/default */
    --chat-bottom-cushion-expanded: 88px; /* expanded */
  
    --bubble-default-h-mobile: 34svh;      /* default open on phones (override) */
    --bubble-h-mobile-expanded: 90svh;     /* expanded on phones (override) */}

  /* spacing + controls */
  .bz-scroll-area{ padding:14px 28px 14px 10px; }
  .bz-actions{ right:10px; gap:4px; }
  .bz-act-btn{ width:26px; height:26px; border-radius:7px; }
  .bz-field{ padding:8px 12px; }
  .bz-input{ font-size:16px; }
  .bz-mic{ width:36px; height:36px; }

  /* mobile logo */
  .bz-logo{
    max-width: var(--logo-mobile);
    width: auto;
    height: auto;
  }

  /* mobile grid */
  .bz-grid{
    grid-template-columns: repeat(4, minmax(0,1fr));
    justify-items: center;
    column-gap: var(--card-gap-x);
    row-gap: var(--card-gap-y);
    grid-auto-rows: calc(var(--tile) + var(--label-h) + 2px);
    padding: 4px 10px 16px;
  }
  .bz-card{
    width: var(--tile);
    height: calc(var(--tile) + var(--label-h));
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    min-width: 0;
    gap: 2px;
  }
  .bz-card .tile{ width:100%; aspect-ratio:1/1; border-radius:10px; }
  .bz-label{
    width:100%; height:var(--label-h);
    font-size:11px; line-height:1.2; text-align:center;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
    overflow:hidden; margin-top:0;
  }

  /* bubble placement (mobile only) */
  .bz-answer{
    position: fixed;
    left: 50%;
    transform: translateX(calc(-50% + var(--bubble-nudge-x, 0px)));
    bottom: calc(var(--bz-dock-height, 70px) + 0px);
    width: min(92%, 720px);
    border-radius: 14px;
    margin: 0;
    max-height: none;                 /* container not the cap */
    overflow: hidden;                 /* scroller handles overflow */
  }
/* Default-open bubble height (phones) */
.bz-answer .bz-scroll-area{
  min-height: var(--bubble-default-h-mobile) !important;
  max-height: var(--bubble-default-h-mobile) !important;
  padding: 14px 41px var(--chat-bottom-cushion, 32px) 12px;
  scroll-padding-bottom: var(--chat-bottom-cushion, 32px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box;
  overflow-wrap: anywhere;
  word-break: break-word;
  transition: max-height .25s ease;
}

  /* Mobile Dock: full width + safe area pin */
  .bz-dock{
    position: fixed;
    left: 0; right: 0; margin: 0 auto;
    width: 100% !important;                 /* edge-to-edge on phones */
    bottom: max(12px, env(safe-area-inset-bottom));
    transform: none !important;
    z-index: 1003;
    display: block;
  }
  .bz-dock .bz-field{ width:100%; box-sizing:border-box; }

  /* kill the global logo nudge on phones (prevents top gap) */
  .bz-header{
    top: 0 !important;
    margin: 10px 0 12px !important;
  }
}

/* ===========================
   Utilities
   =========================== */
.bz-rail, .bz-rail-btn{ display:none; }/* legacy rail hidden */
body.admin-bar .bz-answer{ margin-top:44px; }/* avoid WP admin bar overlap */

/* Fix: kill accidental reflections & paint glitches on mobile dock */
@media (max-width:600px){
  .bz-dock,
  .bz-field,
  .bz-btn,
  .bz-mic {
    -webkit-box-reflect: none !important; /* or: unset/initial */
    backface-visibility: hidden;
    transform: translateZ(0); /* avoid ghosting during scroll */
  }
}/* ==== Dock (consolidated, surgical) ==== */
.bz-field{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  background:#3c3c3c;
  color:#fff;
  border:1px solid transparent;
  border-radius:16px;        /* match bubble radius */
  box-shadow:0 2px 6px rgba(0,0,0,.25);
}.bz-field.focus{
  border-color:var(--blue);
  box-shadow:0 0 0 2px rgba(26,115,232,.25);
}/* Input lives in same bar (no white box) */
.bz-input{
  flex:1;
  min-width:0;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  outline:none !important;
  padding:0 !important;
  margin:0 !important;
  text-indent:0 !important;
  color:#fff !important;
  font-size:18px;
  font-weight:400;
          /* use custom caret */
}.bz-input::placeholder{ color:rgba(255,255,255,.88); }/* Caret: inside the flow, always blinking */
.bz-add:hover{ background:rgba(255,255,255,.08); }/* Cancel X: appears only when typing */
.bz-cancel{ border:none !important; 
  width:32px; height:32px;
  display:none; place-items:center;
  margin-left:4px;
  background:transparent;
              /* ✅ removes grey frame */
  color:#fff;
  font-size:18px;
  font-weight:400;
  cursor:pointer;
}/* Mic: red circular on right */
.bz-mic{
  width:40px; height:40px;
  border-radius:50%;
  border:none; background:#e83e35;
  margin-left:6px;
  box-shadow:0 2px 6px rgba(0,0,0,.25);
}.bz-mic svg{ stroke:#fff; }/* Mobile: hide Let's Go button (mic only) */
@media (max-width:600px){ .bz-btn{ display:none; } }/* Desktop: keep it, softer corners */
@media (min-width:601px){ .bz-btn{ border-radius:12px; } }.bz-add{ appearance:none; -webkit-appearance:none; background:transparent !important; border:none !important; color:#fff; font-size:28px; font-weight:400; line-height:1; width:34px; height:34px; display:grid; place-items:center; cursor:pointer; }/* Mobile-only pseudo caret when input is not focused and placeholder is showing */
@media (max-width:600px){
  .bz-field{ position:relative; }
  .bz-field:not(.focus) .bz-input:placeholder-shown::before,
  .bz-field:not(.focus)::before{
    content:"";
    position:absolute;
    /* left = field padding-left (10px) + .bz-add width (34px) + gap between (8px) */
    left: calc(10px + 34px + 8px);
    top: 50%;
    transform: translateY(-50%);
    width:2px; height:1.4em;
    background:#fff;
    border-radius:2px;
    animation:bzBlink 1s steps(1,end) infinite;
    opacity:1;
    pointer-events:none;
  }
  @keyframes bzBlink{ 0%,100%{opacity:1;} 50%{opacity:0;} }
}/* === Desktop: place dock below cards grid === */
@media (min-width:1024px){
  #bizipy-scope {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .bz-grid {
    order: 1; /* grid first */
  }
  .bz-dock {
    order: 2; /* dock below grid */
    margin-top: 40px; /* spacing between grid and dock */
  }
}/* === Desktop: force parent flex when grid & dock are siblings (robust) === */
@media (min-width:1024px){
  /* If #bizipy-scope is not the direct parent, promote the nearest wrapper that has both */
  :is(#bizipy-scope, .bz-scope, #bizipy-assistant, #bizipy-assistant-root):has(.bz-grid):has(.bz-dock){
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:0;
  }
  /* Explicit ordering so dock comes after the grid */
  .bz-grid{ order: 10 !important; }
  .bz-dock{
    order: 20 !important;
    position: relative !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    transform: translateX(var(--dock-nudge-x)) !important;
    margin-top: 40px !important;
    margin-bottom: 0 !important;
    width: min(720px, 92vw) !important; /* widened to match bubble */
  }
}/* === Desktop: lower grid + dock together to align visually with red line === */
@media (min-width:1024px){
  #bizipy-scope {
    padding-top: 80px !important; /* lowers the whole content block */
  }
  .bz-grid {
    margin-top: 40px !important; /* space between logo and grid */
  }
  .bz-dock {
    margin-top: 60px !important; /* more breathing room under grid */
  }
}/* === Desktop: maintain smaller card size after lowering === */
@media (min-width:1024px){
  .bz-card {
    width: 110px !important;
    height: 126px !important;
  }
  .bz-grid {
    grid-template-columns: repeat(5, 110px) !important;
    column-gap: 8px !important;
    row-gap: 14px !important;
  }
}/* === Desktop: bring grid slightly closer to dock === */
@media (min-width:1024px){
  .bz-dock {
    margin-top: 30px !important; /* reduced from 60px */
  }
}/* === Desktop: lower grid and dock slightly (~20px each) === */
@media (min-width:1024px){
  .bz-grid {
    margin-top: 60px !important; /* was 40px */
  }
  .bz-dock {
    margin-top: 60px !important; /* was 40px */
  }
}/* === Desktop: lower grid and dock slightly more (~30px each) === */
@media (min-width:1024px){
  .bz-grid {
    margin-top: 90px !important; /* was 60px */
  }
  .bz-dock {
    margin-top: 90px !important; /* was 60px */
  }
}/* === Desktop: bring cards slightly closer to dock (~+20px lower) === */
@media (min-width:1024px){
  .bz-grid {
    margin-top: 110px !important; /* was 90px */
  }
}/* === Desktop: bring the dock up slightly (reduce gap ~20px) === */
@media (min-width:1024px){
  .bz-dock{
    margin-top: 30px !important; /* was 90px */
  }
}/* === Desktop: bring dock up about 30px more === */
@media (min-width:1024px){
  .bz-dock{
    margin-top: 30px !important; /* was 70px */
  }
}/* === Desktop: make search history dropdown open upward === */
@media (min-width:1024px){
  .bz-history {
    top: auto !important;
    bottom: 110% !important; /* opens upward */
  }
}/* === Desktop: raise logo about 60px higher === */
@media (min-width:1024px){
  .bz-header {
    margin-top: -60px !important; /* lift logo upward */
  }
}/* === Desktop: FLOW FIX to prevent clipping/cut-off (Safari/zoom) ===
   - Stop using fixed container which clips top/bottom when we add offsets
   - Let content flow naturally and scroll; ensure enough bottom padding
   - Keep all previous spacing but make overflow visible
*/
@media (min-width:1024px){
  #bizipy-scope{
    position: static !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    max-width: 980px !important;
    margin: 0 auto !important;
    transform: none !important;
    overflow: visible !important;
    padding-left: 44px !important;
    padding-right: 44px !important;
    padding-bottom: 160px !important; /* ensure dock never gets cut off */
  }
  /* Keep our flex ordering parent robust even after switching to static */
  :is(#bizipy-scope, .bz-scope, #bizipy-assistant, #bizipy-assistant-root):has(.bz-grid):has(.bz-dock){
    display:flex;
    flex-direction:column;
    align-items:center;
  }
  /* Keep header lift but avoid clipping due to overflow hidden */
  .bz-header{ position: relative; z-index: 1; }
}/* ===========================================================
   Desktop-only: Bubble sits 2px above the dock on activation
   - Smooth slide using transition on `bottom`
   - No mobile impact
   - Works with common "open" states: .active, .open, .is-open, .bz-open
   =========================================================== */
@media (min-width:1024px){
  
  /* When bubble is open/active, position it just above the dock */
  .bz-answer.active,
  .bz-answer.open,
  .bz-answer.is-open,
  .bz-answer.bz-open{
    bottom: calc(var(--bz-dock-height, 64px) + 2px) !important;
  }

.bz-grid{
  transform: translateX(var(--dock-nudge-x));
}

/* Desktop: keep bubble overlayed so it doesn't push layout on load */
.bz-answer{
  position: fixed !important;
  left: 50% !important;
  transform: translateX(calc(-50% + var(--bubble-nudge-x, 0px))) !important;
  bottom: calc(var(--bz-dock-height, 64px) + 2px) !important; /* sits above dock */
  margin: 0 !important;
  z-index: 1004 !important;
  transition: bottom .25s ease;
}
.bz-answer.active,
.bz-answer.open,
.bz-answer.is-open,
.bz-answer.bz-open{
  bottom: calc(var(--bz-dock-height, 64px) + 2px) !important;
}

.bz-answer .bz-scroll-area{
  overflow-y: auto;
  max-height: var(--bubble-mh-desktop);
  padding-bottom: var(--chat-bottom-cushion, 56px);
  scroll-padding-bottom: var(--chat-bottom-cushion, 56px);
  -webkit-overflow-scrolling: touch;
}
}/* === Vertical-only expand toggle (desktop) === */
@media (min-width:1024px){
  .bz-answer.bz-vertmax .bz-scroll-area{
    max-height: calc(100svh - var(--footer-h, 54px) - 120px) !important;
    padding-bottom: var(--chat-bottom-cushion-expanded, var(--chat-bottom-cushion, 56px));
    scroll-padding-bottom: var(--chat-bottom-cushion-expanded, var(--chat-bottom-cushion, 56px));
    min-height: calc(100svh - var(--footer-h, 54px) - 120px) !important;
  }
}

@media (min-width:1024px){
  /* Guard: ensure expand button shows on desktop */
  .bz-expand-btn{ display:inline-grid; }
}

@media (min-width:1024px){
  /* Neutralize the global cap so expand can grow upward */
  .bz-answer{
    max-height: none !important;
    overflow: visible !important; /* scroller handles its own overflow */
  }
}


/* === Desktop: allow clicks to reach the grid except where the bubble needs them === */
@media (min-width:1024px){
  .bz-answer{
    pointer-events: none !important; /* clicks fall through the bubble background */
  }
  .bz-answer .bz-scroll-area,
  .bz-answer .bz-actions{
    pointer-events: auto !important; /* keep scrolling + action buttons usable */
  }
}


/* Bubble clipping + scroller box model to prevent bottom bleed */
.bz-answer{ overflow: hidden; }
.bz-answer .bz-scroll-area{ box-sizing: border-box; 
}

@media (min-width:1024px){
  /* Default (small) bubble bottom cushion */
  .bz-answer .bz-scroll-area{
    padding-bottom: var(--chat-bottom-cushion, 56px) !important;
    scroll-padding-bottom: var(--chat-bottom-cushion, 56px) !important;
  }
  /* Expanded bubble bottom cushion */
  .bz-answer.bz-vertmax .bz-scroll-area{
    padding-bottom: var(--chat-bottom-cushion-expanded, var(--chat-bottom-cushion, 56px)) !important;
    scroll-padding-bottom: var(--chat-bottom-cushion-expanded, var(--chat-bottom-cushion, 56px)) !important;
  }
}

@media (min-width:1024px){
  /* default (small) */
  .bz-answer .bz-scroll-area::after{
    content:"";
    display:block;
    height: var(--chat-bottom-cushion, 56px);
  }
  /* expanded */
  .bz-answer.bz-vertmax .bz-scroll-area::after{
    height: var(--chat-bottom-cushion-expanded, var(--chat-bottom-cushion, 56px));
  }
}


/* === Chat message layout (avatars + text) — enforced override === */
.bz-answer .bz-msg{
  display:flex;
  align-items:flex-start;
  gap:8px;
  margin:6px 0;
  line-height:1.5;
  font-size:15px;
}
.bz-answer .bz-msg > span:last-child{
  flex:1 1 auto;
  min-width:0;              /* allow wrapping */
  word-break:break-word;
}
.bz-answer .bz-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:26px;
  height:26px;
  border-radius:50%;
  font-weight:700;
  font-size:13px;
  flex-shrink:0;
  margin-right:4px;         /* space between circle and text */
}

/* Position avatars near the bubble edge */
@media (min-width:1024px){
  .bz-answer .bz-msg.user{ margin-left:auto; margin-right: 4px; }
  .bz-answer .bz-msg.bot { margin-right:auto; margin-left: 4px; }
}

@media (min-width:1024px){
  /* BOT (B) — balanced margins */
  .bz-answer .bz-msg.bot { margin-left: 0 !important; margin-right: auto !important; }

  /* USER (U) — balanced margins */
  .bz-answer .bz-msg.user { margin-left: auto !important; margin-right: 0 !important; }
}


/* Optional: a tad more inner text room without changing bubble width */
.bz-answer .bz-msg span:last-child{
  padding-right: 4px; /* nudge text away from scrollbar/edge */
}

/* Inline options — dotted underline, same color as question text */
.bz-answer .bz-inline-option{
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;

  color: inherit !important;
  font-weight: 500;
  padding: 0 3px !important;
  margin: 0 3px !important;

  text-decoration-line: underline;
  text-decoration-style: dotted;
  text-decoration-color: #ffffff;                 /* bright white by default */
  text-underline-offset: 3px;
  transition: color .2s ease, text-decoration-color .2s ease, opacity .2s ease;
}

.bz-answer .bz-inline-option:hover{
  color: rgba(255,255,255,0.6) !important;       /* dim text on hover */
  text-decoration-color: rgba(255,255,255,0.4);  /* softer dotted line on hover */
}

/* ✅ Removes the stray dash/connector that appeared before inline options */
.bz-answer .bz-inline-option::before {
  content: none;
}

/* ==== Inline options punctuation/spacing (surgical) ==== */
/* Remove side margins that created extra gaps before/after labels */
.bz-msg.bot .bz-inline-option{
  margin: 0 !important;
  padding-left: 2px !important;
  padding-right: 2px !important; /* ← was 0 */
}

@media (max-width:600px){
  /* Make the dock full width on mobile */
  .bz-dock{
    width: 100% !important;
    left: 0 !important;
    right: 0 !important;
    margin: 0 auto !important;
    transform: none !important;
  } /* ← this closing brace was missing */

  /* kill the global logo nudge on phones */
  .bz-header{
    top: 0 !important;
    margin: 10px 0 12px !important;
  }
} /* ← this closing brace for the media query was also missing */


/* === Mobile viewport bubble (injected) === */

@media (max-width:600px){
  /* MOBILE-ONLY: bubble placement above dock */
  .bz-answer{
  position:fixed; left:50%; transform:translateX(-50%);
  bottom: calc(var(--bz-dock-height, 70px) + 0px);
  width:min(92%, 720px);
  border-radius:14px; margin:0;
  max-height: none;     /* let scroller be the cap */
  overflow: hidden;     /* scroller handles overflow */
}

  .bz-answer.bz-vertmax .bz-scroll-area,
  .bz-answer.size-expanded .bz-scroll-area{
    min-height: var(--bubble-h-mobile-expanded) !important;
    max-height: var(--bubble-h-mobile-expanded) !important;
    padding-bottom: var(--chat-bottom-cushion-expanded, 88px) !important;
    scroll-padding-bottom: var(--chat-bottom-cushion-expanded, 88px) !important;
  }

  .bz-expand-btn{ display:inline-grid; }

}

/* ===========================================================
   Desktop default bubble height (viewport-based)
   Opens ~24svh (bounded), independent from mobile.
   =========================================================== */
@media (min-width:1024px){
  .bz-scope{
    /* Adjust these bounds if you want a different feel */
    --bubble-mh-desktop: clamp(200px, 24svh, 360px);
  }
  /* Ensure desktop default open respects the token */
  .bz-answer .bz-scroll-area{
    max-height: var(--bubble-mh-desktop);
    min-height: var(--bubble-mh-desktop);
  }
}

/* Desktop: lock page scroll while chat is open */
@media (min-width:1024px){
  html.bz-scroll-locked, body.bz-scroll-locked { 
    overflow: hidden !important;
    overscroll-behavior: contain !important;
  }

  /* The bubble’s inner scroller remains scrollable */
  .bz-answer .bz-scroll-area{
    overscroll-behavior: contain;
  }
}


/* Tight inline options so commas hug the previous word */
.bz-msg.bot .bz-inline-option{
  margin: 0 !important;             /* no external gap */
  padding-left: 2px !important;      /* tiny left breathing room */
  padding-right: 0 !important;       /* zero space before inserted comma */
}


@media (min-width:1024px){
  /* Ensure comfortable right padding inside bubble on desktop */
  .bz-answer .bz-scroll-area{ padding-right: 40px !important; }
}
