/* Right fixed smart button - safe visual patch only */
.fab-group{
  right:18px !important;
  left:auto !important;
  bottom:auto !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  z-index:120 !important;
}

.fab-main{
  width:64px !important;
  height:64px !important;
  border-radius:50% !important;
  background:linear-gradient(135deg,#0f4a42,#08332e) !important;
  box-shadow:0 18px 38px rgba(9,50,45,.28) !important;
  position:relative;
  overflow:hidden;
}

.fab-main i{
  position:relative;
  z-index:2;
  color:#e8cb8d !important;
}

.fab-main::before{
  content:"";
  position:absolute;
  inset:15px 11px 13px;
  border-radius:50%;
  border-bottom:4px solid rgba(232,203,141,.95);
  transform:rotate(-8deg);
  opacity:.95;
}

.fab-main::after{
  content:"";
  position:absolute;
  width:25px;
  height:3px;
  border-radius:999px;
  background:rgba(255,255,255,.88);
  bottom:20px;
  left:19px;
  box-shadow:0 -7px 0 rgba(255,255,255,.38);
  transform:rotate(-10deg);
}

.fab-item{
  right:76px !important;
  left:auto !important;
  bottom:auto !important;
  min-width:145px;
  padding:12px 16px !important;
  border-radius:999px !important;
  background:#fff !important;
  color:#0f4a42 !important;
  border:1px solid rgba(15,74,66,.12) !important;
  box-shadow:0 14px 34px rgba(9,50,45,.12) !important;
  transform:translateX(18px) scale(.86) !important;
  transform-origin:right center !important;
}

.fab-item:nth-child(2){
  top:-28px !important;
}

.fab-item:nth-child(3){
  top:30px !important;
}

.fab-item:first-of-type{
  background:linear-gradient(135deg,#c8a35f,#9a7535) !important;
  color:#fff !important;
  border-color:transparent !important;
}

.fab-item span{
  display:inline !important;
  font-weight:900;
}

.fab-group.open .fab-item{
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  transform:translateX(0) scale(1) !important;
}

@media (hover:hover){
  .fab-group:hover .fab-item{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:translateX(0) scale(1) !important;
  }
}

@media(max-width:760px){
  .fab-group{
    right:8px !important;
    top:auto !important;
    bottom:124px !important;
    transform:none !important;
  }

  .fab-main{
    width:58px !important;
    height:58px !important;
  }

  .fab-item{
    right:66px !important;
    min-width:132px;
    padding:11px 13px !important;
  }

  .fab-item span{
    display:inline !important;
    font-size:.9rem;
  }

  .fab-item:nth-child(2){
    top:-26px !important;
  }

  .fab-item:nth-child(3){
    top:28px !important;
  }
}


/* =========================================================
   RESTORE FAB MOTION
   حركة تدوير عند ظهور الأزرار وتدوير عكسي عند الاختفاء
   ========================================================= */
.fab-main{
  transition:transform .34s cubic-bezier(.2,.9,.2,1), box-shadow .28s ease, filter .28s ease !important;
  will-change:transform !important;
}

.fab-group.open .fab-main{
  transform:rotate(135deg) scale(1.04) !important;
  box-shadow:0 24px 52px rgba(9,50,45,.34) !important;
}

.fab-item{
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transition:
    opacity .30s ease,
    visibility .30s ease,
    transform .38s cubic-bezier(.2,.9,.2,1) !important;
  transform:translateX(26px) rotate(-18deg) scale(.72) !important;
  will-change:transform,opacity !important;
}

.fab-item:nth-child(2){
  transition-delay:0ms !important;
}

.fab-item:nth-child(3){
  transition-delay:45ms !important;
}

.fab-group.open .fab-item{
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
  transform:translateX(0) rotate(0deg) scale(1) !important;
}

.fab-group:not(.open) .fab-item:nth-child(2){
  transition-delay:45ms !important;
}

.fab-group:not(.open) .fab-item:nth-child(3){
  transition-delay:0ms !important;
}

@media (hover:hover){
  .fab-group:hover .fab-main{
    transform:rotate(135deg) scale(1.04) !important;
    box-shadow:0 24px 52px rgba(9,50,45,.34) !important;
  }

  .fab-group:hover .fab-item{
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    transform:translateX(0) rotate(0deg) scale(1) !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .fab-main,
  .fab-item{
    transition:none !important;
  }
}


/* =========================================================
   FINAL FAB ROTATION MOTION - open and reverse close
   ========================================================= */
@keyframes smartFabOpenSpin{
  0%{ transform:rotate(0deg) scale(1); }
  72%{ transform:rotate(155deg) scale(1.07); }
  100%{ transform:rotate(135deg) scale(1.04); }
}

@keyframes smartFabCloseSpin{
  0%{ transform:rotate(135deg) scale(1.04); }
  100%{ transform:rotate(0deg) scale(1); }
}

@keyframes smartFabItemOpen{
  0%{ opacity:0; visibility:hidden; transform:translateX(30px) rotate(-24deg) scale(.68); }
  100%{ opacity:1; visibility:visible; transform:translateX(0) rotate(0deg) scale(1); }
}

@keyframes smartFabItemClose{
  0%{ opacity:1; visibility:visible; transform:translateX(0) rotate(0deg) scale(1); }
  100%{ opacity:0; visibility:hidden; transform:translateX(30px) rotate(24deg) scale(.68); }
}

.fab-main{
  transform:rotate(0deg) scale(1) !important;
  transition:box-shadow .28s ease, filter .28s ease !important;
}

.fab-group.open .fab-main{
  animation:smartFabOpenSpin .42s cubic-bezier(.2,.9,.2,1) forwards !important;
}

.fab-group.closing .fab-main{
  animation:smartFabCloseSpin .36s cubic-bezier(.2,.9,.2,1) forwards !important;
}

.fab-item{
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transform:translateX(30px) rotate(-24deg) scale(.68) !important;
}

.fab-group.open .fab-item{
  animation:smartFabItemOpen .38s cubic-bezier(.2,.9,.2,1) forwards !important;
  pointer-events:auto !important;
}

.fab-group.closing .fab-item{
  animation:smartFabItemClose .32s cubic-bezier(.2,.9,.2,1) forwards !important;
  pointer-events:none !important;
}

.fab-group.open .fab-item:nth-child(2){ animation-delay:20ms !important; }
.fab-group.open .fab-item:nth-child(3){ animation-delay:75ms !important; }
.fab-group.closing .fab-item:nth-child(2){ animation-delay:65ms !important; }
.fab-group.closing .fab-item:nth-child(3){ animation-delay:0ms !important; }

@media (hover:hover){
  .fab-group:hover .fab-main{
    animation:smartFabOpenSpin .42s cubic-bezier(.2,.9,.2,1) forwards !important;
  }

  .fab-group:hover .fab-item{
    animation:smartFabItemOpen .38s cubic-bezier(.2,.9,.2,1) forwards !important;
    pointer-events:auto !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .fab-main,
  .fab-item{
    animation:none !important;
    transition:none !important;
  }
}

/* =========================================================
   MICRO FINAL: full spin open + reverse full spin close
   ========================================================= */
@keyframes smartFabOpenSpin{
  0%{ transform:rotate(0deg) scale(1); }
  70%{ transform:rotate(390deg) scale(1.08); }
  100%{ transform:rotate(360deg) scale(1.04); }
}

@keyframes smartFabCloseSpin{
  0%{ transform:rotate(360deg) scale(1.04); }
  100%{ transform:rotate(0deg) scale(1); }
}

.fab-group.open .fab-main{
  animation:smartFabOpenSpin .56s cubic-bezier(.2,.9,.2,1) forwards !important;
}

.fab-group.closing .fab-main{
  animation:smartFabCloseSpin .48s cubic-bezier(.2,.9,.2,1) forwards !important;
}

.fab-group.open .fab-item{
  animation-duration:.46s !important;
}

.fab-group.closing .fab-item{
  animation-duration:.40s !important;
}

/* =========================================================
   SMART FINAL MAGIC FAB MOTION - visual only
   دوران كامل عند فتح الأزرار + دوران عكسي كامل عند الإغلاق
   ========================================================= */
@keyframes smartMagicFabOpenSpin20260510{
  0%{ transform:rotate(0deg) scale(1); filter:brightness(1); }
  55%{ transform:rotate(310deg) scale(1.10); filter:brightness(1.12); }
  78%{ transform:rotate(382deg) scale(1.06); }
  100%{ transform:rotate(360deg) scale(1.04); filter:brightness(1.04); }
}

@keyframes smartMagicFabCloseSpin20260510{
  0%{ transform:rotate(360deg) scale(1.04); filter:brightness(1.04); }
  45%{ transform:rotate(70deg) scale(1.07); filter:brightness(1.08); }
  100%{ transform:rotate(0deg) scale(1); filter:brightness(1); }
}

@keyframes smartMagicFabItemOpen20260510{
  0%{ opacity:0; visibility:hidden; transform:translateX(42px) translateY(10px) rotate(-42deg) scale(.54); filter:blur(2px); }
  64%{ opacity:1; visibility:visible; transform:translateX(-4px) translateY(0) rotate(7deg) scale(1.06); filter:blur(0); }
  100%{ opacity:1; visibility:visible; transform:translateX(0) translateY(0) rotate(0deg) scale(1); filter:blur(0); }
}

@keyframes smartMagicFabItemClose20260510{
  0%{ opacity:1; visibility:visible; transform:translateX(0) translateY(0) rotate(0deg) scale(1); filter:blur(0); }
  100%{ opacity:0; visibility:hidden; transform:translateX(42px) translateY(10px) rotate(42deg) scale(.54); filter:blur(2px); }
}

.fab-group .fab-main{
  transform:rotate(0deg) scale(1) !important;
  transform-origin:center center !important;
  transition:box-shadow .25s ease, filter .25s ease !important;
  will-change:transform,filter !important;
}

.fab-group.open .fab-main{
  animation:smartMagicFabOpenSpin20260510 .72s cubic-bezier(.18,.92,.22,1) forwards !important;
  box-shadow:0 26px 58px rgba(9,50,45,.38), 0 0 0 8px rgba(200,163,95,.10) !important;
}

.fab-group.closing .fab-main{
  animation:smartMagicFabCloseSpin20260510 .62s cubic-bezier(.18,.92,.22,1) forwards !important;
  box-shadow:0 18px 38px rgba(9,50,45,.28) !important;
}

.fab-group .fab-item{
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
  transform:translateX(42px) translateY(10px) rotate(-42deg) scale(.54) !important;
  transform-origin:right center !important;
  will-change:transform,opacity,filter !important;
}

.fab-group.open .fab-item{
  animation:smartMagicFabItemOpen20260510 .54s cubic-bezier(.18,.92,.22,1) forwards !important;
  pointer-events:auto !important;
}

.fab-group.closing .fab-item{
  animation:smartMagicFabItemClose20260510 .42s cubic-bezier(.55,.02,.72,.28) forwards !important;
  pointer-events:none !important;
}

.fab-group.open .fab-item:nth-child(2){ animation-delay:.08s !important; }
.fab-group.open .fab-item:nth-child(3){ animation-delay:.16s !important; }
.fab-group.closing .fab-item:nth-child(2){ animation-delay:.04s !important; }
.fab-group.closing .fab-item:nth-child(3){ animation-delay:0s !important; }

/* نعتمد النقر أساسًا، ونلغي فتح الأزرار بمجرد المرور حتى لا تتعارض الحركة */
@media (hover:hover){
  .fab-group:hover .fab-main{
    animation:none;
  }
  .fab-group:not(.open):not(.closing):hover .fab-item{
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transform:translateX(42px) translateY(10px) rotate(-42deg) scale(.54) !important;
  }
}

@media (prefers-reduced-motion:reduce){
  .fab-group.open .fab-main,
  .fab-group.closing .fab-main,
  .fab-group.open .fab-item,
  .fab-group.closing .fab-item{
    animation:none !important;
  }
}