#zex-companion{--zc-red:#d51f36;--zc-white:#f2f2f2;position:fixed;left:max(12px,env(safe-area-inset-left));top:var(--zc-mid,50%);transform:translateY(-50%);z-index:99990;direction:rtl;font-family:"IBM Plex Sans Arabic",Tajawal,system-ui,sans-serif;font-size:14px;line-height:1.8;color:#f2f2f2;text-align:right}
#zex-companion *,#zex-companion *:before{box-sizing:border-box}
#zex-companion [hidden]{display:none!important}
#zex-companion button,#zex-companion input,#zex-companion a{font:inherit;line-height:1.65;text-transform:none;letter-spacing:0;margin:0}
#zex-companion button{cursor:pointer;min-height:44px;box-shadow:none}
#zex-companion button:focus-visible,#zex-companion a:focus-visible,#zex-companion input:focus-visible{outline:2px solid #f2f2f2;outline-offset:3px}
#zex-companion .zc-launch{width:86px;display:flex;align-items:center;flex-direction:column;gap:2px;border:0;background:transparent;padding:0;color:#f2f2f2}
#zex-companion .zc-avatar{display:block;width:86px;height:96px;object-fit:contain;filter:drop-shadow(0 5px 5px #0006);transform-origin:50% 90%;animation:zc-idle 7s ease-in-out infinite;will-change:transform}
#zex-companion .zc-label{padding:2px 8px;border:1px solid #56303b;border-radius:20px;background:#121317;font-size:10px;white-space:nowrap}
#zex-companion.zc-greeting .zc-avatar{animation:zc-greet 1.9s ease-in-out}
#zex-companion.zc-speaking .zc-avatar{animation:zc-talk .5s ease-in-out 3}
#zex-companion.zc-thinking .zc-avatar{animation:zc-think 1.6s ease-in-out infinite}
#zex-companion .zc-launch:hover .zc-avatar{animation:zc-greet 1s ease-in-out}
#zex-companion .zc-panel{position:absolute;left:100px;top:50%;transform:translateY(-50%);width:340px;max-height:calc(var(--zc-vh,100dvh) - 28px);display:flex;flex-direction:column;gap:9px;padding:39px 3px 4px;background:transparent;border:0;border-radius:0;box-shadow:none}
#zex-companion .zc-close{position:absolute;top:0;left:0;width:35px;min-height:35px;border:1px solid #50333d;border-radius:50%;background:#15151beF;color:#dedee4;font-size:21px;line-height:1;box-shadow:0 3px 9px #0003}
#zex-companion .zc-log{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;min-height:0;padding:2px;display:flex;flex-direction:column;gap:9px;background:transparent;flex:0 1 auto}
#zex-companion .zc-message,#zex-companion .zc-busy{position:relative;background:#17181ef5;border:1px solid #69303f;border-radius:19px 19px 19px 5px;padding:15px 17px;box-shadow:0 6px 17px #0003;color:#f2f2f2;white-space:pre-line;overflow-wrap:anywhere;animation:zc-bubble .22s ease-out;font-size:14px}
#zex-companion .zc-busy{font-size:13px;color:#d4cbd0}
#zex-companion .zc-options{display:flex;flex-wrap:wrap;gap:7px;justify-content:flex-start;padding:0 2px}
#zex-companion .zc-option{display:inline-flex;align-items:center;justify-content:center;max-width:100%;border:1px solid #713241;background:#25141df7;color:#f2f2f2!important;padding:9px 13px;border-radius:20px;font-size:13px;min-height:44px;text-decoration:none!important;box-shadow:0 3px 10px #0003;animation:zc-bubble .22s ease-out}
#zex-companion .zc-option:hover{background:#552133}
#zex-companion .zc-product{background:#16171cf5;border:1px solid #66303f;border-radius:18px;padding:13px;display:grid;grid-template-columns:62px 1fr;gap:10px;box-shadow:0 6px 17px #0003;animation:zc-bubble .22s ease-out}
#zex-companion .zc-product img{width:62px;height:62px;border-radius:10px;object-fit:contain;background:#0a0b0e}
#zex-companion .zc-product h3{font-size:14px;line-height:1.7;margin:0;color:#f2f2f2}
#zex-companion .zc-product p{font-size:14px;margin:5px 0 0;color:#f12a42;font-weight:700}
#zex-companion .zc-product small{grid-column:1/-1;font-size:12px;color:#bdc0c9;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
#zex-companion .zc-product a{grid-column:1/-1;text-align:center;padding:9px 13px;background:#d51f36;border-radius:12px;color:white!important;font-weight:700;text-decoration:none!important}
#zex-companion .zc-tools{display:flex;gap:6px;flex-wrap:wrap;flex-shrink:0;padding:0 2px}
#zex-companion .zc-tools button{background:#17181ef5;border:1px solid #43333d;color:#c8c9d2;border-radius:18px;font-size:11px;padding:7px 10px;min-height:36px}
#zex-companion .zc-tools button:hover{color:#fff;border-color:#9a3d56}
#zex-companion .zc-form{background:#17181ef5;border:1px solid #63303f;border-radius:16px;padding:10px;flex-shrink:0;box-shadow:0 6px 17px #0003}
#zex-companion .zc-compose{display:flex;gap:6px;align-items:center}
#zex-companion .zc-compose input{width:100%;min-width:0;min-height:44px;border:1px solid #44323c;border-radius:11px;background:#101116;color:#f2f2f2;padding:8px 10px;font-size:14px;box-shadow:none}
#zex-companion .zc-compose button{background:#d51f36;border:0;border-radius:11px;color:#fff;padding:8px 11px;font-size:12px;flex-shrink:0}
#zex-companion .zc-compose button:disabled{opacity:.5;cursor:wait}
#zex-companion .zc-disclosure{font-size:10px;color:#a8a9b4;text-align:center;margin:7px 0 0}
#zex-companion .zc-coupon{direction:ltr;letter-spacing:2px;padding:12px 15px;border:1px dashed #c34360;border-radius:16px;background:#28131df5;color:#fff;font-size:17px;text-align:center;font-weight:700}
#zex-companion .zc-teaser{position:absolute;left:100px;top:50%;transform:translateY(-50%);width:245px;padding:17px;background:#17181ef5;border:1px solid #69303f;border-radius:19px 19px 19px 5px;box-shadow:0 6px 17px #0003;animation:zc-bubble .22s ease-out}
#zex-companion .zc-teaser p{margin:0 0 12px;padding-left:18px;font-size:14px}
#zex-companion .zc-teaser-close{position:absolute;top:0;left:0;border:0;border-radius:50%;background:transparent;color:#b5b5c0;font-size:20px;width:40px;min-height:40px}
#zex-companion .zc-accept{background:#d51f36;border:0;border-radius:20px;color:white;padding:8px 15px;font-size:13px}
.zc-tour-focus{outline:3px solid #f12a42!important;outline-offset:5px!important;scroll-margin-top:130px!important}
@keyframes zc-idle{0%,70%,100%{transform:translateY(0) rotate(0)}35%{transform:translateY(-4px) rotate(1deg)}}
@keyframes zc-greet{0%,100%{transform:rotate(0)}20%,60%{transform:translateY(-5px) rotate(-6deg)}40%,80%{transform:translateY(-3px) rotate(5deg)}}
@keyframes zc-talk{0%,100%{transform:translateY(0) rotate(0)}45%{transform:translateY(-3px) rotate(-2deg)}70%{transform:translateY(-1px) rotate(1deg)}}
@keyframes zc-think{0%,100%{transform:rotate(0)}50%{transform:translateY(-3px) rotate(5deg)}}
@keyframes zc-bubble{from{opacity:0;translate:-5px 3px}to{opacity:1;translate:0 0}}
@media(max-width:600px){#zex-companion{left:max(5px,env(safe-area-inset-left))}#zex-companion .zc-launch{width:60px}#zex-companion .zc-avatar{width:60px;height:72px}#zex-companion .zc-label{font-size:9px;padding:2px 5px}#zex-companion .zc-panel{left:69px;width:min(330px,calc(var(--zc-vw,100vw) - 84px));max-height:calc(var(--zc-vh,100dvh) - 20px);padding-top:46px}#zex-companion .zc-close{min-height:44px;width:44px}#zex-companion .zc-message{padding:13px;font-size:14px}#zex-companion .zc-option{font-size:13px;padding:8px 11px}#zex-companion .zc-tools button{min-height:44px;font-size:11px;padding:6px 9px}#zex-companion .zc-product{grid-template-columns:50px 1fr;padding:11px;gap:8px}#zex-companion .zc-product img{width:50px;height:50px}#zex-companion .zc-compose input{font-size:16px}#zex-companion .zc-teaser{left:69px;width:min(245px,calc(var(--zc-vw,100vw) - 84px))}}
@media(prefers-reduced-motion:reduce){#zex-companion *,#zex-companion *:before{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* 1.3: looks toward the mouse, short remarks, cheering, order lookup */
#zex-companion .zc-head{display:block;transform:perspective(420px) rotateY(var(--zc-ry,0deg)) rotateX(var(--zc-rx,0deg));transition:transform .18s ease-out}
#zex-companion.zc-happy .zc-avatar{animation:zc-happy .55s ease-in-out 3}
#zex-companion .zc-pop{position:absolute;left:100px;top:34%;max-width:210px;padding:9px 14px;background:#17181ef5;border:1px solid #69303f;border-radius:15px 15px 15px 4px;color:#f2f2f2;font-size:14px;font-weight:600;line-height:1.6;white-space:nowrap;box-shadow:0 6px 17px #0003;pointer-events:none;animation:zc-bubble .22s ease-out}
#zex-companion .zc-track{display:grid;gap:8px;margin-top:8px;padding:12px;background:#17181ef5;border:1px solid #69303f;border-radius:14px}
#zex-companion .zc-track input{width:100%;height:44px;padding:0 12px;border:1px solid #3a3b44;border-radius:10px;background:#0e0f13;color:#f2f2f2}
#zex-companion .zc-track input::placeholder{color:#9a9aa6}
#zex-companion .zc-track input[dir=ltr]::placeholder{direction:rtl}
@keyframes zc-happy{0%,100%{transform:translateY(0) rotate(0) scale(1)}40%{transform:translateY(-14px) rotate(-7deg) scale(1.06)}70%{transform:translateY(-4px) rotate(6deg)}}
@media(max-width:600px){#zex-companion .zc-pop{left:66px;font-size:13px}}
@media (prefers-reduced-motion:reduce){#zex-companion .zc-head{transition:none}#zex-companion.zc-happy .zc-avatar{animation:none}}

/* 1.3.1: floats and can be dragged; settles on the side it is dropped on (mascot back to the middle while its bubbles are open) */
#zex-companion{top:var(--zc-y,var(--zc-mid,50%));transition:top .25s ease}
#zex-companion.zc-open{top:var(--zc-mid,50%)}
#zex-companion.zc-dragging{transition:none}
#zex-companion.zc-right{left:auto;right:max(12px,env(safe-area-inset-right))}
#zex-companion.zc-right .zc-panel,#zex-companion.zc-right .zc-teaser,#zex-companion.zc-right .zc-pop{left:auto;right:100px}
#zex-companion .zc-launch{touch-action:none;cursor:grab}
#zex-companion.zc-dragging .zc-launch{cursor:grabbing}
#zex-companion.zc-dragging .zc-avatar{animation:none;transform:scale(1.08)}
#zex-companion .zc-avatar{animation:zc-float 4s ease-in-out infinite}
@keyframes zc-float{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-11px) rotate(1.5deg)}}
@media(max-width:600px){#zex-companion.zc-right{right:max(5px,env(safe-area-inset-right))}#zex-companion.zc-right .zc-panel,#zex-companion.zc-right .zc-teaser{right:69px}#zex-companion.zc-right .zc-pop{right:66px}}
@media (prefers-reduced-motion:reduce){#zex-companion .zc-avatar{animation:none}}
#zex-companion.zc-greeting .zc-avatar{animation:zc-greet 1.9s ease-in-out}
#zex-companion.zc-speaking .zc-avatar{animation:zc-talk .5s ease-in-out 3}
#zex-companion.zc-thinking .zc-avatar{animation:zc-think 1.6s ease-in-out infinite}
#zex-companion.zc-happy .zc-avatar{animation:zc-happy .55s ease-in-out 3}

/* 1.4: one-tap add in the product card */
#zex-companion .zc-add{grid-column:1/-1;width:100%;margin-top:8px;border:0;border-radius:10px;background:var(--zc-red);color:#fff;font-weight:700;cursor:pointer}
#zex-companion .zc-add:hover{filter:brightness(1.1)}
#zex-companion .zc-message strong{display:block;margin-bottom:2px}
#zex-companion .zc-message p{margin:0}
