.hPopup.hNumPadLogin {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100svh;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    background: #000000b3;
    flex-direction: column;
}

.hLoading {
    display: flex;
}

.hContainer.notTransThis:not(.swal2-container) {
    display: flex;
    justify-content: center;
    align-content: center;
}
.hContainer.notTransThis:not(.swal2-container) {
    width: 390px; 
}
.hLoading#htitle {
    display: flex !important;
    justify-content: center;
    align-content: center;
    align-items: center;
}

.hLoading:before {
    content: url(/images/icon/loading.svg);
    width: 30px;
    height: 30px;
}

.hLoading#htitle:before {
    width: 50px;
    height: 50px;
}

.hPopup.hNumPadLogin .swal2-popup {
    width: 625px !important;
    height: 670px !important;
    background: #00000000 !important;
}

.hPopup.hNumPadLogin #htitle {
    /* background: rgba(255, 255, 255, 0.3) !important; */
    color: white !important;
    border-radius: 26px;
    font-size: 35px !important;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.hPopup.hNumPadLogin .authorization-code-login-required {
    background-color: rgb(128, 128, 128,0);
    width: 100% !important;
    font-size: 5em !important;
    text-align: center !important;
    border: none;
    color: white !important;
    cursor: default;
    outline: 0;
    /*pointer-events: none;*/
}

.hPopup.hNumPadLogin .PINbutton {
    cursor: pointer;
    outline: none;
    background: rgb(141 141 141 / 90%) !important;
    color: white;
    border-style: none;
    border-radius: 50% !important;
    font-size: 3rem !important;
    text-align: center !important;
    width: 100px !important;
    height: 100px !important;
    margin: 2% 2% !important;
    padding: 0 !important;
}

    .hPopup.hNumPadLogin .PINbutton.NUMBER-NOT-PIN {
        background: none !important;
        font-size: 1.6rem !important
    }

.hPopup.hNumPadLogin #swal2-html-container {
    overflow: hidden;
}

.hPopup.hNumPadLogin .swal2-html-container::before {
    height: 0px;
}

.hPopup.hNumPadLogin.swal2-container.swal2-backdrop-show {
    background: rgb(0 0 0 / 70%) !important;
}

[type=passwordCustom] {
    -webkit-appearance: none;
    -webkit-text-security: disc;
}

.popup-result-mess {
    font-size: 1.3rem;
    color: red;
    font-weight: 900;
}

.group-button.client-receipt {
    width: 100%;
    display: grid;
    justify-content: space-around;
    align-items: center;
    background-color: unset;
    padding: 10px;
    grid-template-columns: 1fr 1fr;
    grid-gap: var(--px-20);
}

.client-receipt {
    position: relative;
}

.client-receipt {
    position: relative;
}

.btn-footer {
    flex: 1;
    border: 0;
    color: white;
    display: flex;
    border-radius: 4px;
    align-items: center;
    height: var(--px-36);
    justify-content: center;
    background: var(--bs-blue);
    font: normal normal 700 var(--s-17);
}

    .btn-footer.btn-exit-receipt {
        background: var(--bs-gray-500);
    }

    .btn-footer.btn-open-receipt {
        background: var(--bs-green);
    }

.client-receipt-list {
    z-index: 1;
    width: 100%;
    display: none;
    gap: var(--px-6);
    position: absolute;
    width: var(--px-160);
    bottom: var(--px-40);
    flex-direction: column;
    padding: var(--px-12) 0;
    border-radius: var(--px-12);
    box-shadow: var(--shadow-qs-solid);
    margin-top: var(--px-12) !important;
    background: var(--theme-mode-bs-200);
    border: 1px solid var(--theme-mode-border);
}

.client-receipt-list-item {
    display: grid;
    outline: unset;
    box-shadow: unset;
    text-align: start;
    align-items: center;
    height: var(--px-40);
    white-space: nowrap;
    justify-items: start;
    grid-gap: 0 var(--px-10);
    color: var(--qs-txt-solid);
    grid-template-rows: unset;
    max-width: calc(100% - var(--px-16));
    border-radius: 0px 100px 100px 0px;
    padding: var(--px-6) var(--px-12);
    font: normal normal 500 var(--s-14);
    grid-template-columns: var(--px-16) 1fr;
    border-left: 3px solid transparent;
}

    .client-receipt-list-item:hover {
        background: var(--main-color-o);
        border-left: 3px solid var(--main-color);
    }
    
    .client-receipt-list-item i {
        color: var(--main-color);
    }

.client-receipt-list.active {
    display: flex;
}

.client-receipt-list-item-button {
    border: 0 !important;
    outline: 0 !important;
    padding: 0 !important;
    box-shadow: 0 !important;
    font: normal normal 500 var(--s-14);
}

.sidebar-icon-only .sidebar {
    overflow: unset !important;
}

.in-mar-search {
    color: var(--text-color);
}

.client-receipt-list-item-button {
    color: var(--text-color) !important;
}

.book-page-deposit-title {
    font-size: 12px;
    width: 100%;
    text-align: right;
}

.content-popover {
    display: flex;
    flex-direction: column;
}

    .content-popover .scrollBill {
        flex: 1;
    }

    .content-popover .group-button button.btn-exit-receipt {
        background: var(--main-color) !important;
    }

.group-button .btn-footer.btn-footer {
    background: var(--bs-gray-500) !important;
}
@media only screen and (max-width: 1080px) {
    :root {
        --scaleCustom: 0.75;
        --scalePopup:0.75
    }

    .sidebar-icon-only .sidebar .nav:first-child {
        max-height: 60%;
        overflow: auto;
    }
    .sidebar-icon-only .sidebar .nav:first-child::-webkit-scrollbar {
        width: 0.5px;
    }

    .sidebar-icon-only .sidebar .nav .nav-item.hover-open .collapse {
        position: absolute;
        transform: translate3d(0,0,0);
        
    }
    .sidebar-icon-only .sidebar .nav:not(.sub-menu) .nav-item:hover .nav-link {
        background: transparent!important;
    }

    * {
        touch-action: manipulation;
    }
    .scaleDiv{
        scale: var(--scalePopup)!important;
    }
}