:root {
  --gb-primary: #5b8cff;
  --gb-radius: 16px;
  --gb-shadow: 0 10px 30px rgba(0,0,0,0.15);
  --gb-font-size: 14px;
  --gb-launcher-bg: var(--gb-primary);
  --gb-launcher-size: 56px;
  --gb-send-bg: var(--gb-primary);
}

.gb-right { right: 20px; }
.gb-left  { left: 20px; }

.gb-launcher {
  position: fixed;
  bottom: 20px;
  z-index: 99990;
}
.gb-launcher .gb-button {
  width: var(--gb-launcher-size); height: var(--gb-launcher-size);
  border-radius: 50%;
  border: none;
  background: var(--gb-launcher-bg);
  color: #fff;
  box-shadow: var(--gb-shadow);
  cursor: pointer;
  font-size: calc(var(--gb-launcher-size) * 0.4);
  transition: transform .15s ease;
  display: flex; align-items:center; justify-content:center;
}
.gb-launcher .gb-button:hover { transform: scale(1.05); }
.gb-icon.img {
  width: 70%; height: 70%;
  display:inline-block;
  background-size: cover;
  background-position: center;
  border-radius: 8px;
}
.gb-icon:not(.img) { line-height: 1; }

.gb-panel {
  position: fixed;
  bottom: 92px;
  width: min(360px, calc(100vw - 32px));
  max-height: min(70vh, 560px);
  background: #ffffff;
  border-radius: var(--gb-radius);
  box-shadow: var(--gb-shadow);
  overflow: hidden;
  display: none;
  z-index: 99991;
  font-size: var(--gb-font-size);
}
.gb-panel.open { display: flex; flex-direction: column; }

.gb-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 14px;
  background: linear-gradient(0deg, rgba(0,0,0,0.02), rgba(0,0,0,0.02));
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
.gb-header .gb-title {
  font-weight: 600;
  color: rgba(255,255,255, 0.5);
}
.gb-header .gb-close {
  background: transparent; border: none; font-size: 22px; cursor: pointer; color:rgba(255,255,255,0.5);
}

.gb-messages {
  padding: 14px;
  overflow-y: auto;
  flex: 1;
  background: #f8fafc;
}

.gb-msg { display: flex; margin: 8px 0; }
.gb-msg.gb-user { justify-content: flex-end; }
.gb-msg.gb-bot  { justify-content: flex-start; }

.gb-bubble {
  max-width: 80%;
  padding: 10px 12px;
  border-radius: var(--gb-radius);
  line-height: 1.35;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  word-wrap: break-word;
  white-space: pre-wrap;
}

/* Themes */
.theme-imessage .gb-user .gb-bubble { background: var(--gb-primary); color: #fff; border-bottom-right-radius: 6px; }
.theme-imessage .gb-bot  .gb-bubble { background: #e9eef6; color: #111; border-bottom-left-radius: 6px; }

.theme-whatsapp .gb-user .gb-bubble { background: #d5ffc7; color: #111; }
.theme-whatsapp .gb-bot  .gb-bubble { background: #fff; color: #111; border: 1px solid #e6e6e6; }

.theme-minimal .gb-user .gb-bubble { background: #111; color: #fff; }
.theme-minimal .gb-bot  .gb-bubble { background: #fff; color: #111; border: 1px solid #eee; }

/* Typing indicator */
.gb-typing .gb-bubble { display:flex; gap:4px; align-items:center; }
.gb-typing .dot {
  width: 6px; height: 6px; border-radius:50%;
  background: #999;
  display:inline-block;
  animation: gb-blink 1.2s infinite ease-in-out;
}
.gb-typing .dot:nth-child(2) { animation-delay: 0.15s; }
.gb-typing .dot:nth-child(3) { animation-delay: 0.3s; }
@keyframes gb-blink {
  0%, 80%, 100% { opacity: .2; transform: translateY(0); }
  40% { opacity: 1; transform: translateY(-2px); }
}

/* Input bar */
.gb-inputbar {
  display: flex;
  gap: 8px;
  padding: 10px;
  background: #fff;
  border-top: 1px solid rgba(0,0,0,0.06);
  flex-wrap: wrap;
}
.gb-inputbar .gb-consent {
  font-size: 12px;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-basis: 100%;
  color: rgba(255,255,255,0.5);
}
.gb-inputbar .gb-input {
  flex: 1;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 10px 12px;
  outline: none;
	font-size: 12px !important;
}
.gb-inputbar .gb-send {
  border: none; background: var(--gb-send-bg); color: #fff;
  border-radius: 12px !important;  padding: 10px 12px; cursor:pointer;
}

/* Mobile adjustments */
@media (max-width: 480px) {
  .gb-panel { width: calc(100vw - 20px); bottom: 84px; }
  .gb-launcher .gb-button { width: var(--gb-launcher-size); height: var(--gb-launcher-size); }
}



.theme-glass .gb-messages {
  background: linear-gradient(135deg, rgba(255,255,255,0.35), rgba(255,255,255,0.15));
  backdrop-filter: blur(14px) saturate(120%);
  -webkit-backdrop-filter: blur(14px) saturate(120%);
}
.theme-glass .gb-user .gb-bubble {
  background: linear-gradient(180deg, rgba(255,255,255,0.85), rgba(255,255,255,0.65));
  color: #0b1220;
  border: 1px solid rgba(255,255,255,0.6);
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
}
.theme-glass .gb-bot .gb-bubble {
  background: linear-gradient(180deg, rgba(17, 25, 40, 0.55), rgba(17, 25, 40, 0.35));
  color: #e6eefc;
  border: 1px solid rgba(255,255,255,0.25);
  box-shadow: 0 8px 24px rgba(0,0,0,0.1);
}
.theme-glass .gb-header {
  background: linear-gradient(135deg, rgba(255,255,255,0.6), rgba(255,255,255,0.3));
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(255,255,255,0.5);
}
.theme-glass .gb-inputbar {
  background: rgba(255,255,255,0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-top: 1px solid rgba(255,255,255,0.4);
}
.theme-glass .gb-inputbar .gb-input {
  background: rgba(255,255,255,0.8);
  border: 1px solid rgba(0,0,0,0.06);
}
.theme-glass .gb-inputbar .gb-send {
  background: var(--gb-primary);
}

/* === PP Chat Bot · Glass (liquid frosted) theme === */
.gb-panel.theme-glass {
  background: linear-gradient(160deg, rgba(19,23,31,.75), rgba(19,23,31,.55));
  border: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(20px) saturate(145%);
  -webkit-backdrop-filter: blur(20px) saturate(145%);
  border-radius: 22px;
  box-shadow: 0 30px 60px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.06);
}

.theme-glass .gb-header {
  background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04));
  border-bottom: 1px solid rgba(255,255,255,.10);
}

.theme-glass .gb-messages {
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
}

.theme-glass .gb-bot .gb-bubble {
  background: linear-gradient(145deg, rgba(22,28,38,.70), rgba(22,28,38,.45));
  color: #e9f2ff;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 8px 24px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.05);
}

.theme-glass .gb-user .gb-bubble {
  background: linear-gradient(145deg, var(--gb-primary), rgba(75,216,255,.85));
  color: #0b1220;
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 10px 24px rgba(0,180,220,.25);
}

.theme-glass .gb-inputbar {
  background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.05));
  border-top: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.theme-glass .gb-inputbar .gb-input {
  background: rgba(255,255,255,.80);
  border: 1px solid rgba(0,0,0,.08);
  color: #0b1220;
}

.theme-glass .gb-inputbar .gb-send {
  background: linear-gradient(180deg, var(--gb-primary), rgba(75,216,255,.90));
  border: 1px solid rgba(255,255,255,.25);
  color: #0b1220;
  font-weight: 600;
}

/* Glassy launcher puck */
.gb-panel.theme-glass ~ .gb-launcher .gb-button,
.gb-launcher.theme-glass .gb-button {
  background: linear-gradient(145deg, rgba(255,255,255,.18), rgba(255,255,255,.10));
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  color: #e8f7ff;
  box-shadow: 0 20px 40px rgba(0,0,0,.35), 0 0 0 3px rgba(75,216,255,.15);
}