@import '_content/Blazored.Modal/Blazored.Modal.bundle.scp.css';
@import '_content/Blazored.Toast/Blazored.Toast.bundle.scp.css';
@import '_content/ES.Web.Components/ES.Web.Components.mygcs4x2hg.bundle.scp.css';
@import '_content/Microsoft.AspNetCore.Components.QuickGrid/Microsoft.AspNetCore.Components.QuickGrid.boiwgh0w5b.bundle.scp.css';
@import '_content/Microsoft.FluentUI.AspNetCore.Components/Microsoft.FluentUI.AspNetCore.Components.bundle.scp.css';

/* /Components/Account/Pages/Login.razor.rz.scp.css */


.login-box-body[b-mhbxaby2t9], .register-box-body[b-mhbxaby2t9] {
    background: #fff;
    padding: 20px;
    border-top: 0;
    color: #666;
}


.login-box-msg[b-mhbxaby2t9], .register-box-msg[b-mhbxaby2t9] {
    margin: 0;
    text-align: center;
    padding: 0 20px 20px 20px;
}

.login-page[b-mhbxaby2t9], .register-page[b-mhbxaby2t9] {
    background: #d2d6de;
}

.login-logo[b-mhbxaby2t9], .register-logo[b-mhbxaby2t9] {
    font-size: 35px;
    text-align: center;
    margin-bottom: 25px;
    font-weight: 300;
}

.img-circle[b-mhbxaby2t9] {
    border-radius: 50%;
}


.form-control[b-mhbxaby2t9] {
    border-radius: 0px !important;
    box-shadow: none;
    border-color: #d2d6de;
}


.input-group  .form-control[b-mhbxaby2t9] {
    border-radius: 0 !important;
}


body[b-mhbxaby2t9] {
    background: #d2d6de;
    height: 100%;
    margin: 0;
}


.input-group-text[b-mhbxaby2t9] {
    border-radius: 0;
}

.btn-login-primary[b-mhbxaby2t9] {
    border-radius: 0;
    color: #fff;
    background-color: #337ab7;
    border-color: #2e6da4;
    width: 150px;
    height: 35px;
}
/* /Components/Common/CustomerPopUpDisplayDiv.razor.rz.scp.css */
.blazored-modal[b-7chadc1mw2] {
    display: flex;
    z-index: 102;
    flex-direction: column;
    background-color: #fff;
    border-radius: 4px;
    border: 1px solid #fff;
    padding: 1.5rem;
    box-shadow: 0 2px 2px rgb(0 0 0 / 25%);
}

/* /Components/Common/LocationPopUpDisplay.razor.rz.scp.css */

.table > :not(caption) > * > *[b-3fflf90mun] {
    background-color: transparent;
}

tbody tr:hover[b-3fflf90mun] {
    background-color: #7fccee; /*--- this is a blue color when  hover ---*/
}

tbody tr:focus[b-3fflf90mun] {
    background-color: #f3f3f3; /*--- this is a gray color when clicked---*/
}

tr:nth-child(even)[b-3fflf90mun] {
    background-color: var(--bs-gray-400);
}

.popupid[b-3fflf90mun] {
    min-width: 100px;
    max-width: 150px;
}

.popupdescription[b-3fflf90mun] {
    min-width: 200px;
    max-width: 400px;
}

@include media-breakpoint-up(sm) {
    .popupid[b-3fflf90mun] {
        min-width: 100px;
        max-width: 150px;
    }

    .popupdescription[b-3fflf90mun] {
        min-width: 200px;
        max-width: 200px;
    }
}
/* /Components/Common/PaymentView.razor.rz.scp.css */

.blazored-modal-header[b-hmo4ml1lmq] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 0;
}
/* /Components/Common/ProductPopUpDisplay.razor.rz.scp.css */

.table > :not(caption) > * > *[b-og1wjso66a] {
    background-color: transparent;
}

tbody tr:hover[b-og1wjso66a] {
    background-color: #7fccee; /*--- this is a blue color when  hover ---*/
}

tbody tr:focus[b-og1wjso66a] {
    background-color: #f3f3f3; /*--- this is a gray color when clicked---*/
}

tr:nth-child(even)[b-og1wjso66a] {
    background-color: var(--bs-gray-400);
}

.popupid[b-og1wjso66a] {
    min-width: 60px;
    max-width: 150px;
}
.popupdescription[b-og1wjso66a] {
    min-width: 200px;
    max-width: 400px;
}

@include media-breakpoint-up(sm) {
    .popupid[b-og1wjso66a] {
        min-width: 100px;
        max-width: 150px;
    }
    .popupdescription[b-og1wjso66a] {
        min-width: 200px;
        max-width: 200px;
    }
}

/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-holl8394ea] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-holl8394ea] {
    flex: 1;
}

.sidebar[b-holl8394ea] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-holl8394ea] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-holl8394ea]  a, .top-row[b-holl8394ea]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-holl8394ea]  a:hover, .top-row[b-holl8394ea]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-holl8394ea]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-holl8394ea] {
        justify-content: space-between;
    }

    .top-row[b-holl8394ea]  a, .top-row[b-holl8394ea]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-holl8394ea] {
        flex-direction: row;
    }

    .sidebar[b-holl8394ea] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-holl8394ea] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-holl8394ea]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-holl8394ea], article[b-holl8394ea] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-holl8394ea] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-holl8394ea] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* /Components/Layout/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-cpsm70daxa] {
    appearance: none;
    cursor: pointer;
    width: 3.5rem;
    height: 2.5rem;
    color: white;
    position: absolute;
    top: 0.5rem;
    right: 1rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") no-repeat center/1.75rem rgba(255, 255, 255, 0.1);
}

.navbar-toggler:checked[b-cpsm70daxa] {
    background-color: rgba(255, 255, 255, 0.5);
}

.top-row[b-cpsm70daxa] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-cpsm70daxa] {
    font-size: 1.1rem;
}

.bi[b-cpsm70daxa] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-cpsm70daxa] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-cpsm70daxa] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-cpsm70daxa] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.bi-lock-nav-menu[b-cpsm70daxa] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a2 2 0 0 1 2 2v4H6V3a2 2 0 0 1 2-2zm3 6V3a3 3 0 0 0-6 0v4a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2zM5 8h6a1 1 0 0 1 1 1v5a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V9a1 1 0 0 1 1-1z'/%3E%3C/svg%3E");
}

.bi-person-nav-menu[b-cpsm70daxa] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person' viewBox='0 0 16 16'%3E%3Cpath d='M8 8a3 3 0 1 0 0-6 3 3 0 0 0 0 6Zm2-3a2 2 0 1 1-4 0 2 2 0 0 1 4 0Zm4 8c0 1-1 1-1 1H3s-1 0-1-1 1-4 6-4 6 3 6 4Zm-1-.004c-.001-.246-.154-.986-.832-1.664C11.516 10.68 10.289 10 8 10c-2.29 0-3.516.68-4.168 1.332-.678.678-.83 1.418-.832 1.664h10Z'/%3E%3C/svg%3E");
}

.bi-person-badge-nav-menu[b-cpsm70daxa] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-badge' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 2a.5.5 0 0 0 0 1h3a.5.5 0 0 0 0-1h-3zM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0z'/%3E%3Cpath d='M4.5 0A2.5 2.5 0 0 0 2 2.5V14a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2.5A2.5 2.5 0 0 0 11.5 0h-7zM3 2.5A1.5 1.5 0 0 1 4.5 1h7A1.5 1.5 0 0 1 13 2.5v10.795a4.2 4.2 0 0 0-.776-.492C11.392 12.387 10.063 12 8 12s-3.392.387-4.224.803a4.2 4.2 0 0 0-.776.492V2.5z'/%3E%3C/svg%3E");
}

.bi-person-fill-nav-menu[b-cpsm70daxa] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-person-fill' viewBox='0 0 16 16'%3E%3Cpath d='M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z'/%3E%3C/svg%3E");
}

.bi-arrow-bar-left-nav-menu[b-cpsm70daxa] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-arrow-bar-left' viewBox='0 0 16 16'%3E%3Cpath d='M12.5 15a.5.5 0 0 1-.5-.5v-13a.5.5 0 0 1 1 0v13a.5.5 0 0 1-.5.5ZM10 8a.5.5 0 0 1-.5.5H3.707l2.147 2.146a.5.5 0 0 1-.708.708l-3-3a.5.5 0 0 1 0-.708l3-3a.5.5 0 1 1 .708.708L3.707 7.5H9.5a.5.5 0 0 1 .5.5Z'/%3E%3C/svg%3E");
}

.nav-item[b-cpsm70daxa] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-cpsm70daxa] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-cpsm70daxa] {
        padding-bottom: 1rem;
    }

    .nav-item[b-cpsm70daxa]  .nav-link {
        color: #d7d7d7;
        background: none;
        border: none;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        width: 100%;
    }

.nav-item[b-cpsm70daxa]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-cpsm70daxa]  .nav-link:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

.nav-scrollable[b-cpsm70daxa] {
    display: none;
}

.navbar-toggler:checked ~ .nav-scrollable[b-cpsm70daxa] {
    display: block;
}

@media (min-width: 641px) {
    .navbar-toggler[b-cpsm70daxa] {
        display: none;
    }

    .nav-scrollable[b-cpsm70daxa] {
        /* Never collapse the sidebar for wide screens */
        display: block;

        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }
}
/* /Components/Pages/HeaderDetail/SalesOrderList.razor.rz.scp.css */
[b-vn0km60eas] table {
    min-width: 100%;
    background-color:lightsteelblue;
    /* The v5 grid puts an inline height:100% on its table, which stretched this background over
       the whole 630px scroll box even with few or no rows. */
    height: auto !important;
}

[b-vn0km60eas] table th {
    background-color: lightblue;
}



[b-vn0km60eas] th.country-name {
    min-width: 10rem;
}


/* Don't collapse rows even if they are empty */
[b-vn0km60eas] tbody tr {
    height: 1.8rem;
}


/* Fix height and enable scrolling */
.grid[b-vn0km60eas] {
    height: 36.5rem;
    overflow-y: auto;
}



/* Subtle stripe effect */
[b-vn0km60eas] tr:nth-child(even) {
    background: rgba(255,255,255,0.4);
}
/* /Components/Pages/Inbound/DirectPurchase/DPList.razor.rz.scp.css */
/* /Components/Pages/Inventory/InventoryIndex.razor.rz.scp.css */
/* /Components/Pages/Inventory/StockValueReport.razor.rz.scp.css */

.width-class[b-hfzqv3azl6] {
    max-width: 100px;
}


@media (min-width: 768px) {
    .width-class[b-hfzqv3azl6] {
        min-width: 200px;
        max-width: 200px !important;
    }
}

@media (min-width: 992px) {
    .width-class[b-hfzqv3azl6] {
        min-width: 500px;
        max-width: 500px !important;
    }
}
/* /Components/Pages/Outbound/Invoice/InvoiceIndex.razor.rz.scp.css */
.ModelStickBeforeShow[b-zwrq9wndu4] {
    z-index: 1080 !important;
}


/* /Components/Pages/Outbound/Invoice/ReceivePaymentView.razor.rz.scp.css */
.my-custom-modal-class[b-xa0sih48g1] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 0 !important;
}
/* /Components/Pages/Outbound/SalesOrder/SalesOrderAdmin.razor.rz.scp.css */
.nav-tabs .nav-item.show .nav-link[b-kpiwso3dly], .nav-tabs .nav-link.active[b-kpiwso3dly] {
    border-top: 2px solid green;
    /*border-bottom: 2px solid green;
    background: rgba(0,0,0,.03);*/
}


.card-body[b-kpiwso3dly] {
    
     padding:0 !important;
}




/* /Components/Pages/Outbound/SalesOrder/SalesOrderList.razor.rz.scp.css */
/* /Components/Pages/Outbound/SalesOrder/SalesOrderNew.razor.rz.scp.css */
.nav-tabs .nav-item.show .nav-link[b-wls6vbmceg], .nav-tabs .nav-link.active[b-wls6vbmceg] {
    border-top: 2px solid green;
    /*border-bottom: 2px solid green;
    background: rgba(0,0,0,.03);*/
}


.card-body[b-wls6vbmceg] {
    
     padding:0 !important;
}




/* /Components/Pages/POS/DataResult.razor.rz.scp.css */


[b-uvoy5k1ljv] thead tr {
    background: var(--bs-info);
}


[b-uvoy5k1ljv] tbody .country-name {
    white-space: nowrap;
    overflow: hidden;
    max-width: 0;
    text-overflow: ellipsis;
}

.payment-counter[b-uvoy5k1ljv] {
    padding: 15px;
    border-radius: 10px;
    box-shadow: 0 1px 4px rgba(0,0,0,0.1);
    font-size: 1rem;
}
/* /Components/Pages/POS/POSDashboard.razor.rz.scp.css */
[b-0zq8pp4ouu] th.country-name {
    width: 14rem;
}

/* Subtle stripe effect */
[b-0zq8pp4ouu] tr:nth-child(even) {
    background: rgba(255,255,255,0.4);
}

/* Don't collapse rows even if they are empty */
[b-0zq8pp4ouu] tbody tr {
    height: 1.8rem;
}

.page-size-chooser[b-0zq8pp4ouu] {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
}

    .page-size-chooser select[b-0zq8pp4ouu] {
        margin: 0 1rem;
        padding: 0.25rem 0.5rem;
    }


.form-control:focus[b-0zq8pp4ouu] {
     color: var(--bs-body-color); 
     background-color: var(--bs-body-bg); 
     border:0px;
     border-color: none; 
     outline: 0; 
    box-shadow: 0 0 0 0.25rem rgba(13,110,253,.25);
}
/* /Components/Pages/POS/PriceUpdateForm.razor.rz.scp.css */
.blazored-modal-container[b-7nz4b38lu7] {
    z-index: 1000 !important;
}
/* /Components/Pages/PrintPage/PrintDeliveryOrderWebPage.razor.rz.scp.css */
@media print {
    /* Hide the Print / Cancel buttons on the printout */
    #printIgnore1[b-yyk6z1xzus] {
        display: none !important;
    }
}
/* /Components/Pages/PrintPage/PrintSalesOrderWebPage.razor.rz.scp.css */
@media print {
    @page {
        size: A4 portrait; /* or 'landscape' */
        margin-top: 2cm;
        margin-bottom: 2cm;
        margin-left: 1.5cm;
        margin-right: 1.5cm;
    }

    /* Optional: Hide elements like buttons during printing */
    #printIgnore1[b-7yzd1v8sf9] {
        display: none !important;
    }

    body[b-7yzd1v8sf9] {
        margin: 0;
        padding: 0;
    }

    .card[b-7yzd1v8sf9] {
        box-shadow: none !important;
        border: none !important;
    }
}
/* /Components/Pages/QuickOrder/QuickOrderPage.razor.rz.scp.css */
/* Sticky page header. Bootstrap's .sticky-top (z-index 1020) would sit above the
   Blazored Modal overlay (z-index 100), hiding popups — so stick with a low z-index. */
.qo-header[b-av2e21up7z] {
    position: sticky;
    top: 0;
    z-index: 5;
}

/* Category strip tiles: image with label overlay, colored fallback background. */
.qo-cat-tile[b-av2e21up7z] {
    position: relative;
    flex: 0 0 auto;
    width: 120px;
    height: 70px;
    border: 2px solid #dee2e6;
    border-radius: 0.375rem;
    padding: 0;
    overflow: hidden;
    color: #212529;
}

    .qo-cat-tile img[b-av2e21up7z] {
        /* Whole image, scaled to fit above the 22px label (20px line + padding), 2px inset. */
        position: absolute;
        top: 2px;
        left: 2px;
        width: calc(100% - 4px);
        height: calc(100% - 26px);
        object-fit: contain;
    }

.qo-cat-label[b-av2e21up7z] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 1px 4px;
    background: rgba(255, 255, 255, 0.85);
    font-size: 0.85rem;
    line-height: 20px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.qo-cat-active[b-av2e21up7z] {
    border-color: #0d6efd;
    box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.4);
}

/* Last added/selected line summary at the bottom of the sticky header:
   name on the left, qty × price = amount on the right. */
.qo-last-line[b-av2e21up7z] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.25rem 0.6rem;
    border: 1px solid #cfe2ff;
    border-radius: 0.375rem;
    background: #e7f1ff;
    font-size: 0.9rem;
}

/* Running order total on the strip, set off from the line detail. */
.qo-last-total[b-av2e21up7z] {
    padding-left: 0.6rem;
    border-left: 1px solid #9ec5fe;
    color: #0a58ca;
}

/* Type-ahead results under the search box (inside the sticky header, above the grid). */
.qo-search-dropdown[b-av2e21up7z] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 20; /* above tiles; still below the modal overlay (100) */
    background: #fff;
    border: 1px solid #dee2e6;
    border-radius: 0 0 0.375rem 0.375rem;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
    max-height: 320px;
    overflow-y: auto;
}

.qo-search-item[b-av2e21up7z] {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0.55rem 0.75rem;
    border: 0;
    border-bottom: 1px solid #f1f3f5;
    background: #fff;
    font-size: 0.95rem;
}

    .qo-search-item:hover[b-av2e21up7z],
    .qo-search-item:active[b-av2e21up7z] {
        background: #e7f1ff;
    }

/* Vertical brand strip beside the product grid (only when the category has brands). */
.qo-brand-strip[b-av2e21up7z] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    flex: 0 0 auto;
    position: sticky;
    top: 0;
    max-height: 75vh;
    overflow-y: auto;
}

/* Category-style tile: whole brand image above a name banner at the bottom;
   no image → colored tile (brand color or auto) with the name centered horizontally. */
.qo-brand-tile[b-av2e21up7z] {
    position: relative;
    width: 78px;
    height: 64px;
    flex: 0 0 auto;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.15rem;
    font-size: 0.75rem;
    font-weight: 600;
    border: 2px solid #dee2e6;
    border-radius: 0.375rem;
    background: #fff;
}

    .qo-brand-tile img[b-av2e21up7z] {
        /* Whole image, scaled to fit above the 18px banner (16px line + padding), 2px inset. */
        position: absolute;
        top: 2px;
        left: 2px;
        width: calc(100% - 4px);
        height: calc(100% - 22px);
        object-fit: contain;
    }

.qo-brand-banner[b-av2e21up7z] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 1px 3px;
    background: rgba(33, 37, 41, 0.75);
    color: #fff;
    font-size: 0.7rem;
    line-height: 16px;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.qo-brand-name[b-av2e21up7z] {
    text-align: center;
    line-height: 1.15;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    word-break: break-word;
}

.qo-brand-all[b-av2e21up7z] {
    background: #008b8b;
    color: #fff;
}

.qo-brand-active[b-av2e21up7z] {
    border-color: #0d6efd;
    box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.4);
}

/* Product tiles */
.qo-prod-tile[b-av2e21up7z] {
    cursor: pointer;
    user-select: none;
}

.qo-prod-selected[b-av2e21up7z] {
    border-color: #0d6efd;
    box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.4);
}

.qo-prod-img[b-av2e21up7z] {
    position: relative;
    width: 100%;
    aspect-ratio: 1;
    background-color: #f8f9fa;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

    .qo-prod-img img[b-av2e21up7z] {
        width: 100%;
        height: 100%;
        object-fit: contain;
        padding: 0.4rem;
    }

.qo-prod-badge[b-av2e21up7z] {
    position: absolute;
    top: 0.3rem;
    right: 0.3rem;
    font-size: 0.9rem;
}

.qo-prod-desc[b-av2e21up7z] {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    height: 2.6em;
    line-height: 1.3em;
    font-size: 0.9rem;
}

/* Phones (xs/sm): three tiles per row, so shrink image padding and card text to fit. */
@media (max-width: 767.98px) {
    .qo-prod-img img[b-av2e21up7z] {
        padding: 0.1rem;
    }

    .qo-prod-badge[b-av2e21up7z] {
        top: 0.15rem;
        right: 0.15rem;
        font-size: 0.75rem;
    }

    .qo-prod-tile .card-body[b-av2e21up7z] {
        padding: 0.25rem !important;
    }

    /* Full description, no 2-line clamp; tile grows to fit. */
    .qo-prod-desc[b-av2e21up7z] {
        display: block;
        -webkit-line-clamp: unset;
        height: auto;
        font-size: 0.7rem;
        line-height: 1.2em;
        word-break: break-word;
    }

    .qo-prod-tile .fw-bold[b-av2e21up7z] {
        font-size: 0.85rem;
    }
}

/* Footer pinned to the viewport bottom: quick-qty bar (left) + totals & Save (right).
   z-index stays below the Blazored Modal overlay (100) and spinner. */
.qo-footer[b-av2e21up7z] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    border-top: 1px solid #dee2e6;
    padding: 0.5rem 0;
    z-index: 5;
}

/* Keep the last tiles/cart rows scrollable above the fixed footer
   (footer is two stacked rows on phones, one row on lg+). */
.qo-content[b-av2e21up7z] {
    padding-bottom: 8.5rem;
}

@media (min-width: 992px) {
    .qo-content[b-av2e21up7z] {
        padding-bottom: 4.5rem;
    }
}

.qo-qty-input[b-av2e21up7z] {
    max-width: 110px;
}

/* Cart line description: smaller so long product names take fewer rows. */
.qo-cart-desc[b-av2e21up7z] {
    font-size: 0.8rem;
    line-height: 1.25;
}

/* Footer summary boxes: lines / total qty / total amount */
.qo-total-box[b-av2e21up7z] {
    min-width: 5.5rem;
    text-align: center;
    padding: 0.5rem 0.75rem;
    border: 1px solid #adb5bd;
    border-radius: 0.375rem;
    font-size: 1.15rem;
    font-weight: 600;
    background: #fff;
}
/* /Components/Pages/SalesOrder2/SalesOrderPage.razor.rz.scp.css */
/* Tab strip for the Sales Order page. Plain buttons rather than FluentTabs so the page owns the
   active-tab state and can switch panels from code (Edit line -> Add Item). Styled to sit with
   the Fluent theme via its CSS custom properties, with hard fallbacks. */
.es-tabs[b-nri7x3n0p9] {
    display: flex;
    gap: 4px;
    border-bottom: 1px solid var(--colorNeutralStroke1, rgba(0,0,0,0.15));
    overflow-x: auto;
}

.es-tab[b-nri7x3n0p9] {
    padding: 8px 16px;
    border: 0;
    border-bottom: 3px solid transparent;
    background: transparent;
    color: var(--colorNeutralForeground1, #242424);
    font-size: 14px;
    white-space: nowrap;
    cursor: pointer;
}

    .es-tab:hover:not(:disabled)[b-nri7x3n0p9] {
        background-color: var(--colorSubtleBackgroundHover, rgba(0,0,0,0.05));
    }

    .es-tab:disabled[b-nri7x3n0p9] {
        opacity: .45;
        cursor: not-allowed;
    }

    .es-tab.active[b-nri7x3n0p9] {
        font-weight: 600;
        color: var(--colorBrandBackground, #0078d4);
        border-bottom-color: var(--colorBrandBackground, #0078d4);
    }

    .es-tab:focus-visible[b-nri7x3n0p9] {
        outline: 1px solid var(--colorBrandBackground, #0078d4);
        outline-offset: -2px;
    }

/* Items grid scroller.
   The grid scrolls inside its own box rather than growing the page, so the horizontal scrollbar
   sits at the bottom edge of this container and stays on screen — you no longer have to scroll
   the whole page down to reach it. Header row stays put while the rows scroll. */
.es-lines-scroll[b-nri7x3n0p9] {
    max-height: 55vh;
    min-height: 10rem;
    overflow: auto;              /* both axes: vertical rows + pinned horizontal bar */
    overscroll-behavior: contain;/* don't chain scrolling to the page at the ends */
    scrollbar-gutter: stable;
}

    /* Keep the bars permanently drawn instead of the fading overlay style. */
    .es-lines-scroll[b-nri7x3n0p9]::-webkit-scrollbar {
        width: 12px;
        height: 12px;
    }

    .es-lines-scroll[b-nri7x3n0p9]::-webkit-scrollbar-track {
        background: rgba(0,0,0,.06);
    }

    .es-lines-scroll[b-nri7x3n0p9]::-webkit-scrollbar-thumb {
        background: rgba(0,0,0,.35);
        border-radius: 6px;
    }

        .es-lines-scroll[b-nri7x3n0p9]::-webkit-scrollbar-thumb:hover {
            background: rgba(0,0,0,.5);
        }

/* Firefox equivalent. */
.es-lines-scroll[b-nri7x3n0p9] {
    scrollbar-width: thin;
    scrollbar-color: rgba(0,0,0,.35) rgba(0,0,0,.06);
}

/* Sticky header inside the scroller (::deep — the grid renders its own markup). */
[b-nri7x3n0p9] .es-lines-scroll thead,
.es-lines-scroll[b-nri7x3n0p9]  thead {
    position: sticky;
    top: 0;
    z-index: 2;
    background-color: var(--colorNeutralBackground1, #fff);
}
/* /Components/Pages/ShoppingCart/CartItem.razor.rz.scp.css */
/* /Components/Pages/ShoppingCart/CartItemList2.razor.rz.scp.css */
.es-float-center[b-mul0tsr50j] {
    margin-left: auto;
    margin-right: auto;
    width: 8em
}

@@media (min-width: 768px) {
    .es-float-center[b-mul0tsr50j] {
        margin-left: auto;
        margin-right: auto;
        width: 8em
    }
}

@@media (min-width: 992px) {
    .es-float-center[b-mul0tsr50j] {
        margin-left: auto;
        margin-right: auto;
        width: 8em
    }
}

/* /Components/Pages/ShoppingCart/CategoryList.razor.rz.scp.css */
.es-shopping-td[b-i3nvr7od1p]
{
    padding-right:0px !important;
    padding-left:0px !important;
}

.ActiveColorChange[b-i3nvr7od1p] {
    background-color:darkcyan;
    color :white;
    font-size:larger;
}

/* /Components/Pages/ShoppingCart/ChoosenCartItems.razor.rz.scp.css */



@@media (min-width: 768px) { /* Slightly wider ratio for medium screens */
    .es-cart-detail[b-k304omigof] {
        height: 0rem;
        background-color: transparent !important;
    }
}

@@media (min-width: 992px) {
    .es-cart-detail[b-k304omigof] { /* Back to square for larger screens */
        height: 10rem;
        background-color: transparent !important;
    }
}
