/* SHAHAZ.com AI — homepage VOICE assistant (ZIP-442/443/444, owner).
   A floating popup between the header and the bottom navigation bar, 30px free at both sides: black header with the robot, white chat, pink user
   captions, product cards, link chips. ZIP-444: no typing, no mic button — the robot greets aloud, then listens by itself.
   House rules: page dimmed black 48% (never blurred), no shadows, no blue focus or tap highlight, slim buttons.
   Markup: inc/shahaz-ai-engine.php (wp_footer) · Behaviour: assets/js/shahaz-ai-engine.js */
.shz-ai{--ai-pink:#e0157a;--ai-pink-d:#b80f63;--ai-maroon:#2a0a1c;--ai-black:#0e0a0c;--ai-gold:#c9a24e;--ai-ink:#1f1418;
  --ai-soft:#76626c;--ai-line:#f0dde7;--ai-line2:#e7cbd9;--ai-tint:#fbf3f7;--shz-ai-top:96px;--shz-ai-bottom:86px;
  --ai-font:"Hind Siliguri","Segoe UI",Roboto,Arial,sans-serif;
  position:fixed;inset:0;z-index:100000;font-family:var(--ai-font);color:var(--ai-ink);-webkit-tap-highlight-color:transparent}
.shz-ai[hidden]{display:none!important}
.shz-ai *,.shz-ai *::before,.shz-ai *::after{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.shz-ai button,.shz-ai input,.shz-ai a{font-family:inherit;outline:none}
.shz-ai button{cursor:pointer;margin:0;-webkit-appearance:none;appearance:none}
.shz-ai :focus{outline:none}
.shz-ai :focus-visible{outline:2px solid var(--ai-pink);outline-offset:2px}
html.shz-ai-open,html.shz-ai-open body{overflow:hidden!important}
/* the site promo popup/badge must not sit on top of the open assistant */
html.shz-ai-open #shahaz-enterprise-popup-root,html.shz-ai-open .shahaz-ep,html.shz-ai-open .shahaz-ep-badge{visibility:hidden!important}

/* page dimmed (house rule: black 48%, no blur); a tap on it closes */
.shz-ai__overlay{position:absolute;inset:0;background:rgba(0,0,0,.48);opacity:0;transition:opacity .28s ease}
.shz-ai.is-open .shz-ai__overlay{opacity:1}

/* ZIP-449: the light from the header robot onto the popup (the JS draws the beam's shape and places the robot copy) */
.shz-ai__beam{--beam-top:80px;--beam-bottom:160px;position:fixed;inset:0;z-index:1;pointer-events:none;opacity:0;transform:scaleY(0);will-change:transform,opacity;
  /* ZIP-451 (owner): the popup's own glossy pink, rising out of the ring (transparent there) and strongest on the popup */
  background:repeating-linear-gradient(180deg,rgba(255,255,255,0) 0 14px,rgba(255,255,255,.22) 14px 16px,rgba(255,255,255,0) 16px 30px),
    linear-gradient(180deg,rgba(255,63,196,0) var(--beam-top),rgba(255,79,200,.5) calc(var(--beam-top) + 14px),rgba(255,111,214,.55) calc((var(--beam-top) + var(--beam-bottom)) / 2),rgba(255,63,196,.85) var(--beam-bottom));
  background-size:100% 30px,100% 100%}
.shz-ai.is-open .shz-ai__beam.is-on{animation:shz-ai-beam-in .45s cubic-bezier(.3,.8,.3,1) forwards,shz-ai-beam-flow 1.2s linear .45s infinite,shz-ai-beam-hum 2.6s ease-in-out .45s infinite}
@keyframes shz-ai-beam-in{from{opacity:0;transform:scaleY(0)}to{opacity:1;transform:scaleY(1)}}
@keyframes shz-ai-beam-flow{from{background-position:0 0,0 0}to{background-position:0 30px,0 0}}
@keyframes shz-ai-beam-hum{0%,100%{opacity:.8;transform:scaleY(1)}50%{opacity:1;transform:scaleY(1)}}
.shz-ai__projector{position:fixed;z-index:3;display:none;pointer-events:none}
.shz-ai__projector.is-on{display:block}
.shz-ai__projector svg{display:block;width:100%;height:100%;overflow:visible}
.shz-ai__projector .shzH-eyes,.shz-ai__projector .shzH-star{transform-box:fill-box;transform-origin:center}
.shz-ai__sheet{z-index:2;will-change:transform}

/* ------------------------------------------------------------------ the popup (ZIP-443, owner)
   Floats over the page: 30px free left and right, from just under the header to just above the bottom navigation
   bar (top / bottom set by the JS), all corners rounded. */
.shz-ai__sheet{position:absolute;top:var(--shz-ai-top);bottom:var(--shz-ai-bottom);left:0;right:0;margin:0 auto;width:calc(100% - 60px);max-width:520px;
  display:flex;flex-direction:column;border:2px solid transparent;border-radius:22px;overflow:hidden;
  /* ZIP-444 (owner: "ভেসে থাকবে"): lifted off the page without a shadow — a pink→gold→pink glowing ring and a soft
     light halo around it, and the popup slowly floats up and down */
  background:
    /* ZIP-445 (owner reference): glossy solid pink, bright at the top, softening to near-white — no blur */
    linear-gradient(180deg,rgba(255,255,255,.28) 0,rgba(255,255,255,0) 90px) padding-box,
    linear-gradient(180deg,#ff3fc4 0%,#ff6fd6 16%,#ff9fe3 38%,#ffcdef 62%,#ffeaf8 84%,#fff6fc 100%) padding-box,linear-gradient(135deg,#ff4fae,#e0157a 30%,#e8c46a 55%,#e0157a 80%,#ff4fae) border-box;
  outline:7px solid rgba(255,255,255,.22);outline-offset:0;
  opacity:0;transform:translateY(-10px) scale(.98);transform-origin:50% 0;transition:opacity .26s ease,transform .26s cubic-bezier(.2,.8,.2,1)}
.shz-ai.is-open .shz-ai__sheet{opacity:1;transform:none;animation:shz-ai-float 4.5s ease-in-out .4s infinite}
@keyframes shz-ai-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}

/* header: black, robot + online dot, wordmark, read-aloud / new chat / close; gold hairline */
.shz-ai__head{flex:0 0 auto;display:flex;align-items:center;gap:8px;padding:11px 10px 11px 12px;background:var(--ai-black);color:#fff;
  border-bottom:1px solid rgba(201,162,78,.7)}
.shz-ai__avatar{position:relative;flex:0 0 42px;width:42px;height:42px;border-radius:50%;border:1.5px solid var(--ai-pink);background:#1c1117;
  display:grid;place-items:center}
.shz-ai__avatar img{width:36px;height:auto;display:block}
.shz-ai__avatar i{position:absolute;right:-1px;bottom:1px;width:11px;height:11px;border-radius:50%;background:#22c55e;border:2px solid var(--ai-black)}
.shz-ai__id{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;line-height:1.2}
.shz-ai__id strong{display:flex;align-items:center;gap:6px;font-size:16px;font-weight:700;white-space:nowrap}
.shz-ai__id .shz-wm{font-size:16px;letter-spacing:.02em}
.shz-ai__id .shz-wm__n{color:var(--ai-pink)}
.shz-ai__id .shz-wm__d{color:var(--ai-gold);font-size:.68em}
.shz-ai__id strong b{font-size:11px;font-weight:700;line-height:1;color:var(--ai-black);background:var(--ai-gold);border-radius:4px;padding:3px 6px}
.shz-ai__id small{margin-top:3px;font-size:11.5px;color:rgba(255,255,255,.72);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shz-ai__icon{flex:0 0 34px;width:34px;height:34px;padding:0;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:transparent;color:#fff;
  display:grid;place-items:center}
.shz-ai__icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.shz-ai__icon .on{display:none}
.shz-ai__icon.is-on{border-color:var(--ai-pink);color:var(--ai-pink)}
.shz-ai__icon.is-on .on{display:inline}
.shz-ai__icon.is-on .off{display:none}
.shz-ai.is-speaking .shz-ai__icon.is-on{background:var(--ai-pink);color:#fff}


/* ------------------------------------------------------------------ the talking robot (ZIP-444/445)
   The robot sits on the glossy pink. Rings = the checkout page bulb rings exactly (owner): five thin rings of
   falling size, each grows from 18% to full and fades, one after another — green while it LISTENS, gold while it
   SPEAKS; it bobs while it THINKS. A tap: interrupt / pause / talk again. Compact once the conversation started. */
.shz-ai__stage{--orb:108px;flex:0 0 auto;position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;width:100%;margin:0;
  padding:84px 12px 10px;border:0;background:transparent;color:#fff;text-align:center;overflow:visible}
.shz-ai__orb{position:relative;display:block;width:var(--orb);height:var(--orb);border-radius:50%;isolation:isolate;transition:width .25s ease,height .25s ease;
  background:radial-gradient(circle at 50% 40%,#fff 0%,#fff3fa 55%,#ffc6e6 88%,#ff9ad3 100%);border:3px solid #fff}
/* ZIP-447: the owner's robot artwork rises out of the ring — large, centred on the ring; the front half of the rim
   (.shz-ai__lip) is drawn over the robot's lower body, so it reads as coming out of the ring (3D) */
.shz-ai__bot{position:absolute;z-index:2;left:50%;bottom:calc(var(--orb) * -.08);width:calc(var(--orb) * 1.95);aspect-ratio:640/564;transform:translateX(-51%)}
/* ZIP-451 (owner: "ভাঙা ভাঙা"): one inner layer moves; every state's motion starts and ends at rest, so changing state
   (hello → speaking → listening) never jumps; GPU layer (will-change) for a smooth motion in in-app browsers */
.shz-ai__bot-move{position:absolute;inset:0;display:block;transform-origin:52% 85%;will-change:transform;animation:shzR-bob 3.4s ease-in-out infinite}
.shz-ai__bot-img{display:block;width:100%;height:100%;max-width:none;object-fit:contain;pointer-events:none;user-select:none}
.shz-ai__lip{position:absolute;z-index:3;inset:-3px;border-radius:50%;border:3.5px solid #e0157a;border-top-color:transparent;clip-path:inset(52% -4px -4px -4px);pointer-events:none}
/* the face, drawn in code on the robot's empty black screen (screen centre 52% / 41.6%, tilted 17°) */
.shz-ai__face{position:absolute;left:52.1%;top:42%;width:35%;height:22.5%;transform:translate(-50%,-50%) rotate(17deg);overflow:visible;pointer-events:none}
.shz-ai__face *{transform-box:fill-box;transform-origin:center}
.shzF-open,.shzF-talk{opacity:0}
.shzF-eyes{animation:shzF-blink 5s infinite}
.shzF-spark{animation:shzF-spark 2.4s ease-in-out infinite}
/* listening: round, attentive eyes; the robot leans in */
.shz-ai.is-listening .shzF-happy{opacity:0}
.shz-ai.is-listening .shzF-open{opacity:1}
.shz-ai.is-listening .shz-ai__bot-move{animation:shzR-lean 2.8s ease-in-out infinite}
/* speaking: happy eyes, the mouth opens and closes, the robot rocks as it talks */
.shz-ai.is-speaking .shzF-mouth{opacity:0}
.shz-ai.is-speaking .shzF-talk{opacity:1;animation:shzF-talk .26s ease-in-out infinite alternate}
.shz-ai.is-speaking .shz-ai__bot-move{animation:shzR-talk 1.4s ease-in-out infinite}
/* thinking: eyes look up, head tilted */
.shz-ai.is-thinking .shzF-happy{opacity:0}
.shz-ai.is-thinking .shzF-open{opacity:1;transform:translate(-6px,-6px)}
.shz-ai.is-thinking .shz-ai__bot-move{animation:shzR-think 1.6s ease-in-out infinite}
/* saying hello: a happy little jump */
.shz-ai.is-hello .shz-ai__bot-move{animation:shzR-hello 1.3s ease-in-out 2}
@keyframes shzR-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes shzR-lean{0%,100%{transform:none}50%{transform:rotate(3deg) translateY(-2px)}}
@keyframes shzR-talk{0%,100%{transform:none}25%{transform:rotate(-2deg) translateY(-1px)}75%{transform:rotate(2deg) translateY(-2px)}}
@keyframes shzR-think{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(-5deg) translateY(-2px)}}
@keyframes shzR-hello{0%,100%{transform:none}25%{transform:rotate(-4deg) translateY(-4px)}75%{transform:rotate(4deg) translateY(-4px)}}
@keyframes shzF-blink{0%,44%,50%,100%{transform:scaleY(1)}47%{transform:scaleY(.1)}}
@keyframes shzF-talk{from{transform:scaleY(.35)}to{transform:scaleY(1.15)}}
@keyframes shzF-spark{0%,100%{opacity:.4;transform:scale(.6)}50%{opacity:1;transform:scale(1.1)}}
.shz-ai__rings{position:absolute;inset:0;z-index:0;pointer-events:none;color:#00e070}
.shz-ai__rings i{position:absolute;left:50%;top:50%;width:calc(var(--orb) * 1.95);height:calc(var(--orb) * 1.95);border:1.6px solid currentColor;border-radius:50%;
  opacity:0;transform:translate(-50%,-50%) scale(.18)}
.shz-ai__rings i:nth-child(2){width:calc(var(--orb) * 1.69);height:calc(var(--orb) * 1.69)}
.shz-ai__rings i:nth-child(3){width:calc(var(--orb) * 1.44);height:calc(var(--orb) * 1.44)}
.shz-ai__rings i:nth-child(4){width:calc(var(--orb) * 1.18);height:calc(var(--orb) * 1.18)}
.shz-ai__rings i:nth-child(5){width:calc(var(--orb) * .92);height:calc(var(--orb) * .92)}
.shz-ai.is-listening .shz-ai__rings i,.shz-ai.is-speaking .shz-ai__rings i{animation:shz-ai-wave 3s cubic-bezier(.15,.65,.2,1) infinite}
.shz-ai.is-listening .shz-ai__rings i:nth-child(2),.shz-ai.is-speaking .shz-ai__rings i:nth-child(2){animation-delay:.22s}
.shz-ai.is-listening .shz-ai__rings i:nth-child(3),.shz-ai.is-speaking .shz-ai__rings i:nth-child(3){animation-delay:.44s}
.shz-ai.is-listening .shz-ai__rings i:nth-child(4),.shz-ai.is-speaking .shz-ai__rings i:nth-child(4){animation-delay:.66s}
.shz-ai.is-listening .shz-ai__rings i:nth-child(5),.shz-ai.is-speaking .shz-ai__rings i:nth-child(5){animation-delay:.88s}
.shz-ai.is-speaking .shz-ai__rings{color:#ffd56a}
.shz-ai.is-speaking .shz-ai__rings i{animation-duration:2.2s}
@keyframes shz-ai-wave{0%{opacity:0;transform:translate(-50%,-50%) scale(.18)}9%{opacity:.92}48%{opacity:.66}78%{opacity:.14}100%{opacity:0;transform:translate(-50%,-50%) scale(1)}}
.shz-ai__state{position:relative;z-index:1;display:flex;flex-direction:column;margin-top:22px;min-height:36px;line-height:1.3}
.shz-ai__state b{font-size:16px;font-weight:700;color:#fff;letter-spacing:.01em}
.shz-ai__state small{font-size:12px;font-weight:600;color:#4a0630}
.shz-ai.has-chat .shz-ai__stage{--orb:54px;flex-direction:row;justify-content:center;gap:48px;padding:46px 12px 18px;overflow:hidden}
.shz-ai.has-chat .shz-ai__state{margin-top:0;align-items:flex-start;text-align:left;min-height:0}

/* ------------------------------------------------------------------ captions on the pink */
.shz-ai__body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:6px 12px 14px;background:transparent}
.shz-ai.has-chat .shz-ai__hints{display:none}
.shz-ai__label{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:6px 0 8px;font-size:12.5px;font-weight:700;color:#4a0630}
.shz-ai__label span[lang="en"]{font-weight:600;color:#7a2458}
/* every tap-to-say button the same size: two equal columns (owner) */
.shz-ai__chips,.shz-ai__next{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.shz-ai__chip{display:flex;align-items:center;justify-content:center;width:100%;min-width:0;height:38px;padding:0 8px;border:1px solid #fff;border-radius:12px;
  background:#fff;color:#7a0b48;font-size:12.5px;font-weight:600;line-height:1.2;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shz-ai__chip:active{background:#ffe3f3;border-color:#e0157a}

/* ------------------------------------------------------------------ product cards: three across */
.shz-ai__row{display:flex;gap:7px;overflow-x:auto;scroll-snap-type:x mandatory;margin-top:9px;padding-bottom:2px;scrollbar-width:none}
.shz-ai__row::-webkit-scrollbar{display:none}
.shz-ai__row .shz-ai__card{flex:0 0 calc((100% - 14px) / 3);scroll-snap-align:start}
.shz-ai__card{position:relative;min-width:0;border:1px solid #fff;border-radius:10px;overflow:hidden;background:#fff}
.shz-ai__card-link{display:block;color:inherit;text-decoration:none}
.shz-ai__media{position:relative;display:block;aspect-ratio:1/1;background:#fbf3f7}
.shz-ai__media img{width:100%;height:100%;object-fit:cover;display:block}
.shz-ai__off{position:absolute;left:4px;top:4px;padding:1px 4px;border-radius:4px;background:#e0157a;color:#fff;font-size:9px;font-weight:700;line-height:1.35}
.shz-ai__name{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:5px 6px 0;font-size:11px;font-weight:600;line-height:1.3;min-height:2.6em;color:#1f1418}
.shz-ai__price-line{display:flex;align-items:baseline;flex-wrap:wrap;gap:0 4px;padding:2px 26px 6px 6px;min-height:22px}
.shz-ai__price{font-size:12px;font-weight:700;color:#e0157a}
.shz-ai__old{font-size:9.5px;color:#76626c}
.shz-ai__card .shahaz-p-wishlist{position:absolute;right:4px;top:4px;width:22px;height:22px;padding:0;border:0;border-radius:50%;background:#fff;color:#e0157a;display:grid;place-items:center}
.shz-ai__card .shahaz-p-wishlist svg{width:13px;height:13px}
.shz-ai__card .shahaz-p-wishlist[aria-pressed="true"] svg path{fill:currentColor}
.shz-ai__cart{position:absolute;right:4px;bottom:5px;width:22px;height:22px;border-radius:50%;background:#e0157a;color:#fff;display:grid;place-items:center}

/* ------------------------------------------------------------------ chat: full width (no avatar column) */
.shz-ai__msg{margin:0 0 12px;animation:shz-ai-in .22s ease both}
@keyframes shz-ai-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.shz-ai__bubble{margin:0;padding:9px 13px;font-size:14.5px;line-height:1.55;white-space:pre-line;overflow-wrap:anywhere}
.shz-ai__en{display:block;margin-top:4px;font-size:13px;color:#7a2458}
.shz-ai__msg--user{display:flex;justify-content:flex-end}
.shz-ai__msg--user .shz-ai__bubble{max-width:84%;background:#2a0a1c;color:#fff;border-radius:16px 16px 4px 16px}
.shz-ai__msg--user.is-live .shz-ai__bubble{background:rgba(255,255,255,.55);color:#4a0630;border:1px dashed #4a0630}
.shz-ai__msg--bot .shz-ai__bubble{display:inline-block;max-width:94%;background:#fff;color:#1f1418;border-radius:4px 16px 16px 16px}
.shz-ai__msg--note .shz-ai__bubble{background:#fff8e8;border:1px solid #f1dfb4;font-size:13px}
.shz-ai__links{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.shz-ai__link{display:inline-flex;align-items:center;gap:4px;min-height:30px;padding:4px 12px;border:1px solid #fff;border-radius:999px;
  color:#c8106d;background:#fff;font-size:12.5px;font-weight:700;text-decoration:none}
.shz-ai__link::after{content:"›";font-size:15px;line-height:1}
.shz-ai__next{margin-top:9px}

@media (max-width:420px){
  .shz-ai__head{gap:6px;padding:10px 8px 10px 10px}
  .shz-ai__avatar{flex-basis:36px;width:36px;height:36px}
  .shz-ai__avatar img{width:30px}
  .shz-ai__icon{flex-basis:30px;width:30px;height:30px}
  .shz-ai__icon svg{width:16px;height:16px}
  .shz-ai__id strong,.shz-ai__id .shz-wm{font-size:14.5px}
  .shz-ai__body{padding:6px 10px 12px}
  .shz-ai__chip{font-size:12px;padding:0 6px}
}
@media (prefers-reduced-motion:reduce){
  .shz-ai__sheet,.shz-ai__overlay{transition:none}
  .shz-ai.is-open .shz-ai__sheet,.shz-ai__msg,.shz-ai__rings i,.shz-ai__bot-move,.shz-ai__face *{animation:none!important}
  .shz-ai.is-open .shz-ai__beam.is-on{animation:none!important;opacity:1;transform:none}
}