@font-face{
  font-family:'TajawalUploaded';
  src:url('/fonts/Tajawal-Regular.ttf') format('truetype');
  font-weight:400 900;
  font-style:normal;
  font-display:swap;
}
:root{
  --abyan-font-ar:'TajawalUploaded','Tajawal',Arial,sans-serif!important;
  --abyan-font-num:'TajawalUploaded','Tajawal',Arial,sans-serif!important;
  --abyan-font-heading:'TajawalUploaded','Tajawal',Arial,sans-serif!important;
}
html,body,body *,button,input,select,textarea,table,td,th,a,
.dub-shell,.wrap,.card,.btn,.nav,.bottom-nav,.account-menu,.account-trigger,
.package-card,.news-card,.trade-panel,.trade-page,.trades-page,.dashboard-plan-item,
.member-action-tile,.wallet-action,.abyan-contact-widget,.abyan-contact-widget *{
  font-family:var(--abyan-font-ar)!important;
}
h1,h2,h3,h4,h5,h6,.brand,.dub-search,.section-title h1,.section-title h2,
.trade-title-with-icon,.card-title,.page-title,.package-card h3,.news-card h3{
  font-family:var(--abyan-font-heading)!important;
  font-weight:900!important;
}
.abyan-contact-widget{
  position:fixed!important;
  left:0!important;
  right:auto!important;
  top:auto!important;
  bottom:118px!important;
  margin:0!important;
  transform:none!important;
  z-index:99999!important;
}
html[dir="ltr"] .abyan-contact-widget{
  left:0!important;
  right:auto!important;
}
.abyan-contact-label{
  left:58px!important;
  right:auto!important;
}
html[dir="ltr"] .abyan-contact-label{
  left:58px!important;
  right:auto!important;
}
.float-contact{
  position:fixed!important;
  left:0!important;
  right:auto!important;
  top:auto!important;
  bottom:105px!important;
  margin:0!important;
  transform:none!important;
  z-index:99999!important;
}
@media(max-width:700px){
  .abyan-contact-widget{left:0!important;right:auto!important;bottom:88px!important;transform:none!important;margin:0!important;}
  html[dir="ltr"] .abyan-contact-widget{left:0!important;right:auto!important;}
  .float-contact{left:0!important;right:auto!important;bottom:88px!important;transform:none!important;margin:0!important;}
}

/* USERFIX2: force contact bubble itself to the exact left edge.
   Cause fixed: previous closed panel still occupied flex width, and another React bubble had inline positioning. */
html body .abyan-contact-widget[data-abyan-contact-widget]{
  position:fixed!important;
  inset:auto auto 118px 0!important;
  left:0!important;
  right:auto!important;
  top:auto!important;
  bottom:118px!important;
  width:52px!important;
  max-width:52px!important;
  min-width:52px!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  transform:none!important;
  translate:none!important;
  display:block!important;
  z-index:2147483000!important;
  direction:rtl!important;
  overflow:visible!important;
}
html body .abyan-contact-widget[data-abyan-contact-widget] .abyan-contact-toggle{
  position:relative!important;
  left:0!important;
  right:auto!important;
  top:auto!important;
  bottom:auto!important;
  margin:0!important;
  transform:none!important;
  translate:none!important;
  display:grid!important;
  width:52px!important;
  height:52px!important;
}
html body .abyan-contact-widget[data-abyan-contact-widget] .abyan-contact-panel{
  position:absolute!important;
  left:61px!important;
  right:auto!important;
  bottom:0!important;
  top:auto!important;
  width:190px!important;
  min-width:190px!important;
  max-width:min(72vw,220px)!important;
  margin:0!important;
  transform:translateX(-10px) scale(.92)!important;
  transform-origin:left bottom!important;
}
html body .abyan-contact-widget[data-abyan-contact-widget].open .abyan-contact-panel{
  transform:translateX(0) scale(1)!important;
}
html body .abyan-contact-widget[data-abyan-contact-widget] .abyan-contact-label{
  position:absolute!important;
  left:60px!important;
  right:auto!important;
  bottom:8px!important;
  top:auto!important;
  margin:0!important;
  transform:none!important;
}
html body .theme-toggle-floating{
  left:62px!important;
  right:auto!important;
}
@media(max-width:700px){
  html body .abyan-contact-widget[data-abyan-contact-widget]{
    inset:auto auto 88px 0!important;
    left:0!important;
    right:auto!important;
    bottom:88px!important;
    width:47px!important;
    max-width:47px!important;
    min-width:47px!important;
  }
  html body .abyan-contact-widget[data-abyan-contact-widget] .abyan-contact-toggle{
    width:47px!important;
    height:47px!important;
  }
  html body .abyan-contact-widget[data-abyan-contact-widget] .abyan-contact-panel{
    left:55px!important;
    right:auto!important;
    bottom:0!important;
    width:176px!important;
    min-width:176px!important;
    max-width:min(72vw,210px)!important;
  }
  html body .theme-toggle-floating{
    left:56px!important;
    right:auto!important;
  }
}