@import '_content/Microsoft.AspNetCore.Components.QuickGrid/Microsoft.AspNetCore.Components.QuickGrid.25o87uqmvr.bundle.scp.css';

/* _content/ServerUI.CncApp/Components/NvaComponents/NvaAutocomplete.razor.rz.scp.css */
.autocomplete-container[b-i8sr82mg3t] {
    position: relative;
    width: 100%;
}

.autocomplete-input[b-i8sr82mg3t] {
    width:100%;
    padding: 10px 14px;
    border-radius: 8px;
    border: 1px solid #ccc;
    font-size: 14px;
    transition: all 0.2s;
}

    .autocomplete-input:focus[b-i8sr82mg3t] {
        outline: none;
        border-color: #0078d4;
        box-shadow: 0 0 6px rgba(0, 120, 212, 0.3);
    }

.autocomplete-dropdown[b-i8sr82mg3t] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    max-height: calc(5 * 40px);
    overflow-y: auto;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    margin-top: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    padding: 0;
    list-style: none;
}

.autocomplete-item[b-i8sr82mg3t] {
    padding: 10px 14px;
    cursor: pointer;
    transition: all 0.2s;
}

    .autocomplete-item:hover[b-i8sr82mg3t],
    .autocomplete-item.selected[b-i8sr82mg3t] {
        background-color: #0078d4;
        color: white;
    }
/* _content/ServerUI.CncApp/Components/NvaComponents/NvaCheckboxInput.razor.rz.scp.css */
.form-check-label[b-m72xhhhm5z] {
    padding-top: 0.5em;
}
/* _content/ServerUI.CncApp/Components/NvaComponents/NvaConfirmModal.razor.rz.scp.css */
.confirm-message-modal[b-zc3uok4fdo] {
    z-index: 10000 !important;
}

.lead[b-zc3uok4fdo] {
    font-size:unset !important;
}
/* _content/ServerUI.CncApp/Components/NvaComponents/NvaForm.razor.rz.scp.css */
.autocomplete-container[b-14p1435eo2] {
    position: relative;
    width: 100%;
}

.autocomplete-input[b-14p1435eo2] {
    width:100%;
    padding: 10px 14px;
    border-radius: 8px;
    border: 1px solid #ccc;
    font-size: 14px;
    transition: all 0.2s;
}

    .autocomplete-input:focus[b-14p1435eo2] {
        outline: none;
        border-color: #0078d4;
        box-shadow: 0 0 6px rgba(0, 120, 212, 0.3);
    }

.autocomplete-dropdown[b-14p1435eo2] {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    max-height: calc(5 * 40px);
    overflow-y: auto;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 8px;
    margin-top: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    padding: 0;
    list-style: none;
}

.autocomplete-item[b-14p1435eo2] {
    padding: 10px 14px;
    cursor: pointer;
    transition: all 0.2s;
}

    .autocomplete-item:hover[b-14p1435eo2],
    .autocomplete-item.selected[b-14p1435eo2] {
        background-color: #0078d4;
        color: white;
    }
/* _content/ServerUI.CncApp/Components/NvaComponents/NvaGridComponent.razor.rz.scp.css */
/* Card & header styling */
.nva-grid-card[b-7z9241b0jn] {
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.15);
}

    .nva-grid-card .card-header[b-7z9241b0jn] {
        background: linear-gradient(135deg, #343a40, #495057);
        color: #fff;
        border-bottom: 2px solid #6c757d;
    }

        /* Action buttons */
        .nva-grid-card .card-header .btn[b-7z9241b0jn] {
            border-radius: 0.4rem;
            font-weight: 500;
            transition: transform 0.15s ease, box-shadow 0.15s ease;
        }

            .nva-grid-card .card-header .btn:hover[b-7z9241b0jn] {
                transform: translateY(-2px);
                box-shadow: 0 0.4rem 0.8rem rgba(0, 0, 0, 0.15);
            }

    /* Table styling */
    .nva-grid-card table[b-7z9241b0jn] {
        overflow: hidden;
        margin-bottom: 0;
    }

        .nva-grid-card table th[b-7z9241b0jn] {
            background-color: #495057 !important;
            color: #fff;
            font-weight: 600;
            border-bottom: 2px solid #6c757d;
        }

        .nva-grid-card table td[b-7z9241b0jn] {
            text-align: center;
            vertical-align: middle;
        }

        /* Row hover effect */
        .nva-grid-card table tbody tr:hover[b-7z9241b0jn] {
            background-color: #f1f3f5;
            cursor: pointer;
            transform: scale(1.01);
            transition: 0.2s ease-in-out;
        }

        /* Selected row highlight */
        .nva-grid-card table tbody tr.table-active[b-7z9241b0jn] {
            background: linear-gradient(90deg, #ffc107, #fd7e14);
            color: #fff;
            font-weight: 600;
            box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
        }

    /* Column dropdown */
    .nva-grid-card .dropdown-menu[b-7z9241b0jn] {
        min-width: 10rem;
        padding: 0.5rem 1rem;
        border-radius: 0.6rem;
    }

    /* Image cell styling */
    .nva-grid-card table td img[b-7z9241b0jn] {
        border-radius: 0.4rem;
        object-fit: cover;
        max-width: 70px;
        max-height: 50px;
        transition: transform 0.2s;
    }

        .nva-grid-card table td img:hover[b-7z9241b0jn] {
            transform: scale(1.1);
        }

    /* Responsive table */
    .nva-grid-card .table-responsive[b-7z9241b0jn] {
        max-height: 500px;
        overflow-y: auto;
    }

    .nva-grid-card .card-header .dropdown[b-7z9241b0jn] {
        display: inline-block; /* ensures dropdown behaves correctly in flex */
    }

.pagination[b-7z9241b0jn] {
    direction:ltr;
}
.nav-buttons[b-7z9241b0jn] {
    direction: ltr;
}
/* _content/ServerUI.CncApp/Components/NvaComponents/NvaLoadingOverlay.razor.rz.scp.css */
.overlay[b-na3i129cku] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.9);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index:99999999999999999999;
}

.overlay-content[b-na3i129cku] {
    text-align: center;
}
/* _content/ServerUI.CncApp/Components/NvaComponents/NvaPromptConfirmModal.razor.rz.scp.css */
.modal-backdrop[b-qrs41g9urt] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    /* allow clicks to children */
    pointer-events: auto;
}

.modal-dialog[b-qrs41g9urt] {
    position: relative; /* important for stacking */
    background: white;
    border-radius: 8px;
    min-width: 300px;
    max-width: 500px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
    z-index: 1060; /* above backdrop */
    padding: 1rem;
    pointer-events: auto; /* ensure dialog accepts clicks */
}


.modal-dialog[b-qrs41g9urt] {
    padding: 1rem; /* add spacing inside */
}

.modal-header[b-qrs41g9urt], .modal-body[b-qrs41g9urt], .modal-footer[b-qrs41g9urt] {
    margin: 0;
    padding: 0.5rem 1rem;
}

.modal-footer[b-qrs41g9urt] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem; /* spacing between buttons */
}

.modal-dialog[b-qrs41g9urt] {
    animation: fadeIn-b-qrs41g9urt 0.2s ease-out;
}

@keyframes fadeIn-b-qrs41g9urt {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* _content/ServerUI.CncApp/Components/Shared/ConfirmMessageModal.razor.rz.scp.css */
.confirm-message-modal[b-de4zyyx5kb] {
    z-index: 10000 !important;
}

.lead[b-de4zyyx5kb] {
    font-size:unset !important;
}
/* _content/ServerUI.CncApp/Components/Shared/Snackbar.razor.rz.scp.css */
.snackbar[b-utvixhv8f1] {
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    background: #333;
    color: white;
    padding: 12px 24px;
    border-radius: 8px;
    z-index: 20000000000000;
    transition: all 0.5s ease;
    font-size: 14px;
}

    .snackbar.success[b-utvixhv8f1] {
        background: green;
    }

    .snackbar.error[b-utvixhv8f1] {
        background: red;
    }
/* _content/ServerUI.CncApp/Layout/MainLayout.razor.rz.scp.css */
.page[b-ktk8ep8bno] {
    min-height: 100vh;
    /*display: flex;*/
    flex-direction: column;
}

#mobileSidebar.offcanvas[b-ktk8ep8bno] {
    --bs-offcanvas-width: 260px !important; /* or 240px if you prefer tighter */
}

.logo-title[b-ktk8ep8bno] {
    font-family:Lalezar;
}
.main-content-area[b-ktk8ep8bno] {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    transition: margin-right 0.25s ease;
}

.content[b-ktk8ep8bno] {
    flex-grow: 1;
}

.offcanvas.bg-dark[b-ktk8ep8bno] {
    background-color: #1a1a1a !important;
    border-right: 2px solid #E74C3C;
}

.offcanvas-header .btn-close[b-ktk8ep8bno] {
    padding: 1rem !important;
    opacity: 1;
    transition: opacity 0.2s;
}

    .offcanvas-header .btn-close:hover[b-ktk8ep8bno] {
        opacity: 0.7;
    }

.footer-main-red-theme[b-ktk8ep8bno] {
    background-color: #1a1a1a;
    color: #ecf0f1;
    padding-top: 3rem;
    padding-bottom: 0;
    font-size: 0.9rem;
    width: 100%;
    margin-top: auto;
    border-top: 3px solid #C0392B;
}

.footer-container[b-ktk8ep8bno] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

.footer-heading[b-ktk8ep8bno] {
    color: white;
    font-size: 1.3rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #C0392B;
    display: inline-block;
}

.footer-text[b-ktk8ep8bno], .contact-item[b-ktk8ep8bno] {
    line-height: 1.7;
    margin-bottom: 10px;
}

    .contact-item i[b-ktk8ep8bno] {
        color: #E74C3C;
        font-size: 1.1em;
        width: 1.5rem;
        text-align: center;
        transition: color 0.3s;
    }

.footer-link[b-ktk8ep8bno] {
    color: #bdc3c7;
    text-decoration: none;
    transition: color 0.3s, margin-right 0.3s;
    line-height: 2.2;
    display: block;
    border-right: 2px solid transparent;
    padding-right: 5px;
}

    .footer-link:hover[b-ktk8ep8bno] {
        color: #ffffff;
        text-decoration: none;
        border-right: 2px solid #E74C3C;
        margin-right: -5px;
    }

.border-secondary-red[b-ktk8ep8bno] {
    border-color: #444 !important;
}

.footer-copyright[b-ktk8ep8bno] {
    font-size: 0.8rem;
    color: #7f8c8d;
    padding-top: 1rem;
}

@media (min-width: 641px) {
    .page[b-ktk8ep8bno] {
        flex-direction: row;
    }

    .top-row[b-ktk8ep8bno], article[b-ktk8ep8bno] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}
/* _content/ServerUI.CncApp/Layout/MobileNavigation.razor.rz.scp.css */
.navbar-toggler[b-4pjeeubhft] {
    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-4pjeeubhft] {
    background-color: rgba(255, 255, 255, 0.5);
}

.nav-menu-red-theme .nav-item[b-4pjeeubhft] {
    padding-bottom: 0.3rem;
}

.nav-menu-red-theme .nav-item .nav-link[b-4pjeeubhft] {
    color: #d7d7d7;
    background: none;
    border-radius: 6px;
    height: 3.2rem;
    display: flex;
    align-items: center;
    transition: background-color 0.2s ease, color 0.2s ease;
    line-height: 3rem;
    width: 100%;
}

.nav-menu-red-theme .nav-item .nav-link:hover[b-4pjeeubhft] {
    background-color: rgba(231, 76, 60, 0.15);
    color: white;
}

.nav-menu-red-theme .nav-item[b-4pjeeubhft]  a.active {
    background-color: #C0392B;
    color: white;
    font-weight: 600;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.nav-menu-red-theme .nav-link > i[b-4pjeeubhft] {
    width: 24px;
    text-align: center;
    font-size: 1.1rem;
    color: #E74C3C;
    transition: color 0.2s;
    padding-right: 0.5em;
    margin-left:1em;
}

.nav-menu-red-theme .nav-item .nav-link:hover i[b-4pjeeubhft],
.nav-menu-red-theme .nav-item[b-4pjeeubhft]  a.active i {
    color: white;
}

.nav-menu-red-theme .ps-4[b-4pjeeubhft] {
    padding-right: 1rem !important;
}

.nav-menu-red-theme .ps-4 .nav-link[b-4pjeeubhft] {
    height: 2.8rem;
    padding-right: 1.5rem !important;
    font-size: 0.95rem;
}

.nav-link > i[b-4pjeeubhft] {
    padding: 0.5em;
}

.nav-link > i [b-4pjeeubhft]::before {
    padding: 0.5em;
}
/* _content/ServerUI.CncApp/Layout/Navigation.razor.rz.scp.css */
.top-nav-red-theme[b-dv15aqgl4k] {
    background-color: #1a1a1a;
    height: 70px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
    border-bottom: 3px solid #E74C3C;
    --bs-navbar-color: rgba(255, 255, 255, 0.9);
    --bs-navbar-hover-color: #ffffff;
    --bs-navbar-active-color: #E74C3C;
    --bs-dropdown-bg: #ffffff;
    --bs-dropdown-color: #212529;
    --bs-dropdown-border-color: rgba(231, 76, 60, 0.3);
    --bs-dropdown-link-color: #212529;
    --bs-dropdown-link-hover-color: #ffffff;
    --bs-dropdown-link-hover-bg: #E74C3C;
    --bs-dropdown-link-active-color: #ffffff;
    --bs-dropdown-link-active-bg: #E74C3C;
    --bs-navbar-toggler-border-color: #E74C3C;
    position: sticky;
    top: 0;
    left: 0;
    width: 100%;
    z-index:1000;
}

.nav-container[b-dv15aqgl4k] {
    justify-content: unset;
}

.top-nav-red-theme .site-title[b-dv15aqgl4k] {
    color: #ecf0f1;
    font-family: Lalezar, sans-serif;
    font-size: 1.8rem;
    transition: color 0.3s;
}

.top-nav-red-theme .nav-link[b-dv15aqgl4k] {
    font-weight: 500;
    padding: 0.6rem 1rem;
    border-radius: 4px;
    border-bottom: 2px solid transparent;
    transition: background-color 0.3s ease, color 0.3s ease, border-bottom 0.3s ease;
}

    .top-nav-red-theme .nav-link:hover[b-dv15aqgl4k] {
        background-color: rgba(231, 76, 60, 0.1);
        border-bottom: 2px solid #E74C3C;
    }

    .top-nav-red-theme .nav-link.active[b-dv15aqgl4k] {
        font-weight: 700;
        border-bottom: 2px solid #E74C3C;
        background-color: rgba(231, 76, 60, 0.05);
    }

.top-nav-red-theme .dropdown-menu[b-dv15aqgl4k] {
    text-align: right;
    border-radius: 0.5rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    padding: 0.5rem 0;
    line-height: 2rem;
}

.top-nav-red-theme .dropdown-item[b-dv15aqgl4k] {
    padding: 0.6rem 1.2rem;
    white-space: nowrap;
    transition: background-color 0.3s, color 0.3s;
}

    .top-nav-red-theme .dropdown-item i.ms-2[b-dv15aqgl4k] {
        margin-left: 0.6rem;
        color: #C0392B;
        transition: color 0.3s;
    }

    .top-nav-red-theme .dropdown-item:hover i.ms-2[b-dv15aqgl4k],
    .top-nav-red-theme .dropdown-item.active i.ms-2[b-dv15aqgl4k] {
        color: #000000;
    }

.top-nav-red-theme .navbar-toggler[b-dv15aqgl4k] {
    transition: border-color 0.3s;
}

@media (max-width: 767.98px) {
    .top-nav-red-theme .collapse.navbar-collapse[b-dv15aqgl4k] {
        display: none !important;
    }

    .top-nav-red-theme .navbar-toggler[b-dv15aqgl4k] {
        display: block !important;
    }
}

.dropdown-toggle[b-dv15aqgl4k]::after {
    margin-right: 0.3em;
}

.navbar-brand img[b-dv15aqgl4k] {
    vertical-align: middle;
}

.navbar-brand + .nav-link[b-dv15aqgl4k] {
    margin-top: 4px;
}

@media (max-width: 767.98px) {
    .navbar .nav-link .fa-shopping-cart[b-dv15aqgl4k] {
        font-size: 1.4rem;
    }
}
/* _content/ServerUI.CncApp/Pages/404.razor.rz.scp.css */

:root[b-84ro7wpr29] {
    --bg: #000000; /* dark background 
*/    --card: linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02));
    /*background: aliceblue;*/
}

.notfound-root[b-84ro7wpr29] {
    min-height: calc(100vh - 4rem);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;

    background: radial-gradient(1200px 400px at 10% 10%, rgba(96,165,250,0.04), transparent), radial-gradient(1000px 300px at 90% 90%, rgba(110,231,183,0.03), transparent), var(--bg);
    color: #e6eef8;
    font-family: 'Yekan', Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

.card[b-84ro7wpr29] {
    display: flex;
    gap: 2rem;
    max-width: 980px;
    width: 100%;
    align-items: center;
    background: aliceblue;
    border: 1px solid rgba(255,255,255,0.04);
    padding: 2rem;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(2,6,23,0.6);
}

.art[b-84ro7wpr29] {
    width: 220px;
    flex: 0 0 220px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.content[b-84ro7wpr29] {
    flex: 1 1 auto;
}

h1[b-84ro7wpr29] {
    font-size: 3.5rem;
    margin: 0;
    line-height: 1;
    letter-spacing: -1px;
}

h2[b-84ro7wpr29] {
    margin: 0.2rem 0 1rem 0;
    font-size: 1.25rem;
    font-weight: 600;
}

p[b-84ro7wpr29] {
    margin-bottom: 1.25rem;
}

.actions[b-84ro7wpr29] {
    display: flex;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.btn-primary[b-84ro7wpr29] {
    display: inline-block;
    padding: 0.6rem 1rem;
    border-radius: 10px;
    background: linear-gradient(90deg,#60A5FA,#6EE7B7);
    color: #03203C;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 6px 18px rgba(96,165,250,0.12);
}

.btn-ghost[b-84ro7wpr29] {
    display: inline-block;
    padding: 0.6rem 1rem;
    border-radius: 10px;
    background: transparent;
    text-decoration: none;
    border: 1px solid rgba(255,255,255,0.04);
}

.muted[b-84ro7wpr29] {
    display: block;
    margin-top: 0.5rem;
}

/* subtle animation */
.robot[b-84ro7wpr29] {
    transform-origin: center;
    animation: float-b-84ro7wpr29 4s ease-in-out infinite;
}

@keyframes float-b-84ro7wpr29 {
    0% {
        transform: translateY(0)
    }

    50% {
        transform: translateY(-6px)
    }

    100% {
        transform: translateY(0)
    }
}

/* responsive */
@media (max-width:780px) {
    .card[b-84ro7wpr29] {
        flex-direction: column;
        align-items: flex-start
    }

    .art[b-84ro7wpr29] {
        width: 100%;
        flex: 0 0 auto
    }

    h1[b-84ro7wpr29] {
        font-size: 2.6rem
    }
}
/* _content/ServerUI.CncApp/Pages/BusinessPartner/CncCutting.razor.rz.scp.css */
.cnc-cutting-container[b-r4acm48w6l] {
    margin: 50px auto;
    padding: 40px;
    background: #1e1f26;
    border-radius: 20px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.3);
    text-align: center;
    color: #f0f0f0;
}

    .cnc-cutting-container > h1[b-r4acm48w6l] {
        color: #f39c12;
        margin-bottom: 15px;
    }

.intro[b-r4acm48w6l] {
    font-size: 16px;
    margin-bottom: 40px;
    line-height: 1.8;
}

.highlight[b-r4acm48w6l] {
    color: #e74c3c;
    font-weight: bold;
}

.materials[b-r4acm48w6l] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin-bottom: 40px;
}

.card[b-r4acm48w6l] {
    background: #2c2f3a;
    padding: 20px;
    border-radius: 15px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
    transition: transform 0.3s, background 0.3s;
}

    .card h3[b-r4acm48w6l] {
        color: #f39c12;
        margin-bottom: 10px;
    }

    .card p[b-r4acm48w6l] {
        font-size: 14px;
        line-height: 1.6;
        color: #ddd;
    }

    .card:hover[b-r4acm48w6l] {
        background: #343844;
        transform: translateY(-5px);
    }

.cnc-cutting-btn[b-r4acm48w6l] {
    padding: 15px 40px;
    font-size: 18px;
    background: linear-gradient(90deg, #f39c12, #e67e22);
    color: #fff;
    border: none;
    border-radius: 40px;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.3s;
}

    .cnc-cutting-btn:hover[b-r4acm48w6l] {
        transform: scale(1.07);
        box-shadow: 0 8px 20px rgba(243, 156, 18, 0.4);
    }

.intro[b-r4acm48w6l] {
    font-size: 14px;
}

.modal-provider[b-r4acm48w6l] {
    max-height: 400px;
    overflow-y: auto;
    line-height: 1.8;
    text-align: right
}
/* _content/ServerUI.CncApp/Pages/BusinessPartner/IndustrialDesigner.razor.rz.scp.css */
 .design-container[b-ex04yfkbmf] {
        max-width: 900px;
        margin: 50px auto;
        padding: 40px;
        background: #fff;
        border-radius: 15px;
        box-shadow: 0 8px 20px rgba(0,0,0,0.1);
        text-align: center;
        direction: rtl;
    }

    .container-designer > h1[b-ex04yfkbmf] {
        color: #2c3e50;
        margin-bottom: 20px;
    }

        .container-designer > p[b-ex04yfkbmf] {
        line-height: 1.7;
        font-size: 16px;
        margin-bottom: 30px;
        color: #333;
    }

    .highlight[b-ex04yfkbmf] {
        color: #e74c3c;
        font-weight: bold;
    }

    .designer-btn[b-ex04yfkbmf] {
        padding: 15px 30px;
        font-size: 16px;
        background: #e74c3c;
        color: #fff;
        border: none;
        border-radius: 50px;
        cursor: pointer;
        transition: background 0.3s;
    }

        .designer-btn:hover[b-ex04yfkbmf] {
            background: #c0392b;
        }

    p[b-ex04yfkbmf] {
        font-size: 14px;
    }

.modal-provider[b-ex04yfkbmf] {
    max-height: 400px;
    overflow-y: auto;
    line-height: 1.8;
    text-align: right
}
/* _content/ServerUI.CncApp/Pages/BusinessPartner/Supplier.razor.rz.scp.css */
    .page-container[b-hllonqvg5j] {
        display: flex;
        justify-content: center;
        padding: 40px;
        direction: rtl;
    }

    .content-box.supplier-box[b-hllonqvg5j] {
        background: #f0f8ff;
        padding: 30px;
        border-radius: 20px;
        width: 600px;
        box-shadow: 0 4px 10px rgba(0,0,0,0.1);
        text-align: center;
    }

        .content-box.supplier-box .title[b-hllonqvg5j] {
            font-size: 26px;
            font-weight: bold;
            margin-bottom: 20px;
            color: #0a4d8c;
        }

        .content-box.supplier-box .description[b-hllonqvg5j] {
            font-size: 16px;
            line-height: 1.8;
            margin-bottom: 25px;
        }

        .content-box.supplier-box .highlight[b-hllonqvg5j] {
            color: #0a8c4d;
            font-weight: bold;
        }

    .register-btn[b-hllonqvg5j] {
        background: #0a4d8c;
        color: white;
        border: none;
        padding: 12px 24px;
        font-size: 16px;
        border-radius: 10px;
        cursor: pointer;
        transition: 0.3s;
    }

        .register-btn:hover[b-hllonqvg5j] {
            background: #0c6db8;
        }


.modal-provider[b-hllonqvg5j] {
    max-height: 400px;
    overflow-y: auto;
    line-height: 1.8;
    text-align: right
}
/* _content/ServerUI.CncApp/Pages/CncMachines.razor.rz.scp.css */

.cnc-container[b-aq4cuwcopx] {
    max-width: 950px;
    margin: 50px auto;
    padding: 40px;
    background: #fff;
    border-radius: 15px;
    box-shadow: 0 8px 20px rgba(0,0,0,0.1);
    direction: rtl;
    text-align: right;
}

    .cnc-container h1[b-aq4cuwcopx] {
        color: #2c3e50;
        margin-bottom: 20px;
    }

    .cnc-container p[b-aq4cuwcopx] {
        line-height: 1.8;
        font-size: 16px;
        color: #333;
        margin-bottom: 20px;
    }

.features-list[b-aq4cuwcopx] {
    margin: 20px auto;
    padding: 0;
    list-style: none;
    max-width: 600px;
    text-align: right;
}

    .features-list li[b-aq4cuwcopx] {
        background: #f8f9fa;
        padding: 10px 15px;
        margin: 8px 0;
        border-radius: 8px;
        font-size: 15px;
    }

.highlight[b-aq4cuwcopx] {
    color: #e74c3c;
    font-weight: bold;
}

.contact-btn[b-aq4cuwcopx] {
    padding: 12px 25px;
    font-size: 16px;
    background: #e74c3c;
    color: #fff;
    border: none;
    border-radius: 50px;
    transition: background 0.3s;
    text-decoration: none;
}

    .contact-btn:hover[b-aq4cuwcopx] {
        background: #c0392b;
        color: #fff;
    }
/* _content/ServerUI.CncApp/Pages/Gallery/CncGallery.razor.rz.scp.css */
/* Vertical scrollbar Material style */
.galleryContainer[b-mbk3f4umjp] {
    scrollbar-width: thin;
    scrollbar-color: #90caf9 #e3f2fd; /* Light blue Material theme */
}

    .galleryContainer[b-mbk3f4umjp]::-webkit-scrollbar {
        width: 10px;
    }

    .galleryContainer[b-mbk3f4umjp]::-webkit-scrollbar-track {
        background: #e3f2fd;
        border-radius: 10px;
    }

    .galleryContainer[b-mbk3f4umjp]::-webkit-scrollbar-thumb {
        background: #90caf9;
        border-radius: 10px;
    }

        .galleryContainer[b-mbk3f4umjp]::-webkit-scrollbar-thumb:hover {
            background: #42a5f5;
        }

/* Material-like card style */
.gallery-card[b-mbk3f4umjp] {
    border: none;
    border-radius: 12px;
    box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    overflow: hidden;
    background: #fff;
}

    .gallery-card img[b-mbk3f4umjp] {
        height: 200px;
        object-fit: contain;
        background: #fafafa;
        padding: 8px;
    }

    .gallery-card:hover[b-mbk3f4umjp] {
        transform: translateY(-4px);
        box-shadow: 0 6px 10px rgba(0,0,0,0.25), 0 6px 10px rgba(0,0,0,0.22);
    }

    /* Button Material look */
    .gallery-card .btn[b-mbk3f4umjp] {
        border-radius: 20px;
        font-weight: 500;
        text-transform: uppercase;
        background: #545454;
        border: none;
    }

        .gallery-card .btn:hover[b-mbk3f4umjp] {
            background: #dc3545;
        }


.galleryContainer[b-mbk3f4umjp] {
    /*direction: ltr;*/ /* force left-to-right layout */
    /*text-align: left;*/ /* avoid rtl pushing scrollbar */
    /*scrollbar-width: thin;
    scrollbar-color: #90caf9 #e3f2fd;
    height: 80vh;
    overflow-y: auto;
    overflow-x: hidden;
    scroll-behavior: smooth;*/
}

    .galleryContainer[b-mbk3f4umjp]::-webkit-scrollbar {
        width: 10px; /* vertical scrollbar width */
        height: 0; /* prevent bottom bar */
        float: right; /* force on right (webkit) */
    }

.load-more[b-mbk3f4umjp] {
    margin-top:5em !important;
}


.fancy-h2[b-mbk3f4umjp] {
    background: linear-gradient(90deg, #ffffff 0%, #ffffff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1);
    font-weight: 800;
    font-size: 2.2rem;
    padding-bottom: 5px;
}

/* Custom styles for the Load More button */
.gallery-load-more-btn[b-mbk3f4umjp] {
    /* Base background gradient */
    background: linear-gradient(45deg, #007bff, #0056b3); /* Blue gradient */
    border: none; /* Remove default border */
    color: white; /* Ensure text is white */
    font-weight: bold;
    letter-spacing: 0.5px;
    /* Subtle shadow for depth */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2); /* A softer, larger shadow */
    /* Smooth transition for hover effects */
    transition: all 0.3s ease-in-out;
    /* Rounded corners */
    border-radius: 50px; /* More rounded, pill-like */
}

    .gallery-load-more-btn:hover[b-mbk3f4umjp] {
        /* Lighter gradient on hover */
        background: linear-gradient(45deg, #0056b3, #007bff); /* Invert or shift gradient */
        /* Slightly more pronounced shadow on hover */
        box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
        /* Slightly scale up for a subtle "pop" effect */
        transform: translateY(-2px);
    }

    .gallery-load-more-btn:active[b-mbk3f4umjp] {
        /* Push down effect on click */
        transform: translateY(0);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    }

    /* Style for the icon inside the button */
    .gallery-load-more-btn i[b-mbk3f4umjp] {
        transition: transform 0.3s ease-in-out;
    }

    .gallery-load-more-btn:hover i[b-mbk3f4umjp] {
        transform: rotate(360deg); /* Spin the icon on hover */
    }


.image-gallery[b-mbk3f4umjp] {
    position: relative;
    overflow: hidden;
}

    .image-gallery img[b-mbk3f4umjp] {
        transition: transform 0.4s ease;
        cursor: zoom-in;
    }


    .image-gallery:hover img[b-mbk3f4umjp] {
        transform: scale(1.5) translate(-5px, -5px);
    }


.gallery-zoom-btn[b-mbk3f4umjp] {
    position: absolute;
    bottom: 8px;
    right: 8px;
    background: rgba(0, 0, 0, 0.55);
    color: white;
    border: none;
    padding: 6px 10px;
    border-radius: 6px;
    cursor: pointer;
    z-index: 10;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.image-gallery:hover .gallery-zoom-btn[b-mbk3f4umjp] {
    opacity: 1;
}

/* _content/ServerUI.CncApp/Pages/Home.razor.rz.scp.css */
.image-slider[b-sj7f5cqdlp] {
    margin-top: 2em;
}

.slider-container[b-sj7f5cqdlp] {
    overflow-x: auto;
    width: 100%;
}

.slider-track[b-sj7f5cqdlp] {
    display: flex;
    flex-wrap: nowrap;
    transition: transform 0.3s ease;
}


/* For Chrome, Edge, Safari */
.slider-container[b-sj7f5cqdlp]::-webkit-scrollbar {
    height: 10px; /* scrollbar thickness */
}

.slider-container[b-sj7f5cqdlp]::-webkit-scrollbar-track {
    background: #f1f1f1; /* track color */
    border-radius: 10px;
}

.slider-container[b-sj7f5cqdlp]::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #6c63ff, #4cafef); /* gradient thumb */
    border-radius: 10px;
}

    .slider-container[b-sj7f5cqdlp]::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(135deg, #5a52d5, #3a8edb);
    }

/* For Firefox */
.slider-container[b-sj7f5cqdlp] {
    scrollbar-width: none; /* makes scrollbar thinner */
    scrollbar-color: #6c63ff #f1f1f1; /* thumb color | track color */
}



.slider-item[b-sj7f5cqdlp] {
    flex: 0 0 calc(100% / 6 - 1rem); /* 6 items with spacing */
    max-width: calc(100% / 6 - 1rem);
    height: 280px;
    margin: 0 0.5rem; /* margin on both left and right */
}



    .slider-item .card[b-sj7f5cqdlp] {
        display: flex;
        flex-direction: column;
    }

    .slider-item img[b-sj7f5cqdlp] {
        height: 220px; /* fixed image height */
        object-fit: contain; /* crop nicely */
        width: 100%;
    }

.card-body > button:hover[b-sj7f5cqdlp] {
    background: #dc3545;
    border-color: #dc3545;
}

/* Large tablet: 4 items */
@media (max-width: 1200px) {
    .slider-item[b-sj7f5cqdlp] {
        flex: 0 0 calc(100% / 4 - 1rem);
        max-width: calc(100% / 4 - 1rem);
    }
}

/* Tablet: 3 items */
@media (max-width: 992px) {
    .slider-item[b-sj7f5cqdlp] {
        flex: 0 0 calc(100% / 3 - 1rem);
        max-width: calc(100% / 3 - 1rem);
    }
}

/* Mobile: 2 items */
@media (max-width: 768px) {
    .slider-item[b-sj7f5cqdlp] {
        flex: 0 0 calc(100% / 2 - 1rem);
        max-width: calc(100% / 2 - 1rem);
    }
}

/* Small mobile: 1 item */
@media (max-width: 480px) {
    .slider-item[b-sj7f5cqdlp] {
        flex: 0 0 calc(100% - 1rem);
        max-width: calc(100% - 1rem);
    }
}

/* ==================================== */
/* 2025 Sleek Rectangular Button Style */
/* ==================================== */

/* Base style for the navigation button */
.image-slider button[b-sj7f5cqdlp] {
    /* Resetting default bootstrap padding for custom sizing */
    padding: 8px 10px;
    /* Sleek Rectangular Shape with rounded corners */
    border-radius: 50px; /* Moderately rounded corners (not a circle) */

    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1rem;
    cursor: pointer;
    /* Base Dark Style */
    background-color: #2c2c2c; /* A slightly softer dark gray */
    color: #ffffff; /* White icon */
    border: none; /* No visible border for a flatter look */
    /* Subtle Shadow */
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.3);
    /* Smooth Transitions */
    transition: all 0.3s ease-out;
    z-index: 10;
}

    /* Hover Effect: Highlight with the Brand Red */
    .image-slider button:hover[b-sj7f5cqdlp],
    .image-slider button:focus[b-sj7f5cqdlp] {
        /* Fill with the primary brand red color */
        background-color: #E74C3C;
        color: #ffffff;
        /* Deeper Shadow and slight movement */
        box-shadow: 0 8px 15px rgba(231, 76, 60, 0.4); /* Stronger, colored shadow */
        transform: translateY(-2px); /* Slight lift effect */
        outline: none;
    }

    /* Active/Click Effect: Simulates pressing down */
    .image-slider button:active[b-sj7f5cqdlp] {
        background-color: #C0392B; /* Darker red on press */
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
        transform: translateY(0);
    }
/* _content/ServerUI.CncApp/Pages/Order/CustomOrder.razor.rz.scp.css */
/* 1. Ensure the icon has a smooth rotation animation */
.collapse-icon[b-u3dydgv2dl] {
    transition: transform 0.3s ease-in-out;
    display: inline-block; /* Essential for transform to work reliably */
}

/* 2. Target the icon when the button is NOT collapsed (i.e., when the section is OPEN) */
.btn[data-bs-toggle="collapse"]:not(.collapsed) .collapse-icon[b-u3dydgv2dl] {
    transform: rotate(180deg) !important;
}

a[b-u3dydgv2dl], .btn-link[b-u3dydgv2dl] {
    color: #b52212;
}
/* _content/ServerUI.CncApp/Pages/Order/OrderFactorDetails.razor.rz.scp.css */
.q-grid[b-q6vfq3vdhz] {
    overflow: auto;
}
[b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] {
    /* Set the text direction for the grid content */
    /* Inherit the base table style properties */
    font-size: 0.9rem;
    color: #333;
    /* Other theme-specific resets can go here */
}
    [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
    }

    [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] thead {
        background-color: #f8f9fa;
        border-bottom: 3px solid #dee2e6;
    }

    [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] th {
        font-weight: 600;
        padding: 12px 15px;
        text-align: right; /* Flipped for RTL */
        color: #495057;
        vertical-align: middle;
    }

        [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] th a {
            color: inherit;
            text-decoration: none;
            display: flex;
            align-items: center;
            justify-content: flex-end; /* Align header content to the right */
            flex-direction: row-reverse;
        }

            [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] th a::after {
                content: ' ';
                margin-right: 6px; /* Flipped from margin-left for RTL */
                margin-left: 0;
                font-size: 0.8rem;
                opacity: 0.6;
            }

        [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] th[aria-sort="ascending"] a::after {
            content: ' ▲';
            opacity: 1;
        }

        [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] th[aria-sort="descending"] a::after {
            content: ' ▼';
            opacity: 1;
        }

    [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] td {
        padding: 12px 15px;
        vertical-align: middle;
    }






    /* Style table rows (tr) */
    [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] tbody tr {
        border-bottom: 1px solid #e9ecef;
        transition: background-color 0.2s ease;
    }

        /* Hover effect for rows */
        [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] tbody tr:hover {
            background-color: #f1f1f1;
            cursor: default;
        }

/* Container for Edit/Delete buttons (if you use a separate class) */
/* Assuming this is inside a TemplateColumn, you might need to adjust based on final HTML */
.grid-actions[b-q6vfq3vdhz] {
    display: flex;
    gap: 8px;
    justify-content: flex-end; /* Align actions to the right (end) for RTL */
}

    /* Custom button sizes for actions */
    .grid-actions .btn[b-q6vfq3vdhz] {
        padding: 4px 10px;
        font-size: 0.85rem;
        border-radius: 6px;
    }

    /* Add some pop to the primary action button */
    .grid-actions .btn-primary[b-q6vfq3vdhz] {
        background-color: #007bff;
        border-color: #007bff;
    }



/*
 * --------------------------------
 * 1. Global Reset and Container
 * --------------------------------
 */

/* Target the container holding the grid for a clean look */
.container.bg-white[b-q6vfq3vdhz] {
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    padding: 20px !important;
}

/*
 * --------------------------------
 * 2. QuickGrid Theme (nva-rtl-theme)
 * --------------------------------
 */

/* Target the QuickGrid root element for the theme and RTL */
[b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] {
    direction: rtl; /* Enforce RTL direction */
    font-size: 0.9rem;
    color: #333;
}

    /* Style the main table element */
    [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
    }

    /* Style the table header (thead) */
    [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] thead {
        background-color: #f8f9fa;
        border-bottom: 3px solid #dee2e6;
    }

    /* Style header cells (th) */
    [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] th {
        font-weight: 600;
        padding: 12px 15px;
        text-align: right; /* Align header text right */
        color: #495057;
        vertical-align: middle;
    }

        /* Styling for the sort indicators */
        [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] th a {
            color: inherit;
            text-decoration: none;
            display: flex;
            align-items: center;
            justify-content: flex-end; /* Align header content to the right edge */
            flex-direction: row-reverse; /* Put indicator before text */
        }

            [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] th a::after {
                content: ' ';
                margin-right: 6px; /* Space on the left of the indicator (after text in RTL) */
                margin-left: 0;
                font-size: 0.8rem;
                opacity: 0.6;
            }

        /* Sort icons for ascending/descending states */
        [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] th[aria-sort="ascending"] a::after {
            content: ' ▲';
            opacity: 1;
        }

        [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] th[aria-sort="descending"] a::after {
            content: ' ▼';
            opacity: 1;
        }

    /* Style table rows (tr) */
    [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] tbody tr {
        border-bottom: 1px solid #e9ecef;
        transition: background-color 0.2s ease;
    }

        /* Hover effect for rows */
        [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] tbody tr:hover {
            background-color: #f1f1f1;
            cursor: default;
        }

    /* Style table data cells (td) */
    [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] td {
        padding: 12px 15px;
        vertical-align: middle;
    }

/*
 * --------------------------------
 * 3. Action Button Group
 * --------------------------------
 */

/* Container for Edit/Delete buttons - Needs to be adjusted if not inside the theme scope */
.grid-actions[b-q6vfq3vdhz] {
    display: flex;
    gap: 8px;
    justify-content: flex-end; /* Align buttons to the right (end) */
}

    /* Custom button sizes for actions */
    .grid-actions .btn[b-q6vfq3vdhz] {
        padding: 4px 10px;
        font-size: 0.85rem;
        border-radius: 6px;
    }

/*
 * --------------------------------
 * 4. General/Pagination Styles
 * --------------------------------
 */

/* Style for the main add button */
.add-file-btn[b-q6vfq3vdhz] {
    border-radius: 8px;
    font-weight: 500;
    transition: all 0.2s ease;
}

    .add-file-btn:hover[b-q6vfq3vdhz] {
        box-shadow: 0 2px 8px rgba(0, 123, 255, 0.2);
    }

/* * --------------------------------
 * CSS Fix for QuickGrid Empty Rows (If needed)
 * --------------------------------
 */
[b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] tbody tr:empty {
    display: none !important;
}

/* Make the grid responsive on small screens */
@media (max-width: 768px) {
    .container.bg-white[b-q6vfq3vdhz] {
        padding: 10px !important;
    }

    /* Ensure table content flows nicely */
    [b-q6vfq3vdhz] .quickgrid[theme=nva-rtl-theme] table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
}


[b-q6vfq3vdhz] tr:has(> td:not(:empty)) > td {
    display: table-cell;
}

[b-q6vfq3vdhz] td:empty {
    display: none;
}
/* _content/ServerUI.CncApp/Pages/Order/OrderGalleryDesignFile.razor.rz.scp.css */
/* _content/ServerUI.CncApp/Pages/Order/OrderTracker.razor.rz.scp.css */
.order-tracking-container[b-vudq4e4grx] {
    background: #fff;
    border-radius: 12px;
    direction: rtl; /* force RTL for text + layout */
}

.order-tracking[b-vudq4e4grx] {
    position: relative;
    direction:ltr;
}

.tracking-step[b-vudq4e4grx] {
    position: relative;
    flex: 1;
}

    .tracking-step:not(:last-child)[b-vudq4e4grx]::after {
        content: "";
        position: absolute;
        top: 12px;
        right: 50%; /* RTL adjustment */
        width: 100%;
        height: 4px;
        background: #dee2e6;
        z-index: 1;
    }

    .tracking-step .circle[b-vudq4e4grx] {
        width: 24px;
        height: 24px;
        margin: 0 auto;
        border-radius: 50%;
        background: #dee2e6;
        position: relative;
        z-index: 2;
    }

        .tracking-step .circle.completed[b-vudq4e4grx] {
            background: #198754; /* Bootstrap green */
            box-shadow: 0 0 8px rgba(25, 135, 84, 0.4);
        }

    .tracking-step.completed .step-label[b-vudq4e4grx] {
        color: #198754;
        font-weight: 600;
    }


/* Responsive vertical layout for small screens */
@media (max-width: 768px) {
    .order-tracking[b-vudq4e4grx] {
        flex-direction: column !important;
        align-items: flex-start !important;
        position: relative !important;
        direction: rtl !important; /* maintain Persian reading flow */
    }

    .tracking-step[b-vudq4e4grx] {
        display: flex !important;
        align-items: center !important;
        text-align: right !important;
        margin-bottom: 1.5rem !important;
        position: relative !important;
        flex: none !important;
    }

        .tracking-step[b-vudq4e4grx]::after {
            content: "" !important;
            position: absolute !important;
            right: 11px !important; /* aligns the vertical line with circles */
            top: 30px !important;
            width: 2px !important;
            height: calc(100% - 30px) !important;
            background: #dee2e6 !important;
            z-index: 1 !important;
        }

        .tracking-step:last-child[b-vudq4e4grx]::after {
            display: none !important; /* hide the line after the last step */
        }

        .tracking-step .circle[b-vudq4e4grx] {
            flex-shrink: 0 !important;
            margin-left: 10px !important;
        }

    .step-label[b-vudq4e4grx] {
        font-size: 0.9rem !important;
    }

    /* Adjust completed line color */
    .tracking-step .circle.completed + .step-label[b-vudq4e4grx] {
        color: #198754 !important;
    }
}

.order-tracking[b-vudq4e4grx], .tracking-step[b-vudq4e4grx] {
    transition: all 0.3s ease;
}
/* _content/ServerUI.CncApp/Pages/Panel/FactorManagement/Factor.razor.rz.scp.css */
.image-slider[b-m6cx8ub257] {
 margin-top:2em;
}

.slider-container[b-m6cx8ub257] {
    overflow-x: auto;
    width: 100%;
}

.slider-track[b-m6cx8ub257] {
    display: flex;
    flex-wrap: nowrap;
    transition: transform 0.3s ease;
}


/* For Chrome, Edge, Safari */
.slider-container[b-m6cx8ub257]::-webkit-scrollbar {
    height: 10px; /* scrollbar thickness */
}

.slider-container[b-m6cx8ub257]::-webkit-scrollbar-track {
    background: #f1f1f1; /* track color */
    border-radius: 10px;
}

.slider-container[b-m6cx8ub257]::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #6c63ff, #4cafef); /* gradient thumb */
    border-radius: 10px;
}

    .slider-container[b-m6cx8ub257]::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(135deg, #5a52d5, #3a8edb);
    }

/* For Firefox */
.slider-container[b-m6cx8ub257] {
    scrollbar-width: none; /* makes scrollbar thinner */
    scrollbar-color: #6c63ff #f1f1f1; /* thumb color | track color */
}



.slider-item[b-m6cx8ub257] {
    flex: 0 0 calc(100% / 6 - 1rem); /* 6 items with spacing */
    max-width: calc(100% / 6 - 1rem);
    height: 280px;
    margin: 0 0.5rem; /* margin on both left and right */
}



    .slider-item .card[b-m6cx8ub257] {
        display: flex;
        flex-direction: column;
    }

    .slider-item img[b-m6cx8ub257] {
        height: 220px; /* fixed image height */
        object-fit: contain; /* crop nicely */
        width: 100%;
    }


/* Large tablet: 4 items */
@media (max-width: 1200px) {
    .slider-item[b-m6cx8ub257] {
        flex: 0 0 calc(100% / 4 - 1rem);
        max-width: calc(100% / 4 - 1rem);
    }
}

/* Tablet: 3 items */
@media (max-width: 992px) {
    .slider-item[b-m6cx8ub257] {
        flex: 0 0 calc(100% / 3 - 1rem);
        max-width: calc(100% / 3 - 1rem);
    }
}

/* Mobile: 2 items */
@media (max-width: 768px) {
    .slider-item[b-m6cx8ub257] {
        flex: 0 0 calc(100% / 2 - 1rem);
        max-width: calc(100% / 2 - 1rem);
    }
}

/* Small mobile: 1 item */
@media (max-width: 480px) {
    .slider-item[b-m6cx8ub257] {
        flex: 0 0 calc(100% - 1rem);
        max-width: calc(100% - 1rem);
    }
}

.add-file-btn[b-m6cx8ub257] {
    font-weight: 600;
    gap: 0.5rem;
}

.modal-header[b-m6cx8ub257] {
    direction:ltr;
}
.btn-close[b-m6cx8ub257] {
    margin: inherit;
}
/* _content/ServerUI.CncApp/Pages/Panel/FactorManagement/Factors.razor.rz.scp.css */
/*
 * --------------------------------
 * QuickGrid Theme Definition (nva-rtl-theme)
 * --------------------------------
 */

.q-grid[b-e25touldu2] {
    overflow:auto;
}
/* Target the QuickGrid root element for the theme and RTL */
[b-e25touldu2] .quickgrid[theme=nva-rtl-theme] {
    /* Set the text direction for the grid content */
    /* Inherit the base table style properties */
    font-size: 0.9rem;
    color: #333;
    /* Other theme-specific resets can go here */
}

    /* Style the main table element within the theme */
    [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
       
    }



    /* Style the table header (thead) */
    [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] thead {
        background-color: #f8f9fa;
        border-bottom: 3px solid #dee2e6;
    }

    /* Style header cells (th) */
    [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] th {
        font-weight: 600;
        padding: 12px 15px;
        text-align: right; /* Flipped for RTL */
        color: #495057;
        vertical-align: middle;
    }

        /* Styling for the sort indicators */
        [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] th a {
            color: inherit;
            text-decoration: none;
            /* Use 'flex-direction: row-reverse' to put the sort indicator BEFORE the text */
            display: flex;
            align-items: center;
            justify-content: flex-end; /* Align header content to the right */
            flex-direction: row-reverse;
        }

            [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] th a::after {
                content: ' ';
                margin-right: 6px; /* Flipped from margin-left for RTL */
                margin-left: 0;
                font-size: 0.8rem;
                opacity: 0.6;
            }

        /* Sort icons for ascending/descending states */
        [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] th[aria-sort="ascending"] a::after {
            content: ' ▲';
            opacity: 1;
        }

        [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] th[aria-sort="descending"] a::after {
            content: ' ▼';
            opacity: 1;
        }

    /* Style table data cells (td) */
    [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] td {
        padding: 12px 15px;
        vertical-align: middle;
    }






    /* Style table rows (tr) */
    [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] tbody tr {
        border-bottom: 1px solid #e9ecef;
        transition: background-color 0.2s ease;
    }

        /* Hover effect for rows */
        [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] tbody tr:hover {
            background-color: #f1f1f1;
            cursor: default;
        }

/* Container for Edit/Delete buttons (if you use a separate class) */
/* Assuming this is inside a TemplateColumn, you might need to adjust based on final HTML */
.grid-actions[b-e25touldu2] {
    display: flex;
    gap: 8px;
    justify-content: flex-end; /* Align actions to the right (end) for RTL */
}

    /* Custom button sizes for actions */
    .grid-actions .btn[b-e25touldu2] {
        padding: 4px 10px;
        font-size: 0.85rem;
        border-radius: 6px;
    }

    /* Add some pop to the primary action button */
    .grid-actions .btn-primary[b-e25touldu2] {
        background-color: #007bff;
        border-color: #007bff;
    }



/*
 * --------------------------------
 * 1. Global Reset and Container
 * --------------------------------
 */

/* Target the container holding the grid for a clean look */
.container.bg-white[b-e25touldu2] {
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    padding: 20px !important;
}

/*
 * --------------------------------
 * 2. QuickGrid Theme (nva-rtl-theme)
 * --------------------------------
 */

/* Target the QuickGrid root element for the theme and RTL */
[b-e25touldu2] .quickgrid[theme=nva-rtl-theme] {
    direction: rtl; /* Enforce RTL direction */
    font-size: 0.9rem;
    color: #333;
}

    /* Style the main table element */
    [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
    }

    /* Style the table header (thead) */
    [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] thead {
        background-color: #f8f9fa;
        border-bottom: 3px solid #dee2e6;
    }

    /* Style header cells (th) */
    [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] th {
        font-weight: 600;
        padding: 12px 15px;
        text-align: right; /* Align header text right */
        color: #495057;
        vertical-align: middle;
    }

        /* Styling for the sort indicators */
        [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] th a {
            color: inherit;
            text-decoration: none;
            display: flex;
            align-items: center;
            justify-content: flex-end; /* Align header content to the right edge */
            flex-direction: row-reverse; /* Put indicator before text */
        }

            [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] th a::after {
                content: ' ';
                margin-right: 6px; /* Space on the left of the indicator (after text in RTL) */
                margin-left: 0;
                font-size: 0.8rem;
                opacity: 0.6;
            }

        /* Sort icons for ascending/descending states */
        [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] th[aria-sort="ascending"] a::after {
            content: ' ▲';
            opacity: 1;
        }

        [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] th[aria-sort="descending"] a::after {
            content: ' ▼';
            opacity: 1;
        }

    /* Style table rows (tr) */
    [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] tbody tr {
        border-bottom: 1px solid #e9ecef;
        transition: background-color 0.2s ease;
    }

        /* Hover effect for rows */
        [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] tbody tr:hover {
            background-color: #f1f1f1;
            cursor: default;
        }

    /* Style table data cells (td) */
    [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] td {
        padding: 12px 15px;
        vertical-align: middle;
    }

/*
 * --------------------------------
 * 3. Action Button Group
 * --------------------------------
 */

/* Container for Edit/Delete buttons - Needs to be adjusted if not inside the theme scope */
.grid-actions[b-e25touldu2] {
    display: flex;
    gap: 8px;
    justify-content: flex-end; /* Align buttons to the right (end) */
}

    /* Custom button sizes for actions */
    .grid-actions .btn[b-e25touldu2] {
        padding: 4px 10px;
        font-size: 0.85rem;
        border-radius: 6px;
    }

/*
 * --------------------------------
 * 4. General/Pagination Styles
 * --------------------------------
 */

/* Style for the main add button */
.add-file-btn[b-e25touldu2] {
    border-radius: 8px;
    font-weight: 500;
    transition: all 0.2s ease;
}

    .add-file-btn:hover[b-e25touldu2] {
        box-shadow: 0 2px 8px rgba(0, 123, 255, 0.2);
    }

/* * --------------------------------
 * CSS Fix for QuickGrid Empty Rows (If needed)
 * --------------------------------
 */
[b-e25touldu2] .quickgrid[theme=nva-rtl-theme] tbody tr:empty {
    display: none !important;
}

/* Make the grid responsive on small screens */
@media (max-width: 768px) {
    .container.bg-white[b-e25touldu2] {
        padding: 10px !important;
    }

    /* Ensure table content flows nicely */
    [b-e25touldu2] .quickgrid[theme=nva-rtl-theme] table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
}


[b-e25touldu2] tr:has(> td:not(:empty)) > td {
    display: table-cell;
}

[b-e25touldu2] td:empty {
    display: none;
}
/* _content/ServerUI.CncApp/Pages/Panel/FileManagement/File.razor.rz.scp.css */
.image-slider[b-xx5r0rkopt] {
 margin-top:2em;
}

.slider-container[b-xx5r0rkopt] {
    overflow-x: auto;
    width: 100%;
}

.slider-track[b-xx5r0rkopt] {
    display: flex;
    flex-wrap: nowrap;
    transition: transform 0.3s ease;
}


/* For Chrome, Edge, Safari */
.slider-container[b-xx5r0rkopt]::-webkit-scrollbar {
    height: 10px; /* scrollbar thickness */
}

.slider-container[b-xx5r0rkopt]::-webkit-scrollbar-track {
    background: #f1f1f1; /* track color */
    border-radius: 10px;
}

.slider-container[b-xx5r0rkopt]::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #6c63ff, #4cafef); /* gradient thumb */
    border-radius: 10px;
}

    .slider-container[b-xx5r0rkopt]::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(135deg, #5a52d5, #3a8edb);
    }

/* For Firefox */
.slider-container[b-xx5r0rkopt] {
    scrollbar-width: none; /* makes scrollbar thinner */
    scrollbar-color: #6c63ff #f1f1f1; /* thumb color | track color */
}



.slider-item[b-xx5r0rkopt] {
    flex: 0 0 calc(100% / 6 - 1rem); /* 6 items with spacing */
    max-width: calc(100% / 6 - 1rem);
    height: 280px;
    margin: 0 0.5rem; /* margin on both left and right */
}



    .slider-item .card[b-xx5r0rkopt] {
        display: flex;
        flex-direction: column;
    }

    .slider-item img[b-xx5r0rkopt] {
        height: 220px; /* fixed image height */
        object-fit: contain; /* crop nicely */
        width: 100%;
    }


/* Large tablet: 4 items */
@media (max-width: 1200px) {
    .slider-item[b-xx5r0rkopt] {
        flex: 0 0 calc(100% / 4 - 1rem);
        max-width: calc(100% / 4 - 1rem);
    }
}

/* Tablet: 3 items */
@media (max-width: 992px) {
    .slider-item[b-xx5r0rkopt] {
        flex: 0 0 calc(100% / 3 - 1rem);
        max-width: calc(100% / 3 - 1rem);
    }
}

/* Mobile: 2 items */
@media (max-width: 768px) {
    .slider-item[b-xx5r0rkopt] {
        flex: 0 0 calc(100% / 2 - 1rem);
        max-width: calc(100% / 2 - 1rem);
    }
}

/* Small mobile: 1 item */
@media (max-width: 480px) {
    .slider-item[b-xx5r0rkopt] {
        flex: 0 0 calc(100% - 1rem);
        max-width: calc(100% - 1rem);
    }
}

.add-file-btn[b-xx5r0rkopt] {
    font-weight: 600;
    gap: 0.5rem;
}

.modal-header[b-xx5r0rkopt] {
    direction:ltr;
}
.btn-close[b-xx5r0rkopt] {
    margin: inherit;
}
/* _content/ServerUI.CncApp/Pages/Panel/FileManagement/Files.razor.rz.scp.css */
/*
 * --------------------------------
 * QuickGrid Theme Definition (nva-rtl-theme)
 * --------------------------------
 */

.q-grid[b-s43grim0d6] {
    overflow:auto;
}
/* Target the QuickGrid root element for the theme and RTL */
[b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] {
    /* Set the text direction for the grid content */
    /* Inherit the base table style properties */
    font-size: 0.9rem;
    color: #333;
    /* Other theme-specific resets can go here */
}

    /* Style the main table element within the theme */
    [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
       
    }



    /* Style the table header (thead) */
    [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] thead {
        background-color: #f8f9fa;
        border-bottom: 3px solid #dee2e6;
    }

    /* Style header cells (th) */
    [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] th {
        font-weight: 600;
        padding: 12px 15px;
        text-align: right; /* Flipped for RTL */
        color: #495057;
        vertical-align: middle;
    }

        /* Styling for the sort indicators */
        [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] th a {
            color: inherit;
            text-decoration: none;
            /* Use 'flex-direction: row-reverse' to put the sort indicator BEFORE the text */
            display: flex;
            align-items: center;
            justify-content: flex-end; /* Align header content to the right */
            flex-direction: row-reverse;
        }

            [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] th a::after {
                content: ' ';
                margin-right: 6px; /* Flipped from margin-left for RTL */
                margin-left: 0;
                font-size: 0.8rem;
                opacity: 0.6;
            }

        /* Sort icons for ascending/descending states */
        [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] th[aria-sort="ascending"] a::after {
            content: ' ▲';
            opacity: 1;
        }

        [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] th[aria-sort="descending"] a::after {
            content: ' ▼';
            opacity: 1;
        }

    /* Style table data cells (td) */
    [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] td {
        padding: 12px 15px;
        vertical-align: middle;
    }






    /* Style table rows (tr) */
    [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] tbody tr {
        border-bottom: 1px solid #e9ecef;
        transition: background-color 0.2s ease;
    }

        /* Hover effect for rows */
        [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] tbody tr:hover {
            background-color: #f1f1f1;
            cursor: default;
        }

/* Container for Edit/Delete buttons (if you use a separate class) */
/* Assuming this is inside a TemplateColumn, you might need to adjust based on final HTML */
.grid-actions[b-s43grim0d6] {
    display: flex;
    gap: 8px;
    justify-content: flex-end; /* Align actions to the right (end) for RTL */
}

    /* Custom button sizes for actions */
    .grid-actions .btn[b-s43grim0d6] {
        padding: 4px 10px;
        font-size: 0.85rem;
        border-radius: 6px;
    }

    /* Add some pop to the primary action button */
    .grid-actions .btn-primary[b-s43grim0d6] {
        background-color: #007bff;
        border-color: #007bff;
    }



/*
 * --------------------------------
 * 1. Global Reset and Container
 * --------------------------------
 */

/* Target the container holding the grid for a clean look */
.container.bg-white[b-s43grim0d6] {
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    padding: 20px !important;
}

/*
 * --------------------------------
 * 2. QuickGrid Theme (nva-rtl-theme)
 * --------------------------------
 */

/* Target the QuickGrid root element for the theme and RTL */
[b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] {
    direction: rtl; /* Enforce RTL direction */
    font-size: 0.9rem;
    color: #333;
}

    /* Style the main table element */
    [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
    }

    /* Style the table header (thead) */
    [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] thead {
        background-color: #f8f9fa;
        border-bottom: 3px solid #dee2e6;
    }

    /* Style header cells (th) */
    [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] th {
        font-weight: 600;
        padding: 12px 15px;
        text-align: right; /* Align header text right */
        color: #495057;
        vertical-align: middle;
    }

        /* Styling for the sort indicators */
        [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] th a {
            color: inherit;
            text-decoration: none;
            display: flex;
            align-items: center;
            justify-content: flex-end; /* Align header content to the right edge */
            flex-direction: row-reverse; /* Put indicator before text */
        }

            [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] th a::after {
                content: ' ';
                margin-right: 6px; /* Space on the left of the indicator (after text in RTL) */
                margin-left: 0;
                font-size: 0.8rem;
                opacity: 0.6;
            }

        /* Sort icons for ascending/descending states */
        [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] th[aria-sort="ascending"] a::after {
            content: ' ▲';
            opacity: 1;
        }

        [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] th[aria-sort="descending"] a::after {
            content: ' ▼';
            opacity: 1;
        }

    /* Style table rows (tr) */
    [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] tbody tr {
        border-bottom: 1px solid #e9ecef;
        transition: background-color 0.2s ease;
    }

        /* Hover effect for rows */
        [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] tbody tr:hover {
            background-color: #f1f1f1;
            cursor: default;
        }

    /* Style table data cells (td) */
    [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] td {
        padding: 12px 15px;
        vertical-align: middle;
    }

/*
 * --------------------------------
 * 3. Action Button Group
 * --------------------------------
 */

/* Container for Edit/Delete buttons - Needs to be adjusted if not inside the theme scope */
.grid-actions[b-s43grim0d6] {
    display: flex;
    gap: 8px;
    justify-content: flex-end; /* Align buttons to the right (end) */
}

    /* Custom button sizes for actions */
    .grid-actions .btn[b-s43grim0d6] {
        padding: 4px 10px;
        font-size: 0.85rem;
        border-radius: 6px;
    }

/*
 * --------------------------------
 * 4. General/Pagination Styles
 * --------------------------------
 */

/* Style for the main add button */
.add-file-btn[b-s43grim0d6] {
    border-radius: 8px;
    font-weight: 500;
    transition: all 0.2s ease;
}

    .add-file-btn:hover[b-s43grim0d6] {
        box-shadow: 0 2px 8px rgba(0, 123, 255, 0.2);
    }

/* * --------------------------------
 * CSS Fix for QuickGrid Empty Rows (If needed)
 * --------------------------------
 */
[b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] tbody tr:empty {
    display: none !important;
}

/* Make the grid responsive on small screens */
@media (max-width: 768px) {
    .container.bg-white[b-s43grim0d6] {
        padding: 10px !important;
    }

    /* Ensure table content flows nicely */
    [b-s43grim0d6] .quickgrid[theme=nva-rtl-theme] table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
}


[b-s43grim0d6] tr:has(> td:not(:empty)) > td {
    display: table-cell;
}

[b-s43grim0d6] td:empty {
    display: none;
}
/* _content/ServerUI.CncApp/Pages/Panel/OrderManagement/AddOrderFactor.razor.rz.scp.css */
.image-slider[b-9jf6n658rz] {
 margin-top:2em;
}

.slider-container[b-9jf6n658rz] {
    overflow-x: auto;
    width: 100%;
}

.slider-track[b-9jf6n658rz] {
    display: flex;
    flex-wrap: nowrap;
    transition: transform 0.3s ease;
}


/* For Chrome, Edge, Safari */
.slider-container[b-9jf6n658rz]::-webkit-scrollbar {
    height: 10px; /* scrollbar thickness */
}

.slider-container[b-9jf6n658rz]::-webkit-scrollbar-track {
    background: #f1f1f1; /* track color */
    border-radius: 10px;
}

.slider-container[b-9jf6n658rz]::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #6c63ff, #4cafef); /* gradient thumb */
    border-radius: 10px;
}

    .slider-container[b-9jf6n658rz]::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(135deg, #5a52d5, #3a8edb);
    }

/* For Firefox */
.slider-container[b-9jf6n658rz] {
    scrollbar-width: none; /* makes scrollbar thinner */
    scrollbar-color: #6c63ff #f1f1f1; /* thumb color | track color */
}



.slider-item[b-9jf6n658rz] {
    flex: 0 0 calc(100% / 6 - 1rem); /* 6 items with spacing */
    max-width: calc(100% / 6 - 1rem);
    height: 280px;
    margin: 0 0.5rem; /* margin on both left and right */
}



    .slider-item .card[b-9jf6n658rz] {
        display: flex;
        flex-direction: column;
    }

    .slider-item img[b-9jf6n658rz] {
        height: 220px; /* fixed image height */
        object-fit: contain; /* crop nicely */
        width: 100%;
    }


/* Large tablet: 4 items */
@media (max-width: 1200px) {
    .slider-item[b-9jf6n658rz] {
        flex: 0 0 calc(100% / 4 - 1rem);
        max-width: calc(100% / 4 - 1rem);
    }
}

/* Tablet: 3 items */
@media (max-width: 992px) {
    .slider-item[b-9jf6n658rz] {
        flex: 0 0 calc(100% / 3 - 1rem);
        max-width: calc(100% / 3 - 1rem);
    }
}

/* Mobile: 2 items */
@media (max-width: 768px) {
    .slider-item[b-9jf6n658rz] {
        flex: 0 0 calc(100% / 2 - 1rem);
        max-width: calc(100% / 2 - 1rem);
    }
}

/* Small mobile: 1 item */
@media (max-width: 480px) {
    .slider-item[b-9jf6n658rz] {
        flex: 0 0 calc(100% - 1rem);
        max-width: calc(100% - 1rem);
    }
}

.add-file-btn[b-9jf6n658rz] {
    font-weight: 600;
    gap: 0.5rem;
}

.modal-header[b-9jf6n658rz] {
    direction:ltr;
}
.btn-close[b-9jf6n658rz] {
    margin: inherit;
}
/* _content/ServerUI.CncApp/Pages/Panel/OrderManagement/Details.razor.rz.scp.css */
.image-slider[b-uy1d29xc4b] {
 margin-top:2em;
}

.slider-container[b-uy1d29xc4b] {
    overflow-x: auto;
    width: 100%;
}

.slider-track[b-uy1d29xc4b] {
    display: flex;
    flex-wrap: nowrap;
    transition: transform 0.3s ease;
}


/* For Chrome, Edge, Safari */
.slider-container[b-uy1d29xc4b]::-webkit-scrollbar {
    height: 10px; /* scrollbar thickness */
}

.slider-container[b-uy1d29xc4b]::-webkit-scrollbar-track {
    background: #f1f1f1; /* track color */
    border-radius: 10px;
}

.slider-container[b-uy1d29xc4b]::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #6c63ff, #4cafef); /* gradient thumb */
    border-radius: 10px;
}

    .slider-container[b-uy1d29xc4b]::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(135deg, #5a52d5, #3a8edb);
    }

/* For Firefox */
.slider-container[b-uy1d29xc4b] {
    scrollbar-width: none; /* makes scrollbar thinner */
    scrollbar-color: #6c63ff #f1f1f1; /* thumb color | track color */
}



.slider-item[b-uy1d29xc4b] {
    flex: 0 0 calc(100% / 6 - 1rem); /* 6 items with spacing */
    max-width: calc(100% / 6 - 1rem);
    height: 280px;
    margin: 0 0.5rem; /* margin on both left and right */
}



    .slider-item .card[b-uy1d29xc4b] {
        display: flex;
        flex-direction: column;
    }

    .slider-item img[b-uy1d29xc4b] {
        height: 220px; /* fixed image height */
        object-fit: contain; /* crop nicely */
        width: 100%;
    }


/* Large tablet: 4 items */
@media (max-width: 1200px) {
    .slider-item[b-uy1d29xc4b] {
        flex: 0 0 calc(100% / 4 - 1rem);
        max-width: calc(100% / 4 - 1rem);
    }
}

/* Tablet: 3 items */
@media (max-width: 992px) {
    .slider-item[b-uy1d29xc4b] {
        flex: 0 0 calc(100% / 3 - 1rem);
        max-width: calc(100% / 3 - 1rem);
    }
}

/* Mobile: 2 items */
@media (max-width: 768px) {
    .slider-item[b-uy1d29xc4b] {
        flex: 0 0 calc(100% / 2 - 1rem);
        max-width: calc(100% / 2 - 1rem);
    }
}

/* Small mobile: 1 item */
@media (max-width: 480px) {
    .slider-item[b-uy1d29xc4b] {
        flex: 0 0 calc(100% - 1rem);
        max-width: calc(100% - 1rem);
    }
}

.add-file-btn[b-uy1d29xc4b] {
    font-weight: 600;
    gap: 0.5rem;
}

.modal-header[b-uy1d29xc4b] {
    direction:ltr;
}
.btn-close[b-uy1d29xc4b] {
    margin: inherit;
}
/* _content/ServerUI.CncApp/Pages/Panel/OrderManagement/Order.razor.rz.scp.css */
.image-slider[b-9gx806vh0z] {
 margin-top:2em;
}

.slider-container[b-9gx806vh0z] {
    overflow-x: auto;
    width: 100%;
}

.slider-track[b-9gx806vh0z] {
    display: flex;
    flex-wrap: nowrap;
    transition: transform 0.3s ease;
}


/* For Chrome, Edge, Safari */
.slider-container[b-9gx806vh0z]::-webkit-scrollbar {
    height: 10px; /* scrollbar thickness */
}

.slider-container[b-9gx806vh0z]::-webkit-scrollbar-track {
    background: #f1f1f1; /* track color */
    border-radius: 10px;
}

.slider-container[b-9gx806vh0z]::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #6c63ff, #4cafef); /* gradient thumb */
    border-radius: 10px;
}

    .slider-container[b-9gx806vh0z]::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(135deg, #5a52d5, #3a8edb);
    }

/* For Firefox */
.slider-container[b-9gx806vh0z] {
    scrollbar-width: none; /* makes scrollbar thinner */
    scrollbar-color: #6c63ff #f1f1f1; /* thumb color | track color */
}



.slider-item[b-9gx806vh0z] {
    flex: 0 0 calc(100% / 6 - 1rem); /* 6 items with spacing */
    max-width: calc(100% / 6 - 1rem);
    height: 280px;
    margin: 0 0.5rem; /* margin on both left and right */
}



    .slider-item .card[b-9gx806vh0z] {
        display: flex;
        flex-direction: column;
    }

    .slider-item img[b-9gx806vh0z] {
        height: 220px; /* fixed image height */
        object-fit: contain; /* crop nicely */
        width: 100%;
    }


/* Large tablet: 4 items */
@media (max-width: 1200px) {
    .slider-item[b-9gx806vh0z] {
        flex: 0 0 calc(100% / 4 - 1rem);
        max-width: calc(100% / 4 - 1rem);
    }
}

/* Tablet: 3 items */
@media (max-width: 992px) {
    .slider-item[b-9gx806vh0z] {
        flex: 0 0 calc(100% / 3 - 1rem);
        max-width: calc(100% / 3 - 1rem);
    }
}

/* Mobile: 2 items */
@media (max-width: 768px) {
    .slider-item[b-9gx806vh0z] {
        flex: 0 0 calc(100% / 2 - 1rem);
        max-width: calc(100% / 2 - 1rem);
    }
}

/* Small mobile: 1 item */
@media (max-width: 480px) {
    .slider-item[b-9gx806vh0z] {
        flex: 0 0 calc(100% - 1rem);
        max-width: calc(100% - 1rem);
    }
}

.add-file-btn[b-9gx806vh0z] {
    font-weight: 600;
    gap: 0.5rem;
}

.modal-header[b-9gx806vh0z] {
    direction:ltr;
}
.btn-close[b-9gx806vh0z] {
    margin: inherit;
}
/* _content/ServerUI.CncApp/Pages/Panel/OrderManagement/Orders.razor.rz.scp.css */
/*
 * --------------------------------
 * QuickGrid Theme Definition (nva-rtl-theme)
 * --------------------------------
 */

.q-grid[b-in0bgesfkl] {
    overflow:auto;
}
/* Target the QuickGrid root element for the theme and RTL */
[b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] {
    /* Set the text direction for the grid content */
    /* Inherit the base table style properties */
    font-size: 0.9rem;
    color: #333;
    /* Other theme-specific resets can go here */
}

    /* Style the main table element within the theme */
    [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
       
    }



    /* Style the table header (thead) */
    [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] thead {
        background-color: #f8f9fa;
        border-bottom: 3px solid #dee2e6;
    }

    /* Style header cells (th) */
    [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] th {
        font-weight: 600;
        padding: 12px 15px;
        text-align: right; /* Flipped for RTL */
        color: #495057;
        vertical-align: middle;
    }

        /* Styling for the sort indicators */
        [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] th a {
            color: inherit;
            text-decoration: none;
            /* Use 'flex-direction: row-reverse' to put the sort indicator BEFORE the text */
            display: flex;
            align-items: center;
            justify-content: flex-end; /* Align header content to the right */
            flex-direction: row-reverse;
        }

            [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] th a::after {
                content: ' ';
                margin-right: 6px; /* Flipped from margin-left for RTL */
                margin-left: 0;
                font-size: 0.8rem;
                opacity: 0.6;
            }

        /* Sort icons for ascending/descending states */
        [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] th[aria-sort="ascending"] a::after {
            content: ' ▲';
            opacity: 1;
        }

        [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] th[aria-sort="descending"] a::after {
            content: ' ▼';
            opacity: 1;
        }

    /* Style table data cells (td) */
    [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] td {
        padding: 12px 15px;
        vertical-align: middle;
    }






    /* Style table rows (tr) */
    [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] tbody tr {
        border-bottom: 1px solid #e9ecef;
        transition: background-color 0.2s ease;
    }

        /* Hover effect for rows */
        [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] tbody tr:hover {
            background-color: #f1f1f1;
            cursor: default;
        }

/* Container for Edit/Delete buttons (if you use a separate class) */
/* Assuming this is inside a TemplateColumn, you might need to adjust based on final HTML */
.grid-actions[b-in0bgesfkl] {
    display: flex;
    gap: 8px;
    justify-content: flex-end; /* Align actions to the right (end) for RTL */
}

    /* Custom button sizes for actions */
    .grid-actions .btn[b-in0bgesfkl] {
        padding: 4px 10px;
        font-size: 0.85rem;
        border-radius: 6px;
    }

    /* Add some pop to the primary action button */
    .grid-actions .btn-primary[b-in0bgesfkl] {
        background-color: #007bff;
        border-color: #007bff;
    }



/*
 * --------------------------------
 * 1. Global Reset and Container
 * --------------------------------
 */

/* Target the container holding the grid for a clean look */
.container.bg-white[b-in0bgesfkl] {
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    padding: 20px !important;
}

/*
 * --------------------------------
 * 2. QuickGrid Theme (nva-rtl-theme)
 * --------------------------------
 */

/* Target the QuickGrid root element for the theme and RTL */
[b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] {
    direction: rtl; /* Enforce RTL direction */
    font-size: 0.9rem;
    color: #333;
}

    /* Style the main table element */
    [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
    }

    /* Style the table header (thead) */
    [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] thead {
        background-color: #f8f9fa;
        border-bottom: 3px solid #dee2e6;
    }

    /* Style header cells (th) */
    [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] th {
        font-weight: 600;
        padding: 12px 15px;
        text-align: right; /* Align header text right */
        color: #495057;
        vertical-align: middle;
    }

        /* Styling for the sort indicators */
        [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] th a {
            color: inherit;
            text-decoration: none;
            display: flex;
            align-items: center;
            justify-content: flex-end; /* Align header content to the right edge */
            flex-direction: row-reverse; /* Put indicator before text */
        }

            [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] th a::after {
                content: ' ';
                margin-right: 6px; /* Space on the left of the indicator (after text in RTL) */
                margin-left: 0;
                font-size: 0.8rem;
                opacity: 0.6;
            }

        /* Sort icons for ascending/descending states */
        [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] th[aria-sort="ascending"] a::after {
            content: ' ▲';
            opacity: 1;
        }

        [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] th[aria-sort="descending"] a::after {
            content: ' ▼';
            opacity: 1;
        }

    /* Style table rows (tr) */
    [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] tbody tr {
        border-bottom: 1px solid #e9ecef;
        transition: background-color 0.2s ease;
    }

        /* Hover effect for rows */
        [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] tbody tr:hover {
            background-color: #f1f1f1;
            cursor: default;
        }

    /* Style table data cells (td) */
    [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] td {
        padding: 12px 15px;
        vertical-align: middle;
    }

/*
 * --------------------------------
 * 3. Action Button Group
 * --------------------------------
 */

/* Container for Edit/Delete buttons - Needs to be adjusted if not inside the theme scope */
.grid-actions[b-in0bgesfkl] {
    display: flex;
    gap: 8px;
    justify-content: flex-end; /* Align buttons to the right (end) */
}

    /* Custom button sizes for actions */
    .grid-actions .btn[b-in0bgesfkl] {
        padding: 4px 10px;
        font-size: 0.85rem;
        border-radius: 6px;
    }

/*
 * --------------------------------
 * 4. General/Pagination Styles
 * --------------------------------
 */

/* Style for the main add button */
.add-file-btn[b-in0bgesfkl] {
    border-radius: 8px;
    font-weight: 500;
    transition: all 0.2s ease;
}

    .add-file-btn:hover[b-in0bgesfkl] {
        box-shadow: 0 2px 8px rgba(0, 123, 255, 0.2);
    }

/* * --------------------------------
 * CSS Fix for QuickGrid Empty Rows (If needed)
 * --------------------------------
 */
[b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] tbody tr:empty {
    display: none !important;
}

/* Make the grid responsive on small screens */
@media (max-width: 768px) {
    .container.bg-white[b-in0bgesfkl] {
        padding: 10px !important;
    }

    /* Ensure table content flows nicely */
    [b-in0bgesfkl] .quickgrid[theme=nva-rtl-theme] table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
}


[b-in0bgesfkl] tr:has(> td:not(:empty)) > td {
    display: table-cell;
}

[b-in0bgesfkl] td:empty {
    display: none;
}
/* _content/ServerUI.CncApp/Pages/Panel/PaymentManagement/Payment.razor.rz.scp.css */
.image-slider[b-9uklbqq650] {
 margin-top:2em;
}

.slider-container[b-9uklbqq650] {
    overflow-x: auto;
    width: 100%;
}

.slider-track[b-9uklbqq650] {
    display: flex;
    flex-wrap: nowrap;
    transition: transform 0.3s ease;
}


/* For Chrome, Edge, Safari */
.slider-container[b-9uklbqq650]::-webkit-scrollbar {
    height: 10px; /* scrollbar thickness */
}

.slider-container[b-9uklbqq650]::-webkit-scrollbar-track {
    background: #f1f1f1; /* track color */
    border-radius: 10px;
}

.slider-container[b-9uklbqq650]::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #6c63ff, #4cafef); /* gradient thumb */
    border-radius: 10px;
}

    .slider-container[b-9uklbqq650]::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(135deg, #5a52d5, #3a8edb);
    }

/* For Firefox */
.slider-container[b-9uklbqq650] {
    scrollbar-width: none; /* makes scrollbar thinner */
    scrollbar-color: #6c63ff #f1f1f1; /* thumb color | track color */
}



.slider-item[b-9uklbqq650] {
    flex: 0 0 calc(100% / 6 - 1rem); /* 6 items with spacing */
    max-width: calc(100% / 6 - 1rem);
    height: 280px;
    margin: 0 0.5rem; /* margin on both left and right */
}



    .slider-item .card[b-9uklbqq650] {
        display: flex;
        flex-direction: column;
    }

    .slider-item img[b-9uklbqq650] {
        height: 220px; /* fixed image height */
        object-fit: contain; /* crop nicely */
        width: 100%;
    }


/* Large tablet: 4 items */
@media (max-width: 1200px) {
    .slider-item[b-9uklbqq650] {
        flex: 0 0 calc(100% / 4 - 1rem);
        max-width: calc(100% / 4 - 1rem);
    }
}

/* Tablet: 3 items */
@media (max-width: 992px) {
    .slider-item[b-9uklbqq650] {
        flex: 0 0 calc(100% / 3 - 1rem);
        max-width: calc(100% / 3 - 1rem);
    }
}

/* Mobile: 2 items */
@media (max-width: 768px) {
    .slider-item[b-9uklbqq650] {
        flex: 0 0 calc(100% / 2 - 1rem);
        max-width: calc(100% / 2 - 1rem);
    }
}

/* Small mobile: 1 item */
@media (max-width: 480px) {
    .slider-item[b-9uklbqq650] {
        flex: 0 0 calc(100% - 1rem);
        max-width: calc(100% - 1rem);
    }
}

.add-file-btn[b-9uklbqq650] {
    font-weight: 600;
    gap: 0.5rem;
}

.modal-header[b-9uklbqq650] {
    direction:ltr;
}
.btn-close[b-9uklbqq650] {
    margin: inherit;
}
/* _content/ServerUI.CncApp/Pages/Panel/PaymentManagement/PaymentDetails.razor.rz.scp.css */
.image-slider[b-91n4z8az7f] {
 margin-top:2em;
}

.slider-container[b-91n4z8az7f] {
    overflow-x: auto;
    width: 100%;
}

.slider-track[b-91n4z8az7f] {
    display: flex;
    flex-wrap: nowrap;
    transition: transform 0.3s ease;
}


/* For Chrome, Edge, Safari */
.slider-container[b-91n4z8az7f]::-webkit-scrollbar {
    height: 10px; /* scrollbar thickness */
}

.slider-container[b-91n4z8az7f]::-webkit-scrollbar-track {
    background: #f1f1f1; /* track color */
    border-radius: 10px;
}

.slider-container[b-91n4z8az7f]::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #6c63ff, #4cafef); /* gradient thumb */
    border-radius: 10px;
}

    .slider-container[b-91n4z8az7f]::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(135deg, #5a52d5, #3a8edb);
    }

/* For Firefox */
.slider-container[b-91n4z8az7f] {
    scrollbar-width: none; /* makes scrollbar thinner */
    scrollbar-color: #6c63ff #f1f1f1; /* thumb color | track color */
}



.slider-item[b-91n4z8az7f] {
    flex: 0 0 calc(100% / 6 - 1rem); /* 6 items with spacing */
    max-width: calc(100% / 6 - 1rem);
    height: 280px;
    margin: 0 0.5rem; /* margin on both left and right */
}



    .slider-item .card[b-91n4z8az7f] {
        display: flex;
        flex-direction: column;
    }

    .slider-item img[b-91n4z8az7f] {
        height: 220px; /* fixed image height */
        object-fit: contain; /* crop nicely */
        width: 100%;
    }


/* Large tablet: 4 items */
@media (max-width: 1200px) {
    .slider-item[b-91n4z8az7f] {
        flex: 0 0 calc(100% / 4 - 1rem);
        max-width: calc(100% / 4 - 1rem);
    }
}

/* Tablet: 3 items */
@media (max-width: 992px) {
    .slider-item[b-91n4z8az7f] {
        flex: 0 0 calc(100% / 3 - 1rem);
        max-width: calc(100% / 3 - 1rem);
    }
}

/* Mobile: 2 items */
@media (max-width: 768px) {
    .slider-item[b-91n4z8az7f] {
        flex: 0 0 calc(100% / 2 - 1rem);
        max-width: calc(100% / 2 - 1rem);
    }
}

/* Small mobile: 1 item */
@media (max-width: 480px) {
    .slider-item[b-91n4z8az7f] {
        flex: 0 0 calc(100% - 1rem);
        max-width: calc(100% - 1rem);
    }
}

.add-file-btn[b-91n4z8az7f] {
    font-weight: 600;
    gap: 0.5rem;
}

.modal-header[b-91n4z8az7f] {
    direction:ltr;
}
.btn-close[b-91n4z8az7f] {
    margin: inherit;
}
/* _content/ServerUI.CncApp/Pages/Panel/PaymentManagement/PaymentFactor.razor.rz.scp.css */
.image-slider[b-kvx8e023w6] {
 margin-top:2em;
}

.slider-container[b-kvx8e023w6] {
    overflow-x: auto;
    width: 100%;
}

.slider-track[b-kvx8e023w6] {
    display: flex;
    flex-wrap: nowrap;
    transition: transform 0.3s ease;
}


/* For Chrome, Edge, Safari */
.slider-container[b-kvx8e023w6]::-webkit-scrollbar {
    height: 10px; /* scrollbar thickness */
}

.slider-container[b-kvx8e023w6]::-webkit-scrollbar-track {
    background: #f1f1f1; /* track color */
    border-radius: 10px;
}

.slider-container[b-kvx8e023w6]::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #6c63ff, #4cafef); /* gradient thumb */
    border-radius: 10px;
}

    .slider-container[b-kvx8e023w6]::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(135deg, #5a52d5, #3a8edb);
    }

/* For Firefox */
.slider-container[b-kvx8e023w6] {
    scrollbar-width: none; /* makes scrollbar thinner */
    scrollbar-color: #6c63ff #f1f1f1; /* thumb color | track color */
}



.slider-item[b-kvx8e023w6] {
    flex: 0 0 calc(100% / 6 - 1rem); /* 6 items with spacing */
    max-width: calc(100% / 6 - 1rem);
    height: 280px;
    margin: 0 0.5rem; /* margin on both left and right */
}



    .slider-item .card[b-kvx8e023w6] {
        display: flex;
        flex-direction: column;
    }

    .slider-item img[b-kvx8e023w6] {
        height: 220px; /* fixed image height */
        object-fit: contain; /* crop nicely */
        width: 100%;
    }


/* Large tablet: 4 items */
@media (max-width: 1200px) {
    .slider-item[b-kvx8e023w6] {
        flex: 0 0 calc(100% / 4 - 1rem);
        max-width: calc(100% / 4 - 1rem);
    }
}

/* Tablet: 3 items */
@media (max-width: 992px) {
    .slider-item[b-kvx8e023w6] {
        flex: 0 0 calc(100% / 3 - 1rem);
        max-width: calc(100% / 3 - 1rem);
    }
}

/* Mobile: 2 items */
@media (max-width: 768px) {
    .slider-item[b-kvx8e023w6] {
        flex: 0 0 calc(100% / 2 - 1rem);
        max-width: calc(100% / 2 - 1rem);
    }
}

/* Small mobile: 1 item */
@media (max-width: 480px) {
    .slider-item[b-kvx8e023w6] {
        flex: 0 0 calc(100% - 1rem);
        max-width: calc(100% - 1rem);
    }
}

.add-file-btn[b-kvx8e023w6] {
    font-weight: 600;
    gap: 0.5rem;
}

.modal-header[b-kvx8e023w6] {
    direction:ltr;
}
.btn-close[b-kvx8e023w6] {
    margin: inherit;
}
/* _content/ServerUI.CncApp/Pages/Panel/PaymentManagement/PaymentLogDetails.razor.rz.scp.css */
.image-slider[b-diz1gluzw5] {
 margin-top:2em;
}

.slider-container[b-diz1gluzw5] {
    overflow-x: auto;
    width: 100%;
}

.slider-track[b-diz1gluzw5] {
    display: flex;
    flex-wrap: nowrap;
    transition: transform 0.3s ease;
}


/* For Chrome, Edge, Safari */
.slider-container[b-diz1gluzw5]::-webkit-scrollbar {
    height: 10px; /* scrollbar thickness */
}

.slider-container[b-diz1gluzw5]::-webkit-scrollbar-track {
    background: #f1f1f1; /* track color */
    border-radius: 10px;
}

.slider-container[b-diz1gluzw5]::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #6c63ff, #4cafef); /* gradient thumb */
    border-radius: 10px;
}

    .slider-container[b-diz1gluzw5]::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(135deg, #5a52d5, #3a8edb);
    }

/* For Firefox */
.slider-container[b-diz1gluzw5] {
    scrollbar-width: none; /* makes scrollbar thinner */
    scrollbar-color: #6c63ff #f1f1f1; /* thumb color | track color */
}



.slider-item[b-diz1gluzw5] {
    flex: 0 0 calc(100% / 6 - 1rem); /* 6 items with spacing */
    max-width: calc(100% / 6 - 1rem);
    height: 280px;
    margin: 0 0.5rem; /* margin on both left and right */
}



    .slider-item .card[b-diz1gluzw5] {
        display: flex;
        flex-direction: column;
    }

    .slider-item img[b-diz1gluzw5] {
        height: 220px; /* fixed image height */
        object-fit: contain; /* crop nicely */
        width: 100%;
    }


/* Large tablet: 4 items */
@media (max-width: 1200px) {
    .slider-item[b-diz1gluzw5] {
        flex: 0 0 calc(100% / 4 - 1rem);
        max-width: calc(100% / 4 - 1rem);
    }
}

/* Tablet: 3 items */
@media (max-width: 992px) {
    .slider-item[b-diz1gluzw5] {
        flex: 0 0 calc(100% / 3 - 1rem);
        max-width: calc(100% / 3 - 1rem);
    }
}

/* Mobile: 2 items */
@media (max-width: 768px) {
    .slider-item[b-diz1gluzw5] {
        flex: 0 0 calc(100% / 2 - 1rem);
        max-width: calc(100% / 2 - 1rem);
    }
}

/* Small mobile: 1 item */
@media (max-width: 480px) {
    .slider-item[b-diz1gluzw5] {
        flex: 0 0 calc(100% - 1rem);
        max-width: calc(100% - 1rem);
    }
}

.add-file-btn[b-diz1gluzw5] {
    font-weight: 600;
    gap: 0.5rem;
}

.modal-header[b-diz1gluzw5] {
    direction:ltr;
}
.btn-close[b-diz1gluzw5] {
    margin: inherit;
}
/* _content/ServerUI.CncApp/Pages/Panel/PaymentManagement/Payments.razor.rz.scp.css */
/*
 * --------------------------------
 * QuickGrid Theme Definition (nva-rtl-theme)
 * --------------------------------
 */

.q-grid[b-ixfqwwqpuq] {
    overflow:auto;
}
/* Target the QuickGrid root element for the theme and RTL */
[b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] {
    /* Set the text direction for the grid content */
    /* Inherit the base table style properties */
    font-size: 0.9rem;
    color: #333;
    /* Other theme-specific resets can go here */
}

    /* Style the main table element within the theme */
    [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
       
    }



    /* Style the table header (thead) */
    [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] thead {
        background-color: #f8f9fa;
        border-bottom: 3px solid #dee2e6;
    }

    /* Style header cells (th) */
    [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] th {
        font-weight: 600;
        padding: 12px 15px;
        text-align: right; /* Flipped for RTL */
        color: #495057;
        vertical-align: middle;
    }

        /* Styling for the sort indicators */
        [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] th a {
            color: inherit;
            text-decoration: none;
            /* Use 'flex-direction: row-reverse' to put the sort indicator BEFORE the text */
            display: flex;
            align-items: center;
            justify-content: flex-end; /* Align header content to the right */
            flex-direction: row-reverse;
        }

            [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] th a::after {
                content: ' ';
                margin-right: 6px; /* Flipped from margin-left for RTL */
                margin-left: 0;
                font-size: 0.8rem;
                opacity: 0.6;
            }

        /* Sort icons for ascending/descending states */
        [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] th[aria-sort="ascending"] a::after {
            content: ' ▲';
            opacity: 1;
        }

        [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] th[aria-sort="descending"] a::after {
            content: ' ▼';
            opacity: 1;
        }

    /* Style table data cells (td) */
    [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] td {
        padding: 12px 15px;
        vertical-align: middle;
    }






    /* Style table rows (tr) */
    [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] tbody tr {
        border-bottom: 1px solid #e9ecef;
        transition: background-color 0.2s ease;
    }

        /* Hover effect for rows */
        [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] tbody tr:hover {
            background-color: #f1f1f1;
            cursor: default;
        }

/* Container for Edit/Delete buttons (if you use a separate class) */
/* Assuming this is inside a TemplateColumn, you might need to adjust based on final HTML */
.grid-actions[b-ixfqwwqpuq] {
    display: flex;
    gap: 8px;
    justify-content: flex-end; /* Align actions to the right (end) for RTL */
}

    /* Custom button sizes for actions */
    .grid-actions .btn[b-ixfqwwqpuq] {
        padding: 4px 10px;
        font-size: 0.85rem;
        border-radius: 6px;
    }

    /* Add some pop to the primary action button */
    .grid-actions .btn-primary[b-ixfqwwqpuq] {
        background-color: #007bff;
        border-color: #007bff;
    }



/*
 * --------------------------------
 * 1. Global Reset and Container
 * --------------------------------
 */

/* Target the container holding the grid for a clean look */
.container.bg-white[b-ixfqwwqpuq] {
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    padding: 20px !important;
}

/*
 * --------------------------------
 * 2. QuickGrid Theme (nva-rtl-theme)
 * --------------------------------
 */

/* Target the QuickGrid root element for the theme and RTL */
[b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] {
    direction: rtl; /* Enforce RTL direction */
    font-size: 0.9rem;
    color: #333;
}

    /* Style the main table element */
    [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
    }

    /* Style the table header (thead) */
    [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] thead {
        background-color: #f8f9fa;
        border-bottom: 3px solid #dee2e6;
    }

    /* Style header cells (th) */
    [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] th {
        font-weight: 600;
        padding: 12px 15px;
        text-align: right; /* Align header text right */
        color: #495057;
        vertical-align: middle;
    }

        /* Styling for the sort indicators */
        [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] th a {
            color: inherit;
            text-decoration: none;
            display: flex;
            align-items: center;
            justify-content: flex-end; /* Align header content to the right edge */
            flex-direction: row-reverse; /* Put indicator before text */
        }

            [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] th a::after {
                content: ' ';
                margin-right: 6px; /* Space on the left of the indicator (after text in RTL) */
                margin-left: 0;
                font-size: 0.8rem;
                opacity: 0.6;
            }

        /* Sort icons for ascending/descending states */
        [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] th[aria-sort="ascending"] a::after {
            content: ' ▲';
            opacity: 1;
        }

        [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] th[aria-sort="descending"] a::after {
            content: ' ▼';
            opacity: 1;
        }

    /* Style table rows (tr) */
    [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] tbody tr {
        border-bottom: 1px solid #e9ecef;
        transition: background-color 0.2s ease;
    }

        /* Hover effect for rows */
        [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] tbody tr:hover {
            background-color: #f1f1f1;
            cursor: default;
        }

    /* Style table data cells (td) */
    [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] td {
        padding: 12px 15px;
        vertical-align: middle;
    }

/*
 * --------------------------------
 * 3. Action Button Group
 * --------------------------------
 */

/* Container for Edit/Delete buttons - Needs to be adjusted if not inside the theme scope */
.grid-actions[b-ixfqwwqpuq] {
    display: flex;
    gap: 8px;
    justify-content: flex-end; /* Align buttons to the right (end) */
}

    /* Custom button sizes for actions */
    .grid-actions .btn[b-ixfqwwqpuq] {
        padding: 4px 10px;
        font-size: 0.85rem;
        border-radius: 6px;
    }

/*
 * --------------------------------
 * 4. General/Pagination Styles
 * --------------------------------
 */

/* Style for the main add button */
.add-file-btn[b-ixfqwwqpuq] {
    border-radius: 8px;
    font-weight: 500;
    transition: all 0.2s ease;
}

    .add-file-btn:hover[b-ixfqwwqpuq] {
        box-shadow: 0 2px 8px rgba(0, 123, 255, 0.2);
    }

/* * --------------------------------
 * CSS Fix for QuickGrid Empty Rows (If needed)
 * --------------------------------
 */
[b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] tbody tr:empty {
    display: none !important;
}

/* Make the grid responsive on small screens */
@media (max-width: 768px) {
    .container.bg-white[b-ixfqwwqpuq] {
        padding: 10px !important;
    }

    /* Ensure table content flows nicely */
    [b-ixfqwwqpuq] .quickgrid[theme=nva-rtl-theme] table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
}


[b-ixfqwwqpuq] tr:has(> td:not(:empty)) > td {
    display: table-cell;
}

[b-ixfqwwqpuq] td:empty {
    display: none;
}
/* _content/ServerUI.CncApp/Pages/Panel/UserManagement/User.razor.rz.scp.css */
.image-slider[b-ku7ujo96fr] {
 margin-top:2em;
}

.slider-container[b-ku7ujo96fr] {
    overflow-x: auto;
    width: 100%;
}

.slider-track[b-ku7ujo96fr] {
    display: flex;
    flex-wrap: nowrap;
    transition: transform 0.3s ease;
}


/* For Chrome, Edge, Safari */
.slider-container[b-ku7ujo96fr]::-webkit-scrollbar {
    height: 10px; /* scrollbar thickness */
}

.slider-container[b-ku7ujo96fr]::-webkit-scrollbar-track {
    background: #f1f1f1; /* track color */
    border-radius: 10px;
}

.slider-container[b-ku7ujo96fr]::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #6c63ff, #4cafef); /* gradient thumb */
    border-radius: 10px;
}

    .slider-container[b-ku7ujo96fr]::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(135deg, #5a52d5, #3a8edb);
    }

/* For Firefox */
.slider-container[b-ku7ujo96fr] {
    scrollbar-width: none; /* makes scrollbar thinner */
    scrollbar-color: #6c63ff #f1f1f1; /* thumb color | track color */
}



.slider-item[b-ku7ujo96fr] {
    flex: 0 0 calc(100% / 6 - 1rem); /* 6 items with spacing */
    max-width: calc(100% / 6 - 1rem);
    height: 280px;
    margin: 0 0.5rem; /* margin on both left and right */
}



    .slider-item .card[b-ku7ujo96fr] {
        display: flex;
        flex-direction: column;
    }

    .slider-item img[b-ku7ujo96fr] {
        height: 220px; /* fixed image height */
        object-fit: contain; /* crop nicely */
        width: 100%;
    }


/* Large tablet: 4 items */
@media (max-width: 1200px) {
    .slider-item[b-ku7ujo96fr] {
        flex: 0 0 calc(100% / 4 - 1rem);
        max-width: calc(100% / 4 - 1rem);
    }
}

/* Tablet: 3 items */
@media (max-width: 992px) {
    .slider-item[b-ku7ujo96fr] {
        flex: 0 0 calc(100% / 3 - 1rem);
        max-width: calc(100% / 3 - 1rem);
    }
}

/* Mobile: 2 items */
@media (max-width: 768px) {
    .slider-item[b-ku7ujo96fr] {
        flex: 0 0 calc(100% / 2 - 1rem);
        max-width: calc(100% / 2 - 1rem);
    }
}

/* Small mobile: 1 item */
@media (max-width: 480px) {
    .slider-item[b-ku7ujo96fr] {
        flex: 0 0 calc(100% - 1rem);
        max-width: calc(100% - 1rem);
    }
}

.add-file-btn[b-ku7ujo96fr] {
    font-weight: 600;
    gap: 0.5rem;
}

.modal-header[b-ku7ujo96fr] {
    direction:ltr;
}
.btn-close[b-ku7ujo96fr] {
    margin: inherit;
}
/* _content/ServerUI.CncApp/Pages/Panel/UserManagement/Users.razor.rz.scp.css */
/*
 * --------------------------------
 * QuickGrid Theme Definition (nva-rtl-theme)
 * --------------------------------
 */

.q-grid[b-i6wxb8vhrp] {
    overflow:auto;
}
/* Target the QuickGrid root element for the theme and RTL */
[b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] {
    /* Set the text direction for the grid content */
    /* Inherit the base table style properties */
    font-size: 0.9rem;
    color: #333;
    /* Other theme-specific resets can go here */
}

    /* Style the main table element within the theme */
    [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
       
    }



    /* Style the table header (thead) */
    [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] thead {
        background-color: #f8f9fa;
        border-bottom: 3px solid #dee2e6;
    }

    /* Style header cells (th) */
    [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] th {
        font-weight: 600;
        padding: 12px 15px;
        text-align: right; /* Flipped for RTL */
        color: #495057;
        vertical-align: middle;
    }

        /* Styling for the sort indicators */
        [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] th a {
            color: inherit;
            text-decoration: none;
            /* Use 'flex-direction: row-reverse' to put the sort indicator BEFORE the text */
            display: flex;
            align-items: center;
            justify-content: flex-end; /* Align header content to the right */
            flex-direction: row-reverse;
        }

            [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] th a::after {
                content: ' ';
                margin-right: 6px; /* Flipped from margin-left for RTL */
                margin-left: 0;
                font-size: 0.8rem;
                opacity: 0.6;
            }

        /* Sort icons for ascending/descending states */
        [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] th[aria-sort="ascending"] a::after {
            content: ' ▲';
            opacity: 1;
        }

        [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] th[aria-sort="descending"] a::after {
            content: ' ▼';
            opacity: 1;
        }

    /* Style table data cells (td) */
    [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] td {
        padding: 12px 15px;
        vertical-align: middle;
    }






    /* Style table rows (tr) */
    [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] tbody tr {
        border-bottom: 1px solid #e9ecef;
        transition: background-color 0.2s ease;
    }

        /* Hover effect for rows */
        [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] tbody tr:hover {
            background-color: #f1f1f1;
            cursor: default;
        }

/* Container for Edit/Delete buttons (if you use a separate class) */
/* Assuming this is inside a TemplateColumn, you might need to adjust based on final HTML */
.grid-actions[b-i6wxb8vhrp] {
    display: flex;
    gap: 8px;
    justify-content: flex-end; /* Align actions to the right (end) for RTL */
}

    /* Custom button sizes for actions */
    .grid-actions .btn[b-i6wxb8vhrp] {
        padding: 4px 10px;
        font-size: 0.85rem;
        border-radius: 6px;
    }

    /* Add some pop to the primary action button */
    .grid-actions .btn-primary[b-i6wxb8vhrp] {
        background-color: #007bff;
        border-color: #007bff;
    }



/*
 * --------------------------------
 * 1. Global Reset and Container
 * --------------------------------
 */

/* Target the container holding the grid for a clean look */
.container.bg-white[b-i6wxb8vhrp] {
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    padding: 20px !important;
}

/*
 * --------------------------------
 * 2. QuickGrid Theme (nva-rtl-theme)
 * --------------------------------
 */

/* Target the QuickGrid root element for the theme and RTL */
[b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] {
    direction: rtl; /* Enforce RTL direction */
    font-size: 0.9rem;
    color: #333;
}

    /* Style the main table element */
    [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
    }

    /* Style the table header (thead) */
    [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] thead {
        background-color: #f8f9fa;
        border-bottom: 3px solid #dee2e6;
    }

    /* Style header cells (th) */
    [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] th {
        font-weight: 600;
        padding: 12px 15px;
        text-align: right; /* Align header text right */
        color: #495057;
        vertical-align: middle;
    }

        /* Styling for the sort indicators */
        [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] th a {
            color: inherit;
            text-decoration: none;
            display: flex;
            align-items: center;
            justify-content: flex-end; /* Align header content to the right edge */
            flex-direction: row-reverse; /* Put indicator before text */
        }

            [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] th a::after {
                content: ' ';
                margin-right: 6px; /* Space on the left of the indicator (after text in RTL) */
                margin-left: 0;
                font-size: 0.8rem;
                opacity: 0.6;
            }

        /* Sort icons for ascending/descending states */
        [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] th[aria-sort="ascending"] a::after {
            content: ' ▲';
            opacity: 1;
        }

        [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] th[aria-sort="descending"] a::after {
            content: ' ▼';
            opacity: 1;
        }

    /* Style table rows (tr) */
    [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] tbody tr {
        border-bottom: 1px solid #e9ecef;
        transition: background-color 0.2s ease;
    }

        /* Hover effect for rows */
        [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] tbody tr:hover {
            background-color: #f1f1f1;
            cursor: default;
        }

    /* Style table data cells (td) */
    [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] td {
        padding: 12px 15px;
        vertical-align: middle;
    }

/*
 * --------------------------------
 * 3. Action Button Group
 * --------------------------------
 */

/* Container for Edit/Delete buttons - Needs to be adjusted if not inside the theme scope */
.grid-actions[b-i6wxb8vhrp] {
    display: flex;
    gap: 8px;
    justify-content: flex-end; /* Align buttons to the right (end) */
}

    /* Custom button sizes for actions */
    .grid-actions .btn[b-i6wxb8vhrp] {
        padding: 4px 10px;
        font-size: 0.85rem;
        border-radius: 6px;
    }

/*
 * --------------------------------
 * 4. General/Pagination Styles
 * --------------------------------
 */

/* Style for the main add button */
.add-file-btn[b-i6wxb8vhrp] {
    border-radius: 8px;
    font-weight: 500;
    transition: all 0.2s ease;
}

    .add-file-btn:hover[b-i6wxb8vhrp] {
        box-shadow: 0 2px 8px rgba(0, 123, 255, 0.2);
    }

/* * --------------------------------
 * CSS Fix for QuickGrid Empty Rows (If needed)
 * --------------------------------
 */
[b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] tbody tr:empty {
    display: none !important;
}

/* Make the grid responsive on small screens */
@media (max-width: 768px) {
    .container.bg-white[b-i6wxb8vhrp] {
        padding: 10px !important;
    }

    /* Ensure table content flows nicely */
    [b-i6wxb8vhrp] .quickgrid[theme=nva-rtl-theme] table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
}


[b-i6wxb8vhrp] tr:has(> td:not(:empty)) > td {
    display: table-cell;
}

[b-i6wxb8vhrp] td:empty {
    display: none;
}
/* _content/ServerUI.CncApp/Pages/Payment/Checkout.razor.rz.scp.css */
/* 1. Ensure the icon has a smooth rotation animation */
.collapse-icon[b-16s1s498y7] {
    transition: transform 0.3s ease-in-out;
    display: inline-block; /* Essential for transform to work reliably */
}

/* 2. Target the icon when the button is NOT collapsed (i.e., when the section is OPEN) */
.btn[data-bs-toggle="collapse"]:not(.collapsed) .collapse-icon[b-16s1s498y7] {
    transform: rotate(180deg) !important;
}

a[b-16s1s498y7], .btn-link[b-16s1s498y7] {
    color: #b52212;
}
/* _content/ServerUI.CncApp/Pages/Payment/Verify.razor.rz.scp.css */