/* ==========================================================
   زيت علاء V54 — زر دعم فني قابل للسحب
   ========================================================== */

/* إزالة خط/علامة التمرير الملونة من جوانب الشاشة */
html,
body{
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
*::-webkit-scrollbar{
  width:0!important;
  height:0!important;
  display:none!important;
}

/* يبدأ المحتوى مباشرة دون مساحة الهيدر القديم */
.homeShell{
  padding-top:12px!important;
}

.customerSupport{
  position:fixed;
  left:14px;
  top:auto;
  bottom:22px;
  width:56px;
  height:56px;
  z-index:2147481000;
  direction:rtl;
  user-select:none;
  -webkit-user-select:none;
}

.customerSupportMenu{
  position:absolute;
  left:0;
  bottom:calc(100% + 10px);
  width:max-content;

  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:9px;

  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(9px) scale(.95);
  transform-origin:left bottom;

  transition:
    opacity .2s ease,
    visibility .2s ease,
    transform .2s ease;
}

.customerSupport.menu-align-right .customerSupportMenu{
  left:auto;
  right:0;
  transform-origin:right bottom;
}

.customerSupport.menu-below .customerSupportMenu{
  top:calc(100% + 10px);
  bottom:auto;
  transform:translateY(-9px) scale(.95);
  transform-origin:left top;
}

.customerSupport.menu-below.menu-align-right .customerSupportMenu{
  transform-origin:right top;
}

.customerSupport.is-open .customerSupportMenu{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0) scale(1);
}

.customerSupportChoice{
  min-width:158px;
  min-height:50px;
  padding:9px 13px;

  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:10px;

  border:1px solid rgba(255,255,255,.14);
  border-radius:17px;
  background:rgba(12,10,12,.96);
  color:#fff;

  font-size:14px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;

  box-shadow:
    0 16px 38px rgba(0,0,0,.42),
    inset 0 1px 0 rgba(255,255,255,.05);

  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);

  transition:
    transform .18s ease,
    border-color .18s ease,
    background .18s ease;
}

.customerSupportChoice:hover,
.customerSupportChoice:focus-visible{
  transform:translateX(-2px);
  border-color:rgba(239,63,114,.68);
  background:rgba(33,13,21,.98);
  outline:none;
}

.customerSupportChoiceIcon{
  width:34px;
  height:34px;
  flex:0 0 34px;

  display:grid;
  place-items:center;

  border-radius:11px;
  background:rgba(255,255,255,.07);
}

.customerSupportChoice svg{
  width:19px;
  height:19px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.customerSupportWhats .customerSupportChoiceIcon{
  color:#62e891;
  background:rgba(34,197,94,.12);
}

.customerSupportWhats svg path:nth-child(2){
  fill:currentColor;
  stroke:none;
}

.customerSupportCall .customerSupportChoiceIcon{
  color:#ff7ca2;
  background:rgba(239,63,114,.12);
}

.customerSupportButton{
  width:56px;
  height:56px;
  padding:0;

  display:grid;
  place-items:center;

  border:1px solid rgba(255,255,255,.16);
  border-radius:50%;
  color:#fff;
  background:linear-gradient(145deg,#f13f73,#a10e39);

  box-shadow:
    0 18px 42px rgba(0,0,0,.42),
    0 10px 28px rgba(217,31,87,.25),
    inset 0 1px 0 rgba(255,255,255,.15);

  touch-action:none;
  cursor:grab;

  transition:
    transform .18s ease,
    filter .18s ease,
    box-shadow .18s ease;
}

.customerSupportButton:hover,
.customerSupportButton:focus-visible{
  transform:translateY(-2px);
  filter:brightness(1.07);
  outline:none;

  box-shadow:
    0 22px 48px rgba(0,0,0,.46),
    0 12px 34px rgba(217,31,87,.34),
    0 0 0 4px rgba(239,63,114,.12);
}

.customerSupport.is-dragging{
  transition:none!important;
}

.customerSupport.is-dragging .customerSupportButton{
  cursor:grabbing;
  transform:scale(1.06);
  filter:brightness(1.10);
  box-shadow:
    0 24px 52px rgba(0,0,0,.48),
    0 14px 38px rgba(217,31,87,.40),
    0 0 0 5px rgba(239,63,114,.13);
}

.customerSupportButton svg{
  width:25px;
  height:25px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  pointer-events:none;
}

@media(max-width:640px){
  .homeShell{
    padding-top:8px!important;
  }

  .customerSupport{
    width:52px;
    height:52px;
  }

  .customerSupportButton{
    width:52px;
    height:52px;
  }

  .customerSupportButton svg{
    width:23px;
    height:23px;
  }

  .customerSupportChoice{
    min-width:146px;
    min-height:47px;
    padding:8px 11px;
    border-radius:15px;
    font-size:13px;
  }

  .customerSupportChoiceIcon{
    width:32px;
    height:32px;
    flex-basis:32px;
  }
}

@media(max-width:380px){
  .customerSupport{
    width:49px;
    height:49px;
  }

  .customerSupportButton{
    width:49px;
    height:49px;
  }
}

@media print{
  .customerSupport{
    display:none!important;
  }
}