/* Floating help bubble (mts-help-widget.php). Same position as the old WPCode snippet in Arabic and English:
   bottom-right, 70 px from the edge on desktop (beside the sticky category bar), 16 px on phones. Other files lift
   #mtsBtn above bars with !important (layers.css, mts-checkout-declutter.php, proposals); the toaster and the panel
   follow the bubble's real position (set by the script), so they stay attached. */
#mts-widget{
  --hw-sea-1:#8FDDF7; --hw-sea-2:#1E9BD7; --hw-sea-3:#0B5F93;
  --hw-brand:#41B782; --hw-brand-dark:#2F8F66; --hw-soft:#F0FAF5;
  --hw-card:#fff; --hw-ink:#0F172A; --hw-sub:#64748B; --hw-line:#E8F0F0;
  --hw-tip-bg:#0F172A; --hw-tip-fg:#fff; --hw-shadow:0 10px 40px rgba(15,23,42,.16);
  --mts-inset-right:70px;
  font-family:var(--mts-body-font),'Cairo',system-ui,sans-serif;
}
@media (prefers-color-scheme:dark){#mts-widget{--hw-soft:#14261E;--hw-card:#121D18;--hw-ink:#E7F0EC;--hw-sub:#9BB0A6;--hw-line:#22352C;--hw-tip-bg:#E7F0EC;--hw-tip-fg:#0F172A;--hw-shadow:0 10px 40px rgba(0,0,0,.5)}}
@media (max-width:768px){#mts-widget{--mts-inset-right:16px}}
#mts-widget *,#mts-widget *::before,#mts-widget *::after{box-sizing:border-box}
#mts-widget [hidden]{display:none!important}
#mts-widget button,#mts-widget a{font:inherit;margin:0;text-transform:none;letter-spacing:normal}

/* bubble: sea-blue water, Tanky swimming, small bubbles rising */
#mts-widget .mts-btn{position:fixed;bottom:calc(50px + env(safe-area-inset-bottom,0px));right:var(--mts-inset-right);left:auto;width:60px;height:60px;border-radius:50%;
  border:0;padding:0!important;cursor:pointer;z-index:99998;overflow:visible;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 35% 30%,var(--hw-sea-1),var(--hw-sea-2) 52%,var(--hw-sea-3));box-shadow:0 8px 26px rgba(14,124,190,.42);
  transition:transform .2s;-webkit-tap-highlight-color:transparent}
#mts-widget .mts-btn:hover{transform:scale(1.06)}
#mts-widget .mts-btn:active{transform:scale(.94)}
#mts-widget .mts-btn:focus-visible,#mts-widget .mts-item:focus-visible,#mts-widget .mts-close:focus-visible,#mts-widget .mts-bar-close:focus-visible,#mts-widget .mts-tip-x:focus-visible{outline:3px solid var(--hw-sea-3);outline-offset:3px}
#mts-widget .mts-fish{width:40px;height:40px;object-fit:contain;position:relative;z-index:1;animation:mts-swim 3.2s ease-in-out infinite;transform-origin:50% 60%}
@keyframes mts-swim{0%,100%{transform:translate(-2px,1px) rotate(-4deg)}25%{transform:translate(2px,-2px) rotate(3deg)}50%{transform:translate(3px,1px) rotate(-2deg)}75%{transform:translate(-1px,-2px) rotate(4deg)}}
#mts-widget .mts-b{position:absolute;bottom:14px;width:6px;height:6px;border-radius:50%;border:1.5px solid rgba(255,255,255,.9);background:rgba(255,255,255,.25);opacity:0;animation:mts-rise 3.6s ease-in infinite;pointer-events:none}
#mts-widget .mts-b1{left:24px;animation-delay:.2s}#mts-widget .mts-b2{left:31px;width:4px;height:4px;animation-delay:1.4s}#mts-widget .mts-b3{left:21px;width:5px;height:5px;animation-delay:2.5s}
@keyframes mts-rise{0%{opacity:0;transform:translateY(0) scale(.6)}15%{opacity:1}80%{opacity:.9}100%{opacity:0;transform:translate(3px,-36px) scale(1.1)}}
#mts-widget .mts-btn::before{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid var(--hw-sea-2);opacity:0;pointer-events:none}
#mts-widget .mts-btn.pulse::before{animation:mts-ring 1.4s ease-out}
@keyframes mts-ring{0%{opacity:.7;transform:scale(1)}100%{opacity:0;transform:scale(1.6)}}
@media (prefers-reduced-motion:reduce){#mts-widget .mts-fish,#mts-widget .mts-b,#mts-widget .mts-btn.pulse::before{animation:none}}

/* toaster: to the left of the bubble in both languages, arrow pointing at it */
#mts-widget .mts-tooltip{position:fixed;right:calc(var(--mts-inset-right) + 74px);bottom:calc(60px + env(safe-area-inset-bottom,0px));max-width:min(220px,calc(100vw - 110px));
  background:var(--hw-tip-bg);color:var(--hw-tip-fg);border-radius:14px;padding:8px 8px 8px 12px;font-size:13px;font-weight:700;line-height:1.4;box-shadow:var(--hw-shadow);
  display:flex;gap:6px;align-items:center;z-index:99997;opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s;pointer-events:none}
html[dir="rtl"] #mts-widget .mts-tooltip{padding:8px 12px 8px 8px;direction:rtl}
#mts-widget .mts-tooltip.show{opacity:1;transform:none;pointer-events:auto}
#mts-widget .mts-tooltip::after{content:"";position:absolute;top:50%;right:-6px;margin-top:-6px;border:6px solid transparent;border-right:0;border-left-color:var(--hw-tip-bg)}
#mts-widget .mts-tip-txt{cursor:pointer}
/* phones: above the bubble, right-aligned, so it never runs into the Spin & Win pill or scroll-to-top on the left */
#mts-widget .mts-tooltip.above::after{top:auto;bottom:-6px;right:24px;margin-top:0;border:6px solid transparent;border-bottom:0;border-top-color:var(--hw-tip-bg)}
#mts-widget .mts-tip-x{border:0;background:transparent;color:inherit;opacity:.7;cursor:pointer;width:28px;height:28px;padding:0!important;display:flex;align-items:center;justify-content:center;flex:none}

/* panel */
#mts-widget .mts-panel{position:fixed;right:var(--mts-inset-right);left:auto;bottom:calc(120px + env(safe-area-inset-bottom,0px));width:300px;max-width:calc(100vw - 28px);
  background:var(--hw-card);color:var(--hw-ink);border:1px solid var(--hw-line);border-radius:20px;box-shadow:var(--hw-shadow);z-index:99998;
  transform-origin:bottom right;animation:mts-up .2s ease-out}
@keyframes mts-up{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){#mts-widget .mts-panel{animation:none}}
@media (max-width:480px){#mts-widget .mts-panel{right:14px;width:calc(100vw - 28px)}}
#mts-widget .mts-head{display:flex;justify-content:space-between;align-items:center;padding:10px 12px 10px 14px;border-bottom:1px solid var(--hw-line)}
#mts-widget .mts-head>span{font-size:14px;font-weight:800}
#mts-widget .mts-close{width:36px;height:36px;border:0;border-radius:10px;background:var(--hw-soft);color:var(--hw-sub);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0!important}
#mts-widget .mts-list{padding:10px;display:flex;flex-direction:column;gap:8px}
#mts-widget .mts-item{display:flex;align-items:center;gap:12px;padding:11px!important;border-radius:14px;background:var(--hw-soft);border:0;width:100%;
  text-align:start;text-decoration:none;color:var(--hw-ink);cursor:pointer;min-height:64px;transition:filter .15s}
#mts-widget .mts-item:hover{filter:brightness(.97)}
#mts-widget .mts-item-tanky{background:linear-gradient(135deg,var(--hw-brand),var(--hw-brand-dark));color:#fff}
#mts-widget .mts-icon{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex:none;background:rgba(65,183,130,.12)}
#mts-widget .mts-item-tanky .mts-icon{background:rgba(255,255,255,.22)}
#mts-widget .mts-item-wa .mts-icon{background:rgba(37,211,102,.12)}
#mts-widget .mts-icon img{width:34px;height:34px;object-fit:contain}
#mts-widget .mts-item-text{display:flex;flex-direction:column;gap:2px;min-width:0}
#mts-widget .mts-item-label{font-size:14px;font-weight:700;line-height:1.25;color:inherit}
#mts-widget .mts-item-sub{font-size:12px;line-height:1.35;color:var(--hw-sub)}
#mts-widget .mts-item-tanky .mts-item-sub{color:rgba(255,255,255,.88)}

/* full-screen Tanky / calculator */
#mts-widget .mts-overlay{position:fixed;inset:0;background:#fff;display:flex;flex-direction:column;z-index:99999}
#mts-widget .mts-bar{min-height:46px;padding:0 10px;padding-top:env(safe-area-inset-top,0px);background:linear-gradient(135deg,var(--hw-brand),var(--hw-brand-dark));display:flex;align-items:center;gap:10px;flex:none}
#mts-widget .mts-bar-icon{width:28px;height:28px;object-fit:contain;flex:none}
#mts-widget .mts-bar-title{flex:1;font-size:14px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#mts-widget .mts-bar-close{width:38px;height:38px;border:0;border-radius:10px;background:rgba(0,0,0,.22);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0!important;flex:none}
#mts-widget .mts-loader{position:absolute;inset:46px 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#fff;z-index:1;transition:opacity .25s;pointer-events:none}
#mts-widget .mts-loader.hidden{opacity:0}
#mts-widget .mts-spinner{width:34px;height:34px;border:3px solid #E2F6EC;border-top-color:var(--hw-brand);border-radius:50%;animation:mts-spin .8s linear infinite}
@keyframes mts-spin{to{transform:rotate(360deg)}}
#mts-widget .mts-loader-txt{font-size:13px;color:#94A3B8;font-weight:600}
#mts-widget .mts-frame{flex:1;width:100%;border:0;min-height:0;display:block}
html.mts-hw-lock,html.mts-hw-lock body{overflow:hidden!important}
