.show-qr-code {
    display: flex !important;
}

.new-qr-qode {
height: 327px !important;
-webkit-mask:
    radial-gradient(circle 5px at 0    37%, transparent 98%, #000 100%),
    radial-gradient(circle 5px at 100% 37%, transparent 98%, #000 100%),
    linear-gradient(#000 0 0);
  -webkit-mask-composite: destination-out, destination-out, source-over;
  mask:
    radial-gradient(circle 5px at 0    37%, transparent 98%, #000 100%),
    radial-gradient(circle 5px at 100% 37%, transparent 98%, #000 100%),
    linear-gradient(#000 0 0);
  mask-composite: exclude;  /* support varies */
}

.ios-qr-qode {
    height: 172px !important;
    width: 197px !important;
    margin-left: -100px !important;
}

.mask .ios-qr-qode {
    margin-left: 0 !important;
}

.mask .ios-qr-btn {
    margin: 0 !important;
}

.mask .ios-tutorials-btn {
    margin-top: 16px !important;
}

.ios-qr-qode .qr-btns-container {
    margin-bottom: 12px !important;
}

.ios-qr-qode .qr-btns-container .qr-btn{
    width: 177px !important;
}

.ios-qr-qode .qr-btns-container .qr-btn a {
    width: 177px !important;
}


.note-app-store {
    padding: 8px;
    background-color: #FFF7F0;
    border-radius: 5px;
    color: #FB8627;
    margin-top: 6px;
    margin-bottom: 12px;
    width: 177px !important;
}

.ios-tutorials-btn {
    margin: 0 !important;
}
.ios-qr-btn {
    width: 177px !important;
    height: 38px !important;
}
.ios-qr-btn a {
    width: 177px !important;
    height: 38px !important;
}

/* qr buttons style */
.qr-btns-container {
    margin-bottom: 16px;
    width: 100% !important;
    border-bottom: 1px dashed #D6D5DF;
    height: fit-content !important;
    position: relative;
}


.android-qr-btn {
    width: 160px !important;
    height: 38px !important;
}
.qr-btn {
    background-color: transparent;
    border: 1px solid #D6D5DF;
    border-radius: 6px;
    margin-top: 16px ;
}

.qr-btn:hover {
    border:1px solid #AEAEFA !important;
    background-color: #fff;
}

.mask .qr-btn:hover {
    border:1px solid #DFDFFD !important;
    background-color: #DFDFFD;
}

.mask .qr-btn {
    background-color: #fff;
}

.qr-btn:hover a {
    color: #5E5EF6 !important;
    /* border:1px solid #AEAEFA !important; */
}

.tutorial-link {
    margin-top: 12px;
    margin-bottom: 16px ;
}
.android-qr-btn a {
    width: 160px !important;
    height: 38px !important;
}
.qr-btn a {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: transparent !important;
    color: #211D45 !important;
    cursor: pointer;
    font-size: 14px !important;
}

.mask .qr-btn a {
    color: #5E5EF6 !important;
}

/* .mask .qr-btn:hover a {
    color: #fff !important;
} */

.mask .qr-btns-container {
    margin: 0 !important;
}

#iosMask .qr-btns-container {
    width: 87% !important;
}

.qr-btn a img {
    width: 16px !important;
    height: 16px !important;
    margin-right: 5px !important;
    position: static !important ;
    transform: none !important;
}


.qr-download-note {
    margin: 0 !important;
    font-size: 12px !important;
}










/* android-pop */
  .overlay-android-pop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6); /* لون أسود شفاف */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 3000;
  }

  .popup {
    background: white;
    width: 250px;
    /* min-height: 200px; */
    border-radius: 10px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.3);
    padding:40px 16px 0px 16px;
    position: relative;
  }

  .close-btn-apk {
    position: absolute;
    top: 8px;
    right: 8px;
    font-size: 25px;
    border: none;
    background: none;
    cursor: pointer;
    /* width: 30px;
    height: 30px; */
  }

  .title-android-pop {
    position: absolute;
    top: 18px;
    left: 16px;
    font-size: 16px;
    border: none;
    background: none;
    cursor: pointer;
    font-size: 14px;
    color: #211D45;
  }

  .popup .qr-btns-container {
    border: none;
    margin:0 !important;
    margin-top: 20px;
    width: 100%;
  }

  .popup .qr-btns-container .qr-btn {
    width: 100% !important;
  }

  .popup .qr-btns-container .qr-btn a{
    width: 100% !important;
    font-size: 14px;
  }

  .popup .ios-qr-btns-container {
    margin-top: 20px;
    width: 100%;
    margin:0 !important;
    border-bottom: 1px dashed #D6D5DF;
  }

  .popup .ios-qr-btn, .popup .ios-qr-btn a {
    width: 100% !important;
  }

  .popup .note-app-store {
    width: 100% !important;
  }

  .popup .ios-tutorials-btn {
    margin: 16px 0 !important;
  }