:root{
  --gradA:#031d70;
  --gradB:#1d4ada;
  --txt:#ffffff;
  --pillBg:#ffffff;
  --pillTxt:#0b1a3a;
  --shadow:0 12px 28px rgba(3,29,112,.25);
}
#aly-scta{
  position:fixed;left:18px;bottom:18px;inset-inline-start:18px;inset-block-end:18px;
  font-family:'Tajawal',system-ui,-apple-system,Segoe UI,Roboto,Arial,"Helvetica Neue","Noto Sans Arabic","Noto Kufi Arabic",sans-serif;
  direction:rtl; z-index:9999;
}
#aly-scta.aly-right{right:18px;left:auto;inset-inline-start:auto;inset-inline-end:18px}
#aly-scta .aly-wrap{display:flex;align-items:flex-end;gap:12px;position:relative}
#aly-scta .aly-pill{
  background:var(--pillBg); color:var(--pillTxt);
  border:1px solid rgba(3,29,112,.12);
  padding:10px 14px;border-radius:16px;font-size:12px;line-height:1.35;
  box-shadow:0 8px 24px rgba(3,29,112,.12);
  opacity:0; transform:translateY(8px);
  animation:aly-pill-in .7s ease forwards .25s, aly-pill-breathe 4.8s ease-in-out 1.2s infinite;
}
#aly-scta .aly-pill:after{
  content:""; position:absolute; bottom:-6px; inset-inline-start:18px;
  width:10px;height:10px;background:var(--pillBg);
  border:1px solid rgba(3,29,112,.12); border-top:none; border-inline-end:none;
  transform:rotate(45deg);
}
@keyframes aly-pill-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes aly-pill-breathe{0%{transform:translateY(0)}50%{transform:translateY(-2px)}100%{transform:translateY(0)}}

#aly-scta .aly-circle{
  width:var(--s,60px); height:var(--s,60px); border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background-image:linear-gradient(90deg,var(--gradA),var(--gradB));
  box-shadow:var(--shadow); color:var(--txt); text-shadow:0 1px 0 rgba(0,0,0,.2);
  position:relative; border:none; outline:none; cursor:pointer; user-select:none;
}
#aly-scta .aly-label{font-size:14px;font-weight:700;letter-spacing:.2px}

/* Rotating ring */
#aly-scta .aly-circle::before{
  content:""; position:absolute; inset:-6px; border-radius:50%;
  padding:4px; background:
    conic-gradient(from 0deg, rgba(29,74,218,.0), rgba(29,74,218,.7), rgba(3,29,112,.95), rgba(29,74,218,.0) 75%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  animation:aly-rotate 3.6s linear infinite;
}
@keyframes aly-rotate{to{transform:rotate(1turn)}}

/* Animations */
#aly-scta[data-anim="glow"] .aly-circle::after{
  content:""; position:absolute; inset:-2px; border-radius:50%;
  box-shadow:0 0 0 0 rgba(29,74,218,.35);
  animation:aly-glow 2.6s ease-out infinite;
}
@keyframes aly-glow{
  0%{box-shadow:0 0 0 0 rgba(29,74,218,.35)}
  70%{box-shadow:0 0 0 12px rgba(29,74,218,0)}
  100%{box-shadow:0 0 0 12px rgba(29,74,218,0)}
}
#aly-scta[data-anim="pulse"] .aly-circle{
  animation:aly-pulse 2.2s ease-in-out infinite;
}
@keyframes aly-pulse{
  0%,100%{transform:scale(1)}50%{transform:scale(1.03)}
}

/* Close button */
#aly-scta .aly-close{
  position:absolute; top:-6px; inset-inline-end:-6px;
  width:22px;height:22px;border-radius:50%;border:none;cursor:pointer;
  background:#fff;color:#111; box-shadow:0 2px 10px rgba(0,0,0,.15);
  font-size:14px; line-height:1;
}

/* dynamic offsets */
#aly-scta{ transform: translate(var(--ox,0), var(--oy,0)); }

@media (max-height:480px){ #aly-scta .aly-pill{display:none} }