/*############### DEKSTOP ###############*/
@media screen and (min-width: 1024px) {
    /*#region >>>>> XXX*/
    
    /*#endregion*/
}


/*############### TABLET ###############*/
@media screen and (min-width: 768px) and (max-width: 1023px) {
    /*#region >>>>> XXX*/
    
    /*#endregion*/
}


/*############### HP ###############*/
@media screen and (max-width: 767px) {
    /*#region >>>>> ALL*/
    *::-webkit-scrollbar {
        display: none;
    }
    /*#endregion*/

    /*#region >>>>> ERROR UI DESIGN*/
    #blazor-error-ui {
        padding: .65rem 1rem .65rem 5rem;
        box-shadow: 0 -1px 25px #00000020;
    }
    #blazor-error-ui .error-wrap {
        gap: .5rem;
    }
    #blazor-error-ui .error-text {
        gap: 0;
    }
    #blazor-error-ui .error-text div:first-child {
        left: -4.5rem;
        width: 4.5rem;
    }
    #blazor-error-ui p:last-child {
        font-size: .8rem;
        line-height: 1.3;
    }
    #blazor-error-ui p span {
        display: none;
    }
    #blazor-error-ui .awMini {
        font-size: .75rem !important;
        padding: .35rem .5rem !important;
    }
    /*#endregion*/

    /*#region >>>>> BLAZOR TOAST*/
    #infoToast .position-topright {
        position: absolute;
        top: unset;
        bottom: 5rem;
        left: 2rem;
        right: 2rem;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    #infoToast .blazored-toast {
        align-items: center;
        gap: .5rem;
        width: fit-content;
        max-width: 350px;
        padding: .6rem .75rem;
        margin-bottom: .75rem;
        border-radius: 6rem;
        user-select: none;
        overflow: hidden;
    }
    #infoToast :is(.blazored-toast-info, .blazored-toast-success, .blazored-toast-warning, .blazored-toast-error) {
        border-top: none;
    }
    #infoToast .blazored-toast-icon {
        font-size: 1rem;
        padding-right: 0;
        min-width: 1.7rem;
        width: 1.7rem;
        height: 1.7rem;
    }
    #infoToast .blazored-toast-message {
        font-size: .85rem;
        line-height: 1.2;
        margin-bottom: 0;
        hyphens: unset;
    }
    #infoToast .blazored-toast-progressbar {
        display: none;
    }
    #infoToast .blazored-toast-progressbar > span {
        height: 100%;
        background-image: linear-gradient(rgba(0, 0, 0, 0.1) 0 0);
    }
    /*#endregion*/

    /*#region >>>>> MODAL FULL MOBILE*/
    #versi-app.e-dialog,
    #add-customer.e-dialog,
    #edit-customer.e-dialog,
    #detail-customer.e-dialog,
    #atur-diskon.e-dialog,
    #atur-contact.e-dialog,
    #detail-inventory.e-dialog,
    #atur-harga-jual.e-dialog,
    #riwayat-penjualan.e-dialog,
    #detail-riwayat-penjualan.e-dialog,
    #pilih-payment.e-dialog,
    #add-grosir.e-dialog,
    #edit-grosir.e-dialog,
    #detail-grosir.e-dialog,
    #pembayaran-grosir.e-dialog,
    #riwayat-penjualan-grosir.e-dialog,
    #detail-riwayat-grosir.e-dialog {
        height: 100% !important;
        max-width: unset !important;
        max-height: unset !important;
        margin: 0 !important;
        border-radius: 0 !important;
    }

    #versi-app.e-dialog .e-dlg-content,
    #add-customer.e-dialog .e-dlg-content,
    #edit-customer.e-dialog .e-dlg-content,
    #detail-customer.e-dialog .e-dlg-content,
    #atur-diskon.e-dialog .e-dlg-content,
    #atur-contact.e-dialog .e-dlg-content,
    #detail-inventory.e-dialog .e-dlg-content,
    #atur-harga-jual.e-dialog .e-dlg-content,
    #riwayat-penjualan.e-dialog .e-dlg-content,
    #detail-riwayat-penjualan.e-dialog .e-dlg-content,
    #pilih-payment.e-dialog .e-dlg-content,
    #add-grosir.e-dialog .e-dlg-content,
    #edit-grosir.e-dialog .e-dlg-content,
    #detail-grosir.e-dialog .e-dlg-content,
    #pembayaran-grosir.e-dialog .e-dlg-content,
    #riwayat-penjualan-grosir.e-dialog .e-dlg-content,
    #detail-riwayat-grosir.e-dialog .e-dlg-content {
        border-radius: 0 !important;
    }
    /*#endregion*/
}