#nutribiolite-chat-v2{
  --nb-green:#94c019;
  --nb-dark:#003311;
  --nb-bg:#fbf9f6;
  --nb-white:#ffffff;
  position:fixed;
  right:20px;
  bottom:20px;
  z-index:2147483647;
  font-family:Poppins,Arial,sans-serif;
  color:var(--nb-dark);
  line-height:1.4;
}

#nutribiolite-chat-v2,
#nutribiolite-chat-v2 *{
  box-sizing:border-box;
}

.nbv2-toggle{
  width:60px !important;
  height:60px !important;
  min-width:60px !important;
  min-height:60px !important;
  max-width:60px !important;
  max-height:60px !important;
  aspect-ratio:1 / 1 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:9999px !important;
  background:var(--nb-green) !important;
  background-image:none !important;
  color:var(--nb-dark) !important;
  box-shadow:0 8px 24px rgba(0,51,17,.24) !important;
  cursor:pointer;
  appearance:none !important;
  -webkit-appearance:none !important;
  overflow:hidden !important;
  line-height:0 !important;
  font-size:0 !important;
  transform:none;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
}

.nbv2-toggle:hover{
  transform:translateY(-2px);
  box-shadow:0 11px 28px rgba(0,51,17,.30);
}

.nbv2-toggle:focus-visible,
.nbv2-close:focus-visible,
.nbv2-send:focus-visible{
  outline:3px solid rgba(148,192,25,.36);
  outline-offset:2px;
}

.nbv2-chat-icon{
  width:29px;
  height:29px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.nbv2-window{
  position:fixed;
  right:20px;
  bottom:92px;
  width:410px;
  height:650px;
  max-width:calc(100vw - 40px);
  max-height:calc(100dvh - 112px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  background:var(--nb-white);
  border:1px solid rgba(0,51,17,.12);
  border-radius:16px;
  box-shadow:0 18px 50px rgba(0,51,17,.20),0 4px 14px rgba(0,51,17,.10);
  overscroll-behavior:contain;
}

.nbv2-window[hidden]{
  display:none!important;
}

.nbv2-header{
  position:relative;
  z-index:5;
  flex:0 0 auto;
  min-height:76px;
  padding:15px 14px 15px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  background:var(--nb-green);
  color:var(--nb-dark);
  border-bottom:0;
}

.nbv2-header-copy{
  min-width:0;
}

.nbv2-header strong{
  display:block;
  margin:0;
  font-family:Poppins,Arial,sans-serif;
  font-size:19px;
  line-height:1.25;
  font-weight:600;
  color:var(--nb-dark);
}

.nbv2-header small{
  display:block;
  margin-top:3px;
  font-family:Poppins,Arial,sans-serif;
  font-size:12.5px;
  line-height:1.35;
  font-weight:400;
  color:var(--nb-dark);
  opacity:.82;
}

.nbv2-close{
  flex:0 0 42px;
  width:42px;
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0;
  padding:0;
  border:0;
  border-radius:50%;
  background:transparent;
  color:var(--nb-dark);
  cursor:pointer;
  appearance:none;
  -webkit-appearance:none;
}

.nbv2-close:hover{
  background:rgba(0,51,17,.08);
}

.nbv2-close span{
  display:block;
  margin-top:-3px;
  font-family:Arial,sans-serif;
  font-size:31px;
  line-height:1;
  font-weight:300;
}

.nbv2-mode{
  flex:0 0 34px;
  height:34px;
  padding:0 16px;
  display:flex;
  gap:8px;
  align-items:center;
  background:#f7f8f3;
  border-bottom:1px solid #e5e9df;
  color:var(--nb-dark);
  font-size:12px;
}

.nbv2-mode[hidden]{
  display:none !important;
}

.nbv2-dot{
  width:8px;
  height:8px;
  flex:0 0 8px;
  border-radius:50%;
  background:var(--nb-green);
}

.nbv2-mode.human .nbv2-dot{
  background:var(--nb-dark);
}

.nbv2-messages{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  padding:18px;
  background:var(--nb-bg);
  scrollbar-gutter:stable;
}

.nbv2-row{
  display:flex;
  margin:0 0 11px;
}

.nbv2-row.customer{
  justify-content:flex-end;
}

.nbv2-row.ai,
.nbv2-row.human{
  justify-content:flex-start;
}

.nbv2-bubble{
  max-width:82%;
  padding:11px 13px;
  border:1px solid #e6e3dd;
  border-radius:14px;
  background:#fff;
  color:var(--nb-dark);
  white-space:pre-wrap;
  overflow-wrap:anywhere;
  line-height:1.48;
  font-family:Poppins,Arial,sans-serif;
  font-size:14px;
}

.nbv2-row.customer .nbv2-bubble{
  background:var(--nb-dark);
  color:#fff;
  border-color:var(--nb-dark);
}

.nbv2-row.human .nbv2-bubble{
  border-color:var(--nb-green);
  box-shadow:inset 3px 0 0 var(--nb-green);
}

.nbv2-bubble a.nbv2-link{
  color:#006b45;
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:2px;
  font-weight:600;
  overflow-wrap:anywhere;
}

.nbv2-row.customer .nbv2-bubble a.nbv2-link{
  color:#fff;
}

.nbv2-bubble a.nbv2-link:hover,
.nbv2-bubble a.nbv2-link:focus{
  text-decoration-thickness:2px;
}


.nbv2-typing-row{
  margin-bottom:11px;
}

.nbv2-typing-bubble{
  min-width:54px;
  padding:13px 15px;
}

.nbv2-typing-dots{
  display:flex;
  align-items:center;
  gap:5px;
  height:12px;
}

.nbv2-typing-dots span{
  width:7px;
  height:7px;
  display:block;
  border-radius:50%;
  background:rgba(0,51,17,.55);
  animation:nbv2-typing-bounce 1.2s infinite ease-in-out;
}

.nbv2-typing-dots span:nth-child(2){
  animation-delay:.16s;
}

.nbv2-typing-dots span:nth-child(3){
  animation-delay:.32s;
}

@keyframes nbv2-typing-bounce{
  0%,
  60%,
  100%{
    transform:translateY(0);
    opacity:.45;
  }

  30%{
    transform:translateY(-4px);
    opacity:1;
  }
}

@media (prefers-reduced-motion:reduce){
  .nbv2-typing-dots span{
    animation:none;
    opacity:.7;
  }
}

.nbv2-form{
  flex:0 0 auto;
  min-height:68px;
  display:flex;
  align-items:flex-end;
  gap:9px;
  padding:11px 12px;
  padding-bottom:max(11px,env(safe-area-inset-bottom));
  background:#fff;
  border-top:1px solid #e8e5df;
}

.nbv2-input{
  flex:1 1 auto;
  width:100%;
  min-width:0;
  min-height:44px;
  max-height:110px;
  resize:none;
  padding:11px 12px;
  border:1px solid #d9d5ce;
  border-radius:11px;
  background:#fff;
  color:var(--nb-dark);
  font-family:Poppins,Arial,sans-serif;
  font-size:14px;
  line-height:1.4;
  outline:none;
}

.nbv2-input:focus{
  border-color:var(--nb-green);
  box-shadow:0 0 0 3px rgba(148,192,25,.14);
}

.nbv2-send{
  flex:0 0 auto;
  height:44px;
  padding:0 16px;
  border:0;
  border-radius:10px;
  background:var(--nb-green);
  color:var(--nb-dark);
  font-family:Poppins,Arial,sans-serif;
  font-size:13px;
  font-weight:600;
  cursor:pointer;
}

.nbv2-send:disabled{
  opacity:.55;
  cursor:wait;
}

/*
 * MOBILE:
 * The chat is pinned inside the VISUAL viewport, not 100vh.
 * The top safe-area and header are always visible, including iPhone notch
 * and browsers whose URL bar changes the viewport height.
 */
@media (max-width:520px){
  #nutribiolite-chat-v2{
    right:max(12px,env(safe-area-inset-right));
    bottom:max(12px,env(safe-area-inset-bottom));
  }

  .nbv2-toggle{
    width:60px !important;
    height:60px !important;
    min-width:60px !important;
    min-height:60px !important;
    max-width:60px !important;
    max-height:60px !important;
    border-radius:9999px !important;
  }

  .nbv2-window{
    position:fixed;
    top:max(8px,env(safe-area-inset-top));
    right:max(8px,env(safe-area-inset-right));
    bottom:max(8px,env(safe-area-inset-bottom));
    left:max(8px,env(safe-area-inset-left));
    width:auto;
    height:auto;
    max-width:none;
    max-height:none;
    border-radius:14px;
  }

  .nbv2-header{
    position:sticky;
    top:0;
    z-index:10;
    min-height:68px;
    padding:12px 8px 12px 15px;
  }

  .nbv2-header strong{
    font-size:18px;
  }

  .nbv2-header small{
    font-size:12px;
  }

  .nbv2-close{
    width:46px;
    height:46px;
    flex-basis:46px;
  }

  .nbv2-messages{
    padding:14px;
  }

  .nbv2-bubble{
    max-width:90%;
    font-size:14px;
  }

  .nbv2-form{
    padding-left:9px;
    padding-right:9px;
  }

  .nbv2-send{
    padding:0 12px;
  }

  html.nutribiolite-chat-v2-open{
    overscroll-behavior:none;
  }
}

/* Extra-small phones: keep header and composer usable without overflow. */
@media (max-width:360px){
  .nbv2-window{
    top:max(5px,env(safe-area-inset-top));
    right:max(5px,env(safe-area-inset-right));
    bottom:max(5px,env(safe-area-inset-bottom));
    left:max(5px,env(safe-area-inset-left));
  }

  .nbv2-header{
    min-height:64px;
  }

  .nbv2-form{
    gap:6px;
  }

  .nbv2-send{
    padding:0 10px;
    font-size:12px;
  }
}