/* =========================================================
   TNB GENCO — "Genco Assistant" chat widget  (site-6 "TESSERA" skin)
   Self-contained; all classes namespaced .gcb-*
   Mirrors styles.css: Outfit / Inter, hexagon launcher, brand-blue → cyan
   ramps with Energy Orange and Eco Green accents.
   Palette drawn from the TNB GENCO Brand Style Guide V4.
   ========================================================= */
.gcb-root{
  --gcb-blue:#005DAA; --gcb-blue-700:#004481; --gcb-blue-500:#1E86E8; --gcb-blue-300:#7FC0F2;
  --gcb-cyan:#21C7E0; --gcb-teal:#0FA5A0;
  --gcb-red:#DE3314; --gcb-red-600:#B62A10;
  --gcb-lime:#C6E36B; --gcb-amber:#F5A623;
  --gcb-navy:#062C57; --gcb-ink:#0C1B2A; --gcb-slate:#3A4A5C; --gcb-mute:#6E7F92;
  --gcb-paper:#F5F8FC; --gcb-white:#fff; --gcb-line:#E2E9F1; --gcb-tint:#E8F3FD;
  --gcb-ramp:linear-gradient(135deg,#21C7E0 0%,#1E86E8 45%,#005DAA 100%);
  --gcb-deep:linear-gradient(140deg,#0A3A6B 0%,#062C57 45%,#1E86E8 125%);
  --gcb-sh:0 50px 100px -28px rgba(6,44,87,.42),0 30px 60px -40px rgba(12,27,42,.5);
  --gcb-ease:cubic-bezier(.2,.75,.25,1);
  --gcb-hex:polygon(25% 0%,75% 0%,100% 50%,75% 100%,25% 100%,0% 50%);
  font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}
.gcb-root *{box-sizing:border-box}
.gcb-root b,.gcb-root strong{font-family:'Outfit','Inter',sans-serif;letter-spacing:-.012em}

/* ---------- Launcher — a hexagonal power cell ---------- */
.gcb-launch{
  position:fixed;right:24px;bottom:24px;z-index:9998;width:70px;height:61px;border:none;padding:0;
  clip-path:var(--gcb-hex);cursor:pointer;background:var(--gcb-ramp);color:#fff;
  display:grid;place-items:center;
  transition:transform .35s var(--gcb-ease),filter .35s var(--gcb-ease);
  animation:gcb-glow 3.2s var(--gcb-ease) infinite;
}
.gcb-launch:hover{transform:translateY(-3px) scale(1.05)}
.gcb-launch:active{transform:scale(.96)}
.gcb-launch::after{
  content:"";position:absolute;inset:0;background:linear-gradient(135deg,#F5A623,#DE3314);
  opacity:0;transition:opacity .4s var(--gcb-ease);
}
.gcb-launch:hover::after{opacity:1}
.gcb-launch svg{position:relative;z-index:1;width:34px;height:34px;transition:opacity .25s,transform .35s var(--gcb-ease)}
.gcb-launch .gcb-ic-close{width:26px;height:26px;position:absolute;opacity:0;transform:rotate(-90deg) scale(.6)}
.gcb-root.open .gcb-launch .gcb-ic-chat{opacity:0;transform:rotate(90deg) scale(.6)}
.gcb-root.open .gcb-launch .gcb-ic-close{opacity:1;transform:none}
.gcb-root.open .gcb-launch{animation:none}
@keyframes gcb-glow{
  0%,100%{filter:drop-shadow(0 14px 26px rgba(0,93,170,.55))}
  50%{filter:drop-shadow(0 18px 34px rgba(33,199,224,.75))}
}
.gcb-launch svg{filter:drop-shadow(0 2px 3px rgba(6,44,87,.34))}
.gcb-badge{position:absolute;top:5px;right:16px;width:15px;height:15px;border-radius:50%;
  background:var(--gcb-red);border:2.5px solid #fff;box-shadow:0 2px 6px rgba(229,67,39,.5);
  animation:gcb-badge-in .5s var(--gcb-ease) both,gcb-badge-beat 2.6s ease-in-out .6s infinite}
@keyframes gcb-badge-in{from{transform:scale(0)}to{transform:scale(1)}}
@keyframes gcb-badge-beat{0%,88%,100%{transform:scale(1)}92%{transform:scale(1.22)}}
.gcb-root.open .gcb-badge{display:none}

/* ---------- Teaser ---------- */
.gcb-teaser{
  position:fixed;right:24px;bottom:98px;z-index:9997;max-width:258px;
  background:#fff;color:var(--gcb-ink);border:1px solid var(--gcb-line);border-radius:12px;
  padding:14px 16px;font-size:14.5px;line-height:1.55;
  box-shadow:0 18px 40px -14px rgba(50,50,93,.3),0 8px 18px -12px rgba(10,37,64,.25);
  opacity:0;transform:translateY(10px) scale(.96);pointer-events:none;transition:all .4s var(--gcb-ease)}
.gcb-teaser::after{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:3px;
  background:var(--gcb-ramp)}
.gcb-teaser.show{opacity:1;transform:none;pointer-events:auto}
.gcb-teaser b{color:var(--gcb-blue);font-weight:700}
.gcb-teaser .gcb-teaser-x{position:absolute;top:-8px;right:-8px;width:22px;height:22px;border-radius:50%;
  background:#fff;border:1px solid var(--gcb-line);color:var(--gcb-mute);cursor:pointer;font-size:14px;
  line-height:1;display:grid;place-items:center;box-shadow:0 2px 8px rgba(10,37,64,.14)}
.gcb-root.open .gcb-teaser{opacity:0;pointer-events:none}

/* ---------- Panel ---------- */
.gcb-panel{
  position:fixed;right:24px;bottom:100px;z-index:9998;width:396px;max-width:calc(100vw - 32px);
  height:min(628px,calc(100vh - 132px));background:var(--gcb-white);border-radius:16px;overflow:hidden;
  box-shadow:var(--gcb-sh);display:flex;flex-direction:column;border:1px solid var(--gcb-line);
  opacity:0;transform:translateY(16px) scale(.98);transform-origin:bottom right;pointer-events:none;
  transition:opacity .34s var(--gcb-ease),transform .34s var(--gcb-ease)}
.gcb-root.open .gcb-panel{opacity:1;transform:none;pointer-events:auto}

/* header — deep blue gradient, display type */
.gcb-head{position:relative;background:var(--gcb-deep);color:#fff;padding:16px 18px;
  display:flex;align-items:center;gap:12px;flex:0 0 auto;overflow:hidden}
.gcb-head::after{content:"";position:absolute;right:-40px;top:-60px;width:180px;height:180px;border-radius:50%;
  background:radial-gradient(circle,rgba(18,194,233,.45),transparent 68%)}
.gcb-head>*{position:relative;z-index:2}
.gcb-avatar{width:42px;height:42px;border-radius:10px;background:#fff;display:grid;place-items:center;
  flex:0 0 auto;box-shadow:0 6px 16px -6px rgba(0,0,0,.5);overflow:hidden}
.gcb-avatar img{width:34px;height:auto;display:block}
.gcb-head-txt{flex:1;min-width:0}
.gcb-head-txt b{display:block;font-family:'Outfit','Inter',sans-serif;font-weight:700;
  font-size:18px;letter-spacing:-.02em;line-height:1.2}
.gcb-head-txt span{display:flex;align-items:center;gap:6px;font-size:12.5px;color:rgba(255,255,255,.78);margin-top:3px}
.gcb-dot{width:7px;height:7px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 3px rgba(74,222,128,.3)}
.gcb-min{background:rgba(255,255,255,.14);border:none;color:#fff;width:32px;height:32px;border-radius:9px;
  cursor:pointer;display:grid;place-items:center;transition:background .2s;flex:0 0 auto}
.gcb-min:hover{background:rgba(255,255,255,.26)}
.gcb-min svg{width:18px;height:18px}

/* body */
.gcb-body{flex:1;overflow-y:auto;padding:18px 16px 8px;background:
  radial-gradient(600px 300px at 100% 0,rgba(15,122,208,.07),transparent 60%),var(--gcb-paper);
  display:flex;flex-direction:column;gap:12px;scroll-behavior:smooth}
.gcb-body::-webkit-scrollbar{width:7px}
.gcb-body::-webkit-scrollbar-thumb{background:#cfdcea;border-radius:6px}

.gcb-msg{display:flex;gap:9px;align-items:flex-end;max-width:100%;animation:gcb-in .4s var(--gcb-ease)}
@keyframes gcb-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.gcb-msg .gcb-mava{width:28px;height:28px;border-radius:8px;flex:0 0 auto;background:var(--gcb-tint);
  display:grid;place-items:center;color:var(--gcb-blue-500)}
.gcb-msg .gcb-mava svg{width:16px;height:16px}
.gcb-bubble{padding:12px 15px;border-radius:14px;font-size:14.5px;line-height:1.6;max-width:82%;word-wrap:break-word}
.gcb-msg.bot .gcb-bubble{background:#fff;border:1px solid var(--gcb-line);color:var(--gcb-ink);
  border-bottom-left-radius:5px;box-shadow:0 2px 5px -1px rgba(50,50,93,.08)}
.gcb-msg.user{flex-direction:row-reverse}
.gcb-msg.user .gcb-bubble{background:var(--gcb-ramp);color:#fff;border-bottom-right-radius:5px;
  box-shadow:0 6px 14px -8px rgba(0,93,171,.7)}
.gcb-msg.user .gcb-mava{display:none}
.gcb-bubble p{margin:0 0 7px}.gcb-bubble p:last-child{margin:0}
.gcb-bubble strong{font-weight:700}
.gcb-bubble ul{margin:5px 0;padding-left:18px}.gcb-bubble li{margin:2px 0}
.gcb-bubble a{display:inline-flex;align-items:center;gap:5px;margin:3px 4px 3px 0;padding:6px 12px;
  background:var(--gcb-tint);color:var(--gcb-blue-700);border:1px solid #cfe6fa;border-radius:100px;
  font-weight:600;font-size:13px;text-decoration:none;transition:all .2s var(--gcb-ease)}
.gcb-bubble a:hover{background:var(--gcb-blue);color:#fff;border-color:var(--gcb-blue);transform:translateY(-1px);
  box-shadow:0 6px 14px -8px rgba(0,93,171,.8)}
.gcb-bubble a::after{content:"\2192";font-weight:700}
.gcb-bubble a[data-ext]::after{content:"\2197"}

/* typing */
.gcb-typing{display:flex;gap:4px;padding:13px 15px;background:#fff;border:1px solid var(--gcb-line);
  border-radius:14px;border-bottom-left-radius:5px;width:fit-content}
.gcb-typing i{width:7px;height:7px;border-radius:50%;background:var(--gcb-mute);animation:gcb-bounce 1.2s infinite}
.gcb-typing i:nth-child(2){animation-delay:.16s}.gcb-typing i:nth-child(3){animation-delay:.32s}
@keyframes gcb-bounce{0%,60%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-5px);opacity:1}}

/* chips */
.gcb-chips{display:flex;flex-wrap:wrap;gap:7px;padding:2px 2px 6px 37px}
.gcb-chip{background:#fff;border:1px solid #cfdcea;color:var(--gcb-slate);border-radius:100px;
  padding:9px 15px;font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;
  transition:all .2s var(--gcb-ease)}
.gcb-chip:hover{background:var(--gcb-blue);color:#fff;border-color:var(--gcb-blue);transform:translateY(-1px);
  box-shadow:0 6px 14px -8px rgba(0,93,171,.8)}

/* footer / input */
.gcb-foot{flex:0 0 auto;padding:12px 14px 10px;border-top:1px solid var(--gcb-line);background:#fff}
.gcb-inrow{display:flex;align-items:flex-end;gap:9px;background:var(--gcb-paper);border:1px solid #cfdcea;
  border-radius:12px;padding:6px 6px 6px 14px;transition:border-color .2s,box-shadow .2s,background .2s}
.gcb-inrow:focus-within{border-color:var(--gcb-blue-500);background:#fff;box-shadow:0 0 0 4px rgba(15,122,208,.12)}
.gcb-input{flex:1;border:none;background:none;resize:none;outline:none;font-family:inherit;font-size:14.5px;
  color:var(--gcb-ink);line-height:1.5;max-height:96px;padding:6px 0}
.gcb-input::placeholder{color:var(--gcb-mute)}
.gcb-send{width:38px;height:38px;flex:0 0 auto;border:none;border-radius:10px;background:var(--gcb-red);
  color:#fff;cursor:pointer;display:grid;place-items:center;
  transition:transform .2s var(--gcb-ease),opacity .2s,background .2s,box-shadow .2s}
.gcb-send:hover{transform:translateY(-1px);background:var(--gcb-red-600);box-shadow:0 8px 16px -8px rgba(229,67,39,.8)}
.gcb-send:disabled{opacity:.45;cursor:default;transform:none;box-shadow:none}
.gcb-send svg{width:18px;height:18px}
.gcb-note{text-align:center;font-size:11px;color:var(--gcb-mute);margin-top:8px}
.gcb-note b{color:var(--gcb-slate);font-weight:600}

/* error */
.gcb-msg.err .gcb-bubble{background:var(--gcb-red);color:#fff;border-color:var(--gcb-red)}
.gcb-msg.err .gcb-mava{background:#fdeee9;color:var(--gcb-red)}

/* ---------- Responsive ---------- */
@media (max-width:560px){
  .gcb-panel{right:0;left:0;bottom:0;width:100%;max-width:100%;height:88vh;border-radius:16px 16px 0 0}
  .gcb-launch{right:16px;bottom:16px}
  .gcb-teaser{right:16px;bottom:90px}
}
@media (prefers-reduced-motion:reduce){
  .gcb-launch::after{animation:none}
  .gcb-msg,.gcb-panel,.gcb-teaser{animation:none;transition:opacity .2s}
}
