/* _content/ZabWebErp_dev/Components/Controls/DashBoardDtls.razor.rz.scp.css */
.sab-group[b-nbwgo1s75p] {
    background: var(--sab-surface);
    border: 1px solid var(--sab-border);
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
}

    .sab-group .dxbl-panel[b-nbwgo1s75p] {
        background: var(--sab-surface);
        border: 1px solid var(--sab-border);
        border-radius: 8px;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
    }
/* _content/ZabWebErp_dev/Components/Controls/SabEntryGrid.razor.rz.scp.css */
.sab-entry-grid[b-ou0jboz9w5] {
    width: 100%;
    border: 1px solid var(--sab-border);
    border-radius: 6px;
    padding: 8px;
    background: var(--sab-bg);
}

.sab-entry-toolbar[b-ou0jboz9w5] {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
    align-items: center;
}

.sab-grid-search[b-ou0jboz9w5] {
    width: 250px;
}

.sab-grid-btn[b-ou0jboz9w5] {
    min-width: 90px;
}

.sab-grid-footer[b-ou0jboz9w5] {
    margin-top: 8px;
    font-weight: 600;
}

.sab-grid-header[b-ou0jboz9w5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.sab-grid-title[b-ou0jboz9w5] {
    font-size: 18px;
    font-weight: 600;
}

.sab-grid-search[b-ou0jboz9w5] {
    width: 250px;
}

[b-ou0jboz9w5] .sab-grid .dxbl-grid-header {
    background-color: var(--sab-surface) !important;
    color: var(--sab-text);
    font-weight: 600;
}





/* edit-mode switch (popup / inline) */
.sab-grid-edit-mode[b-ou0jboz9w5] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.sab-grid-enter-hint[b-ou0jboz9w5] {
    font-size: 11px;
    opacity: .65;
}

/* inline cell editor */
input.sab-grid-inline-editor[b-ou0jboz9w5] {
    width: 100%;
    box-sizing: border-box;
    border: none;
    outline: none;
    background: transparent;
    font: inherit;
    color: inherit;
    padding: 0 2px;
}

input.sab-grid-inline-editor.sab-num[b-ou0jboz9w5] {
    text-align: right;
}

input.sab-grid-inline-editor.sab-required[b-ou0jboz9w5] {
    border-left: 3px solid #d9534f;
}

.sab-grid-inline-ro[b-ou0jboz9w5] {
    display: block;
    padding: 0 2px;
    opacity: .75;
}

/* cell edit mode: poori row blue nahi, sirf active cell */
[b-ou0jboz9w5] .sab-grid td.dxbl-grid-edit-cell,
[b-ou0jboz9w5] .sab-grid td:focus-within {
    box-shadow: inset 0 0 0 2px var(--sab-primary);
}

/* row edit me hai - typed (abhi save nahi hui) value */
.sab-grid-inline-pending[b-ou0jboz9w5] {
    font-style: italic;
}

/* child grid column in the grid cell */
.sab-childgrid-cell[b-ou0jboz9w5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    cursor: pointer;
    width: 100%;
}

.sab-childgrid-cell .sab-childgrid-trigger-icon[b-ou0jboz9w5] {
    opacity: .6;
}

.sab-childgrid-cell:hover .sab-childgrid-trigger-icon[b-ou0jboz9w5] {
    opacity: 1;
}
/* _content/ZabWebErp_dev/Components/Controls/SabGrid.razor.rz.scp.css */

.sab-toolbar[b-cw3ryzyj7r] {
    background: var(--sab-bg);
    border: 1px solid var(--sab-border);
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,.12);
    padding: 6px 10px;
    margin-bottom: 6px;
}

.sab-export-item[b-cw3ryzyj7r] {
    font-size: 16px !important;
    font-weight: 600;
    font-family: "Segoe UI";
}

    .sab-export-item *[b-cw3ryzyj7r] {
        font-size: 16px !important;
        font-weight: 600 !important;
        font-family: "Segoe UI" !important;
    }

.sab-grid .dxbl-grid-row.dxbl-selection td[b-cw3ryzyj7r] {
    background-color: var(--sab-surface-active) !important;
}


.sab-grid .dxbl-grid-header-content:hover[b-cw3ryzyj7r] {
    background-color: var(--sab-primary-soft); /* Same colour as row hover */
    cursor: pointer;
}

.sab-grid .dxbl-grid-header:hover[b-cw3ryzyj7r] {
    background-color: var(--sab-primary-soft-hover);
}

.sab-grid th:hover[b-cw3ryzyj7r] {
    background-color: var(--sab-primary-soft-hover);
}


.sab-grid .dxbl-grid-header-row:has(.dxbl-grid-header:hover)[b-cw3ryzyj7r] {
    background-color: var(--sab-surface-active)  !important;
}
.sab-toolbar .sab-export-grid[b-cw3ryzyj7r] {
    background-color: var(--sab-surface-active) !important;
}



.sab-grid-header[b-cw3ryzyj7r] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.sab-grid-title[b-cw3ryzyj7r] {
    font-size: 18px;
    font-weight: 600;
}

.sab-grid-search[b-cw3ryzyj7r] {
    width: 250px;
}

[b-cw3ryzyj7r] .sab-grid .dxbl-grid-header {
    background-color: var(--sab-surface) !important;
    color: var(--sab-text);
    font-weight: 600;
}



/* _content/ZabWebErp_dev/Components/Controls/SabGridPopup.razor.rz.scp.css */
[b-lm7wvx70l6] .sab-button {
    border: 1px solid var(--sab-border);
    border-radius: 6px;
    padding: 5px 14px;
    background-color: var(--sab-bg);
    color: var(--sab-text);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
    min-height: 32px;
    transition: all 0.15s ease;
}

    [b-lm7wvx70l6] .sab-button:hover {
        background-color: var(--sab-surface-hover);
        border-color: var(--sab-border-strong);
        box-shadow: 0 3px 7px rgba(0, 0, 0, 0.20);
    }

    [b-lm7wvx70l6] .sab-button:active {
        transform: translateY(1px);
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    }
/* _content/ZabWebErp_dev/Components/Controls/SabHtmlGrid.razor.rz.scp.css */
.sab-html-grid[b-yarzo3ibqd] {
    border-collapse: collapse;
    white-space: nowrap;
    width: max-content;
    min-width: 100%;
    font-family: Segoe UI;
    font-size: 13px;
}

    .sab-html-grid th[b-yarzo3ibqd] {
        background: var(--sab-surface);
        border: 1px solid var(--sab-border-strong);
        padding: 5px;
        position: sticky;
        top: 0;
    }

    .sab-html-grid td[b-yarzo3ibqd] {
        border: 1px solid var(--sab-border);
        padding: 4px 6px;
    }

    .sab-html-grid .num[b-yarzo3ibqd] {
        text-align: right;
    }
/* _content/ZabWebErp_dev/Components/Controls/SabLookup.razor.rz.scp.css */
.sablookup-box[b-sh5d9v7rrk] {
    display: flex;
    align-items: center;
    width: 100%;
    height: 24px;
    background: var(--sab-bg);
    border: 1px solid var(--sab-border);
    border-radius: 4px;
    overflow: hidden;
}

.sablookup-text[b-sh5d9v7rrk] {
    flex: 1;
    min-width: 0;
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 8px;
    background: var(--sab-bg);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sablookup-button[b-sh5d9v7rrk] {
    width: 32px;
    min-width: 32px;
    height: 100%;
    background: var(--sab-bg);
    border: 0;
    border-left: 1px solid var(--sab-border);
    cursor: pointer;
    font-size: 12px;
    padding: 0;
    margin: 0;
}

    .sablookup-button:hover[b-sh5d9v7rrk] {
        background: var(--sab-surface-hover);
    }

.sab-grid .dxbl-grid-header-row > th[b-sh5d9v7rrk] {
    background: var(--sab-primary-soft);
    font-weight: bold;
}


.sablookup-grid .dxbl-grid-header[b-sh5d9v7rrk],
.sablookup-grid .dxbl-grid-header-content[b-sh5d9v7rrk],
.sablookup-grid th[b-sh5d9v7rrk] {
    background: var(--sab-surface) !important;
    color: var(--sab-text) !important;
    font-weight: 700 !important;
}

/* _content/ZabWebErp_dev/Components/Controls/SabText.razor.rz.scp.css */
.sabtext-box[b-m6nt2hb3i1] {
    position: relative;
    width: 100%;
    cursor: pointer;
}

.sabtext-dropdown[b-m6nt2hb3i1] {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 11px;
    pointer-events: none;
}

.sab-lookup-popup[b-m6nt2hb3i1] {
    transform-origin: top center !important;
}

    /* Popup ko viewport ke andar rakho */
    .sab-lookup-popup .dxbl-popup[b-m6nt2hb3i1] {
        top: 20px !important;
        bottom: auto !important;
        transform: none !important;
    }
/* _content/ZabWebErp_dev/Components/Controls/SabToolTip.razor.rz.scp.css */
.sab-control-tooltip[b-3atf911zo6] {
    position: relative;
    width: 100%;
}

    .sab-control-tooltip[b-3atf911zo6]::after {
        content: attr(data-tooltip);
        position: absolute;
        left: 0;
        bottom: calc(100% + 6px);
        background: var(--sab-text);
        color: var(--sab-bg);
        padding: 5px 9px;
        border-radius: 4px;
        font-size: 12px;
        white-space: nowrap;
        z-index: 999999;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

    .sab-control-tooltip:hover[b-3atf911zo6]::after {
        opacity: 1;
        visibility: visible;
    }

.sab-has-tooltip[b-3atf911zo6] {
    width: 100%;
}
/* _content/ZabWebErp_dev/Components/Layout/Drawer.razor.rz.scp.css */
.drawer-container[b-4y58d2se18] {
    height: 100%;
}

.navigation-drawer-shading[b-4y58d2se18] {
    height: 100%;
    position: absolute;
    transition: ease 300ms;
    transition-property: opacity, visibility;
    visibility: visible;
    width: 100%;
    z-index: 99;
    background-color: var(--dxds-color-surface-backdrop-default-rest);
}

.navigation-drawer.mobile.panel-closed .navigation-drawer-shading[b-4y58d2se18] {
    opacity: 0;
    visibility: hidden;
}

[b-4y58d2se18] .navigation-drawer > .dxbl-drawer-panel {
    display: flex;
}

[b-4y58d2se18] .navigation-drawer.mobile > .dxbl-drawer-panel {
    display: none;
}

.navigation-drawer-shading[b-4y58d2se18] {
    display: none;
}

[b-4y58d2se18] .panel-open:not(.mobile) .nav-buttons-container .menu-button {
    display: none;
}

@media (max-width: 768px) {
    [b-4y58d2se18] .navigation-drawer > .dxbl-drawer-panel {
        display: none;
    }

    [b-4y58d2se18] .navigation-drawer.mobile > .dxbl-drawer-panel {
        display: flex;
    }

    .navigation-drawer-shading[b-4y58d2se18] {
        display: block;
    }

    [b-4y58d2se18] .panel-open:not(.mobile) .nav-buttons-container .menu-button {
        display: flex;
    }
}
/* _content/ZabWebErp_dev/Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-8lnbuzfxdq] {
    height: 100%;
    min-height: 0;
}


/* =========================================================
   NAVIGATION DRAWER
   ========================================================= */

[b-8lnbuzfxdq] .navigation-drawer {
    --dxbl-drawer-panel-body-padding-x: 0;
    --dxbl-drawer-panel-body-padding-y: 1rem;
    --dxbl-drawer-panel-footer-bg: var(--sab-surface);
    --dxbl-drawer-panel-header-bg: var(--sab-surface);
    --dxbl-drawer-separator-border-width: 0;
    overflow: visible !important;
}


    /* Left Drawer Background */
    [b-8lnbuzfxdq] .navigation-drawer > .dxbl-drawer-panel {
        background: var(--sab-surface);
        border-radius: 0 12px 12px 0;
        border-right: 1px solid var(--sab-border);
        box-shadow: 4px 0 16px rgba(0, 0, 0, 0.10);
        overflow: visible;
    }


.navigation-drawer-header[b-8lnbuzfxdq] {
    position: sticky;
    top: 0;
    z-index: 100;
    height: 48px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    padding-left: 2px;
    padding-right: 4px;
    background: var(--sab-surface);
}


    .navigation-drawer-header .logo[b-8lnbuzfxdq] {
        height: 1.5rem;
        width: 5rem;
    }


/* =========================================================
   DRAWER BODY
   ========================================================= */

.drawer-body[b-8lnbuzfxdq] {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
    min-height: 0;
    background: var(--sab-surface);
}


/* =========================================================
   DRAWER CONTENT / MAIN CONTENT
   ========================================================= */

.drawer-content[b-8lnbuzfxdq] {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: auto;
    background: var(--sab-bg);
}


.page-content-container[b-8lnbuzfxdq] {
    height: 90%;
    overflow-y: auto;
    padding-bottom: 130px;
    box-sizing: border-box;
    background: var(--sab-bg);
}


@media (max-width: 768px) {

    .drawer-content[b-8lnbuzfxdq] {
        padding: 0.5rem 0.5rem 0.5rem 5px;
    }
}


/* =========================================================
   NAVIGATION BUTTONS
   ========================================================= */

.nav-buttons-container[b-8lnbuzfxdq] {
    align-items: center;
    display: flex;
    gap: 0.625rem;
    min-height: 2rem;
}


[b-8lnbuzfxdq] .nav-buttons-container > a {
    color: inherit;
}


[b-8lnbuzfxdq] .nav-buttons-container .back-button {
    padding-left: 0;
    padding-right: 0.25rem;
}


/* =========================================================
   COMPANY NAME
   ========================================================= */

.company-name[b-8lnbuzfxdq] {
    font-size: 18px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--sab-text);
    font-weight: 600;
}


/* =========================================================
   DRAWER TOGGLE BUTTON
   ========================================================= */

[b-8lnbuzfxdq] .drawer-toggle-btn {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    padding: 2px !important;
    margin-left: 0 !important;
}


    [b-8lnbuzfxdq] .drawer-toggle-btn .dxbl-image,
    [b-8lnbuzfxdq] .drawer-toggle-btn i {
        font-size: 16px !important;
    }


/* =========================================================
   TOP HEADER
   ========================================================= */

.top-header[b-8lnbuzfxdq] {
    display: flex;
    align-items: center;
    gap: 1px;
    height: 40px;
    padding: 0 12px;
    background: var(--sab-surface);
    border-bottom: 1px solid var(--sab-border);
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.08);
    font-family: sans-serif;
    white-space: nowrap;
    color: var(--sab-text);
}


    .top-header .logo[b-8lnbuzfxdq] {
        height: 34px;
    }


    .top-header .btn-icon-only[b-8lnbuzfxdq] {
        margin-right: 4px;
    }


/* =========================================================
   HEADER LEFT
   ========================================================= */

.header-left[b-8lnbuzfxdq] {
    display: flex;
    align-items: center;
    min-width: 0;
    overflow: hidden;
}


/* =========================================================
   HEADER SPACER
   ========================================================= */

.header-spacer[b-8lnbuzfxdq] {
    flex: 1;
}


/* =========================================================
   HEADER RIGHT
   ========================================================= */

.header-right[b-8lnbuzfxdq] {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-left: auto;
    flex-shrink: 0;
}


.top-icon[b-8lnbuzfxdq] {
    margin-left: 1px;
    margin-right: 1px;
}


    /* Header Icons */
    .top-icon[b-8lnbuzfxdq],
    .top-icon i[b-8lnbuzfxdq] {
        color: var(--sab-text) !important;
        background: transparent !important;
    }


        .top-icon .fa-circle-user[b-8lnbuzfxdq] {
            color: var(--sab-text) !important;
        }


        .top-icon .dxbl-btn[b-8lnbuzfxdq] {
            background: transparent !important;
            border: none !important;
        }


/* Top header buttons */
[b-8lnbuzfxdq] .top-header .dxbl-btn {
    color: var(--sab-text) !important;
    background: transparent !important;
    border-color: transparent !important;
}


    /* Top header button hover */
    [b-8lnbuzfxdq] .top-header .dxbl-btn:hover {
        background: var(--sab-surface-hover) !important;
    }


/* =========================================================
   TRIAL VERSION
   ========================================================= */

.trial-version[b-8lnbuzfxdq] {
    color: var(--sab-danger);
    margin-left: 5px;
    white-space: nowrap;
    font-weight: 600;
}


/* =========================================================
   HEADER REMINDER BADGE
   ========================================================= */

.header-reminder-badge[b-8lnbuzfxdq] {
    position: absolute;
    top: 2px;
    right: 0;
    min-width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--sab-danger);
    color: white;
    font-size: 11px;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    line-height: 18px;
}


/* =========================================================
   DRAWER FOOTER
   ========================================================= */

.navigation-drawer-footer[b-8lnbuzfxdq] {
    display: flex;
    gap: 8px;
    padding: 8px;
    border-top: 1px solid var(--sab-border);
    background: var(--sab-surface);
    flex-shrink: 0;
    height: 52px;
    box-sizing: border-box;
}


.drawer-footer-btn[b-8lnbuzfxdq] {
    flex: 1;
}


[b-8lnbuzfxdq] .navigation-drawer-footer .dxbl-toolbar {
    min-height: 34px;
}


[b-8lnbuzfxdq] .navigation-drawer-footer .dxbl-toolbar-item {
    padding: 2px 8px;
    font-size: 12px;
}


/* =========================================================
   RIGHT PANEL
   ========================================================= */

.right-panel[b-8lnbuzfxdq] {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
}


.nav-search[b-8lnbuzfxdq] {
    flex-shrink: 0;
}


.sab-tree[b-8lnbuzfxdq] {
    flex: 1;
    min-height: 0;
    overflow: auto;
}


/* =========================================================
   REMINDER ROW
   ========================================================= */

.reminder-row[b-8lnbuzfxdq] {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 8px;
    padding: 6px 4px;
    cursor: pointer;
    background: var(--sab-surface-hover);
    border-radius: 6px;
    box-sizing: border-box;
    color: var(--sab-text);
}


    .reminder-row:hover[b-8lnbuzfxdq] {
        background: var(--sab-surface-active);
    }


/* =========================================================
   REMINDER BADGE
   ========================================================= */

.reminder-badge[b-8lnbuzfxdq] {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border-radius: 50px;
    background: var(--sab-danger);
    color: white;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
}


/* =========================================================
   SMALL TEXTBOX
   ========================================================= */

.sab-small-textbox .dxbl-text-editor-input[b-8lnbuzfxdq] {
    padding: 2px 6px !important;
    min-height: 15px !important;
    height: 15px !important;
    font-size: 8px;
}


.sab-small-textbox .dxbl-text-editor[b-8lnbuzfxdq] {
    min-height: 15px !important;
}


/* =========================================================
   NOTEPAD POPUP
   ========================================================= */

.sab-notepad-popup[b-8lnbuzfxdq] {
    border-radius: 12px !important;
    overflow: hidden !important;
}


    /* Popup Header */
    .sab-notepad-popup .sab-popup-header[b-8lnbuzfxdq] {
        justify-content: space-between;
        width: 100%;
        min-height: 48px;
        display: flex;
        align-items: center;
        padding: 0 16px;
        gap: 10px;
        background: var(--sab-surface);
        color: var(--sab-primary-text);
        font-size: 18px;
        font-weight: 600;
        border-bottom: 1px solid var(--sab-border);
        box-shadow: 0 2px 8px rgba(0, 80, 160, 0.12);
    }


.sab-popup-header i[b-8lnbuzfxdq] {
    font-size: 17px;
}


/* =========================================================
   NOTEPAD BODY
   ========================================================= */

.sab-notepad-popup .sab-notepad-body[b-8lnbuzfxdq] {
    width: 100% !important;
    height: 100% !important;
    min-height: 450px;
    margin: 0 !important;
    padding: 10px !important;
    box-sizing: border-box;
    display: flex;
}


    /* DxMemo */
    .sab-notepad-popup .sab-notepad-body .dxbl-memo[b-8lnbuzfxdq] {
        width: 100% !important;
        height: 100% !important;
        min-height: 450px !important;
        box-sizing: border-box;
    }


    /* Memo internal editor */
    .sab-notepad-popup .sab-notepad-body textarea[b-8lnbuzfxdq] {
        width: 100% !important;
        height: 100% !important;
        min-height: 430px !important;
        box-sizing: border-box;
        resize: none;
    }


/* =========================================================
   NOTEPAD FOOTER
   ========================================================= */

.sab-notepad-popup .sab-popup-footer[b-8lnbuzfxdq] {
    width: 100%;
    min-height: 48px;
    padding: 7px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    background: var(--sab-surface);
    color: var(--sab-text-muted);
    border-top: 1px solid var(--sab-border);
    box-shadow: 0 -2px 8px rgba(0, 80, 160, 0.10);
    font-size: 13px;
}


    /* Footer Button */
    .sab-notepad-popup .sab-popup-footer .dxbl-btn[b-8lnbuzfxdq] {
        border-radius: 6px;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
    }


/* =========================================================
   POWERED BY
   ========================================================= */

.powered-by[b-8lnbuzfxdq] {
    flex: 0 0 28px;
    height: 28px;
    min-height: 28px;
    max-height: 28px;
    width: fit-content;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    padding: 0 40px;
    color: var(--sab-primary-text);
    background: transparent;          /* koi background nahi */
    /* login page ke .company-title h1 jaisa font */
    font-family: inherit;
    font-size: 15px;
    font-weight: 700;
    text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.35);
    border-radius: 5px;
    box-shadow: none;
}


/* =========================================================
   THEME PICKER POPUP
   ========================================================= */

[b-8lnbuzfxdq] .sab-theme-popup .dxbl-popup-body {
    padding: 0;
}

.sab-theme-body[b-8lnbuzfxdq] {
    padding: 12px 16px 16px;
}

.sab-theme-group-title[b-8lnbuzfxdq] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    opacity: 0.65;
    margin: 10px 0 6px;
}

.sab-theme-grid[b-8lnbuzfxdq] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

.sab-theme-card[b-8lnbuzfxdq] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border: 1px solid var(--sab-border);
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
    user-select: none;
}

    .sab-theme-card:hover[b-8lnbuzfxdq] {
        border-color: var(--sab-primary);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
    }

    .sab-theme-card.active[b-8lnbuzfxdq] {
        border-color: var(--sab-primary);
        box-shadow: 0 0 0 2px color-mix(in srgb, var(--sab-primary) 30%, transparent);
    }

.sab-theme-swatch[b-8lnbuzfxdq] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 14px;
    box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.6);
}

.sab-theme-name[b-8lnbuzfxdq] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex: 1;
    font-size: 13px;
    font-weight: 600;
}

.sab-theme-mode-icon[b-8lnbuzfxdq] {
    font-size: 11px;
    opacity: 0.55;
    margin-left: 6px;
}
/* _content/ZabWebErp_dev/Components/Layout/NavMenu.razor.rz.scp.css */

[b-y7y4kh4uja] .menu {
    --dxbl-menu-item-color: var(--sab-text);
    --dxbl-menu-item-image-color: var(--sab-text);
    --dxbl-menu-item-hover-bg: var(--sab-surface-hover);
    --dxbl-menu-item-hover-color: var(--sab-primary-text);
    --dxbl-menu-item-hover-image-color: var(--sab-primary-text);
    background: var(--sab-bg);
    border-radius: 10px;
    padding: 8px;
    box-shadow: 0 4px 16px rgba(0,0,0,.10);
}
    [b-y7y4kh4uja] .menu.display-mobile {
        margin-bottom: 2rem;
    }

    [b-y7y4kh4uja] .menu .dxbl-menu-item {
        border-radius: 8px;
        margin: 2px 4px;
        transition: all .2s ease;
    }

/* Active menu */
[b-y7y4kh4uja] .menu-item-active {
    background: linear-gradient(180deg, color-mix(in srgb, var(--sab-primary) 80%, var(--sab-bg)) 0%, var(--sab-primary) 100%);
    color: var(--sab-on-primary) !important;
    border-radius: 8px;
}
[b-y7y4kh4uja] .menu .dxbl-menu-item:hover {
    background: var(--sab-surface-hover);
}
.navigation-drawer[b-y7y4kh4uja] {
    background: linear-gradient(180deg, color-mix(in srgb, var(--sab-primary) 80%, var(--sab-bg)) 0%, var(--sab-primary) 100%);
}

[b-y7y4kh4uja] .menu-item-active .dxbl-menu-item-text,
[b-y7y4kh4uja] .menu-item-active .dxbl-menu-item-image {
    color: var(--sab-on-primary) !important;
}

[b-y7y4kh4uja] .menu .dxbl-menu-item.dxbl-menu-item-level-0 {
    font-weight: 600;
}

[b-y7y4kh4uja] .menu .dxbl-menu-item.dxbl-menu-item-level-1 {
    padding-left: 20px;
}

[b-y7y4kh4uja] .menu .dxbl-menu-item.dxbl-menu-item-level-2 {
    padding-left: 40px;
}


.sab-tree[b-y7y4kh4uja] {
    background: var(--sab-bg);
    border-radius: 10px;
    padding: 8px;
    box-shadow: 0 6px 20px rgba(0,0,0,.12);
    height: 50%;
}

[b-y7y4kh4uja] .sab-tree .dxbl-tv-node {
    border-radius: 6px;
}

    [b-y7y4kh4uja] .sab-tree .dxbl-tv-node:hover {
        background: var(--sab-surface-hover);
    }

[b-y7y4kh4uja] .sab-tree .dxbl-tv-node-selected {
    background: linear-gradient(180deg, color-mix(in srgb, var(--sab-primary) 80%, var(--sab-bg)) 0%, var(--sab-primary) 100%);
    color: var(--sab-on-primary);
}


.drawer-content[b-y7y4kh4uja] {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

.reminder-row[b-y7y4kh4uja] {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    width: 100%;
    padding: 6px 4px;
    cursor: pointer;
    background: var(--sab-bg);
    border-radius: 6px;
    box-sizing: border-box;
}

    .reminder-row:hover[b-y7y4kh4uja] {
        background: var(--sab-surface-hover);
    }
/* _content/ZabWebErp_dev/Components/Pages/Counter.razor.rz.scp.css */
.counter-block[b-fcrg8nka1y] {
    align-items: center;
    border-radius: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    height: 17rem;
    justify-content: center;
    padding: 2.5rem 1.5rem 1.5rem;
    width: 16.875rem;
    border: 1px solid var(--dxds-color-border-neutral-default-rest);
}

.counter-block .counter-content[b-fcrg8nka1y] {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.counter-block .counter-count[b-fcrg8nka1y] {
    font-size: 7.5rem;
    font-weight: 400;
    line-height: 7.75rem;
}
/* _content/ZabWebErp_dev/Components/Pages/Dashboard.razor.rz.scp.css */
/* ---- shadow tokens (light + dark) ----
   .dashboard-work sits OUTSIDE .sab-dashboard in the markup, so both
   need the variables - otherwise the panels inherit nothing.        */
.sab-dashboard[b-8ihviz41l4],
.dashboard-work[b-8ihviz41l4] {
    --dash-shadow: 0 1px 2px rgba(16,24,40,.08), 0 4px 12px rgba(16,24,40,.10);
    --dash-shadow-hi: 0 3px 8px rgba(16,24,40,.12), 0 16px 32px rgba(16,24,40,.18);
}

html.sab-dark .sab-dashboard[b-8ihviz41l4],
html.sab-dark .dashboard-work[b-8ihviz41l4],
.sab-dark .sab-dashboard[b-8ihviz41l4],
.sab-dark .dashboard-work[b-8ihviz41l4] {
    --dash-shadow: 0 1px 2px rgba(0,0,0,.45), 0 6px 16px rgba(0,0,0,.45);
    --dash-shadow-hi: 0 3px 8px rgba(0,0,0,.55), 0 18px 34px rgba(0,0,0,.55);
}

.sab-dashboard[b-8ihviz41l4] {
    padding: 20px;
}


.dashboard-cards[b-8ihviz41l4] {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}


.dash-card[b-8ihviz41l4] {
    display: flex;
    align-items: center;
    min-width: 355px;
    height: 90px;
    box-sizing: border-box;
    background: var(--sab-bg);
    padding: 12px 16px 12px 10px;
    border: 1px solid var(--sab-border);
    border-radius: 10px;
    box-shadow: var(--dash-shadow);
    cursor: pointer;
    transition: box-shadow .2s ease, transform .2s cubic-bezier(.22,.78,.3,1), border-color .2s ease;
}

    .dash-card:hover[b-8ihviz41l4] {
        transform: translateY(-3px);
        box-shadow: var(--dash-shadow-hi);
        border-color: var(--sab-primary-border);
    }

    .dash-card:active[b-8ihviz41l4] {
        transform: translateY(-1px);
    }

/* Left circular icon */
.dash-icon[b-8ihviz41l4] {
    width: 52px;
    height: 52px;
    min-width: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 20px;
    background: var(--sab-surface);
    color: var(--sab-text);
    border-radius: 50%;
}

    .dash-icon img[b-8ihviz41l4] {
        width: 23px;
        height: 23px;
    }

/* Center content */
.dash-content[b-8ihviz41l4] {
    flex: 1;
    min-width: 0;
}

    .dash-content h3[b-8ihviz41l4] {
        margin: 0 0 5px 0;
        font-size: 15px;
        font-weight: 400;
        line-height: 1.2;
        color: var(--sab-text);
    }

    .dash-content p[b-8ihviz41l4] {
        margin: 0;
        font-size: 15px;
        font-weight: 500;
        line-height: 1.2;
        color: var(--sab-text);
    }

/* Right percentage */
.dash-growth[b-8ihviz41l4] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-width: 77px;
    height: 36px;
    padding: 0 10px;
    border-radius: 10px;
    background: var(--sab-surface);
    color: var(--sab-text);
    font-size: 13px;
}

    .dash-growth span[b-8ihviz41l4] {
        font-size: 13px;
        line-height: 1;
    }

    .dash-growth b[b-8ihviz41l4] {
        font-weight: 600;
    }

.dashboard-work[b-8ihviz41l4] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));
    gap: 20px;
}

.chart-box[b-8ihviz41l4] {
    background: var(--sab-bg);
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,.15);
}

.chart-container[b-8ihviz41l4] {
    width: 100%;
    min-width: 0;
}

.dashboard-charts[b-8ihviz41l4] {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 20px;
    width: 100%;
}

.dashboard-panel[b-8ihviz41l4] {
    width: 100%;
    min-width: 0;
}

@media (max-width: 768px) {

    .dashboard-charts[b-8ihviz41l4] {
        grid-template-columns: 1fr;
        gap: 12px;
    }
}

.chart-card .dxbl-chart[b-8ihviz41l4] {
    height: 380px !important;
}

.dash-chart-panel[b-8ihviz41l4] {
    width: 100%;
}



.dashboard-panel[b-8ihviz41l4] {
    margin-top: 10px;
    border-radius: 20px;
    overflow: visible;
}

.chart-card[b-8ihviz41l4] {
    background: var(--sab-bg);
    border-radius: 12px;
    padding: 20px;
    margin-top: 20px;
    border: 1px solid var(--sab-border);
    box-shadow: var(--dash-shadow);
}

@media (max-width: 768px) {

    .dashboard-charts[b-8ihviz41l4] {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .dashboard-chart-item[b-8ihviz41l4] {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 380px) {

    .dash-card[b-8ihviz41l4] {
        height: 70px;
        padding: 7px 8px;
        width: 380px
    }

    .dashboard-charts[b-8ihviz41l4] {
        width: 380px;
    }
}


/* =========================================================
   SHADOWS on the chart / grid panels
   DxPanel and DxGrid render their own root element, which a
   scoped stylesheet cannot reach - hence ::deep.
   ========================================================= */

.dashboard-charts[b-8ihviz41l4]  .dashboard-panel {
    background: var(--sab-bg);
    border: 1px solid var(--sab-border);
    border-radius: 12px;
    box-shadow: var(--dash-shadow);
    overflow: hidden;
    transition: box-shadow .22s ease, transform .22s cubic-bezier(.22,.78,.3,1);
}

    .dashboard-charts[b-8ihviz41l4]  .dashboard-panel:hover {
        transform: translateY(-3px);
        box-shadow: var(--dash-shadow-hi);
    }

/* panel header strip */
.dashboard-charts[b-8ihviz41l4]  .dashboard-panel .dxbl-panel-header {
    border-bottom: 1px solid var(--sab-border);
    background: linear-gradient(to bottom, var(--sab-neutral-6), transparent);
}

.dashboard-charts[b-8ihviz41l4]  .dashboard-panel h3 {
    margin: 0;
    font-size: 15px;
    font-weight: 600;
    color: var(--sab-text);
}

/* the grid inside the panel: no second box, the panel already has one */
.dashboard-charts[b-8ihviz41l4]  .dashboard-grid,
.dashboard-charts[b-8ihviz41l4]  .dashboard-grid .dxbl-grid {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* charts must not paint their own box over the panel */
.dashboard-charts[b-8ihviz41l4]  .dxbl-chart,
.dashboard-charts[b-8ihviz41l4]  .dxbl-pie-chart {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

@media (prefers-reduced-motion: reduce) {
    .dash-card[b-8ihviz41l4],
    .dashboard-charts[b-8ihviz41l4]  .dashboard-panel {
        transition: none !important;
    }
}
/* _content/ZabWebErp_dev/Components/Pages/Index/Index.razor.rz.scp.css */
[b-515i5yeqqg] .index-gridlayout {
    container-type: inline-size;
    height: auto;
    margin-top: auto;
    margin-bottom: auto;
    padding-bottom: 9rem;
}

[b-515i5yeqqg] .title {
    padding-bottom: 3rem;
    text-align: center;
}

[b-515i5yeqqg] .tiles {
    --tile-column-count: 4;

    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(var(--tile-column-count), max-content);
    justify-content: center;

    @container (max-width: 60.5rem) {
        --tile-column-count: 3;
    }
    @container (max-width: 45.125rem) {
        --tile-column-count: 2;
    }
    @container (max-width: 29.75rem) {
        --tile-column-count: 1;
    }
}
/* _content/ZabWebErp_dev/Components/Pages/Index/IndexTile.razor.rz.scp.css */
.tile[b-ahnuuo4p0n] {
    border-radius: 0.75rem;
    height: 7.5rem;
    transition: box-shadow 0.2s;
    width: 14.375rem;
    border: 1px solid var(--dxds-color-border-neutral-default-rest);
}

.tile:hover[b-ahnuuo4p0n] {
    box-shadow: 0 4px 8px 0 rgba(170, 170, 170, 0.24), 0 0 2px 0 rgba(170, 170, 170, 0.2);
}

.tile[b-ahnuuo4p0n]  > a {
    text-decoration: none;
}

[b-ahnuuo4p0n] .tile-content {
    padding: 1rem;
}

[b-ahnuuo4p0n] .tile-icon {
    border-radius: 0.375rem;
    height: 2.75rem;
    padding: 0.75rem;
    width: 2.75rem;
    border: 1px solid var(--dxds-color-border-neutral-default-rest);
}

[b-ahnuuo4p0n] .tile-title {
    align-self: center;
    color: var(--dxds-color-content-neutral-default-rest);
    font-size: var(--dxds-font-size-base-md);
    font-weight: var(--dxds-font-weight-base-strong);
    letter-spacing: var(--dxds-letter-spacing-base-md);
    line-height: var(--dxds-line-height-base-md);
}

[b-ahnuuo4p0n] .tile-description {
    color: var(--dxds-color-content-neutral-subdued-rest);
    font-size: var(--dxds-font-size-base-sm);
    font-weight: var(--dxds-font-weight-base-default);
    letter-spacing: var(--dxds-letter-spacing-base-sm);
    line-height: var(--dxds-line-height-base-sm);
}
/* _content/ZabWebErp_dev/Components/Pages/SabErpLogin.razor.rz.scp.css */

/* ================================
   LOGIN PAGE - GLASS EFFECT
   ================================ */

.login-top[b-h4pt29rkz4] {
    position: relative;
    width: 420px;
    margin: 5px auto 5px auto;
    padding: 5px 35px 0px 35px;
    border: 1px solid rgba(255, 255, 255, 0.30);
    border-radius: 22px;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.20), inset 0 1px 1px rgba(255, 255, 255, 0.25);
    color: white;
}


/* Company / Logo */

.logo-area[b-h4pt29rkz4] {
    text-align: center;
    margin-bottom: 15px;
}

    .logo-area h2[b-h4pt29rkz4] {
        margin: 0 0 12px 0;
        font-size: 15px;
        color:white;
        font-weight: 600;
    }

    .logo-area h3[b-h4pt29rkz4] {
        margin: 5px 0;
        color: white;
        font-size: 20px;
        font-weight: 400;
        opacity: 0.85;
    }

.login-logo[b-h4pt29rkz4] {
    width: 350px;
    height: 100px;
    object-fit: contain;
    border-radius: 10px;
    padding: 8px;
    border: 1px solid rgba(200, 255, 255, 0.25);
    box-shadow: 0 5px 2px rgba(0, 0, 0, 0.18);
}

/* Fields */

.sab-field[b-h4pt29rkz4] {
    margin-bottom: 20px;
}


/* DevExpress TextBox */

.sab-login-textbox[b-h4pt29rkz4] {
    width: 100%;
    background: rgba(255, 255, 255, 0.14) !important;
    border: 1px solid rgba(255, 255, 255, 0.28) !important;
    border-radius: 10px !important;
    color: white !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: inset 0 1px 2px rgba(255,255,255,0.08);
}


    /* Placeholder */

    .sab-login-textbox input[b-h4pt29rkz4]::placeholder {
        color: rgba(255,255,255,0.70) !important;
    }


/* Login Button */

.login-buttons[b-h4pt29rkz4] {
    margin-top: 20px;
}

.sab-login-button[b-h4pt29rkz4] {
    width: 100%;
    border-radius: 10px !important;
    background: rgba(255, 255, 255, 0.22) !important;
    border: 1px solid rgba(255,255,255,0.35) !important;
    color: white !important;
    font-weight: 600;
    backdrop-filter: blur(10px);
    transition: all 0.25s ease;
}

    .sab-login-button:hover[b-h4pt29rkz4] {
        background: rgba(255,255,255,0.35) !important;
        transform: translateY(-1px);
        box-shadow: 0 6px 18px rgba(0,0,0,0.20);
    }


/* Remember Me */

.sab-field .dxbl-checkbox[b-h4pt29rkz4] {
    color: white !important;
}


/* Message */

.Login_message[b-h4pt29rkz4] {
    width: 384px;
    text-align: center;
    margin-top: 15px;
    min-height: 22px;
    /* light theme: black text, dark theme: white (see the override below) */
    color: #000000;
}


/* ================================
   SUPPORT GLASS CARD
   ================================ */

.login-support[b-h4pt29rkz4] {
    width: 750px;
    max-width: calc(100% - 30px);
    margin: 10px 0px;
    padding: 5px;
    text-align: center;
    color: inherit;            /* follows .Login_message -> theme colour */
    border-radius: 20px;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(50px);
    box-shadow: 0 8px 10px rgba(0.18, 0.18, 0.18, 0.18);
}


.support-logo[b-h4pt29rkz4] {
    width: 165px;
    height: 55px;
    object-fit: contain;
    border-radius: 12px;
}

.login-support h1[b-h4pt29rkz4] {
    margin: 1px 0;
    font-size: 12px;
}

.login-support h2[b-h4pt29rkz4] {
    margin: 1px 0;
    font-size: 10px;
}

.login-support h3[b-h4pt29rkz4] {
    margin: 5px 0;
    font-size: 8px;
}

.login-support p[b-h4pt29rkz4] {
    margin: 1px 0 1px 0;
    font-size: 8px;
}

.login-support ul[b-h4pt29rkz4] {
    list-style: none;
    padding: 0;
    margin: 5px 0;
}

.login-support li[b-h4pt29rkz4] {
    margin: 3px 0;
}


/* ================================
   FOOTER
   ================================ */

.login-footer[b-h4pt29rkz4] {
    text-align: center;
    color: rgba(255,255,255,0.70);
    background: radial-gradient(circle at 20% 20%, rgba(80,140,255,0.35), transparent 35%), radial-gradient(circle at 80% 30%, rgba(180,80,255,0.30), transparent 35%), radial-gradient(circle at 50% 90%, rgba(0,200,180,0.25), transparent 40%), linear-gradient(135deg, #101827, #17243a);
    font-size: 12px;
    margin: 15px 0 20px 0;
}



.login-page[b-h4pt29rkz4] {
    min-height: 80vh;
    overflow-y: auto;
}



.login-buttons[b-h4pt29rkz4] {
    width: 100%;
    display: flex;
    margin: 3px 0 0 0;
    padding: 0;
}

[b-h4pt29rkz4] .sab-login-button {
    flex: 1 1 auto !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    display: flex !important;
    box-sizing: border-box !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    background-image: linear-gradient( 180deg, var(--dxds-primary-40) 0%, var(--dxds-primary-90) 100% ) !important;
    border: none !important;
}

@media (max-width: 768px) {
    .login-logo[b-9cgbb44bbz][b-h4pt29rkz4] {
        width: 330px;
        height: 55px;
    }

    .login-top[b-h4pt29rkz4] {
        padding: 10px;
        width: 350px;
    }

    .login-support[b-h4pt29rkz4] {
        width: 330px;
    }
    .drawer-content[b-h4pt29rkz4]{
        padding:5px;


    }
    .login-footer[b-h4pt29rkz4]{
        width:400px
    }
    .login-page[b-h4pt29rkz4]{
        min-height:70vh;
    }
}

.company-title[b-h4pt29rkz4] {
    text-align: center;
    padding: 5px 2px;

}

    .company-title h1[b-h4pt29rkz4] {
        margin: 0;
        font-size: 15px;
        font-weight: 700;
        text-shadow: 3px 3px 6px rgba(0, 0, 0, 0.35);
    }

/* ================================
   THEME: login message / support card text
   light theme -> black, dark theme -> white
   (html.sab-dark is set by js/sabtheme.js)
   ================================ */

.Login_message[b-h4pt29rkz4],
.Login_message .login-support[b-h4pt29rkz4],
.Login_message .login-support h1[b-h4pt29rkz4],
.Login_message .login-support h2[b-h4pt29rkz4],
.Login_message .login-support h3[b-h4pt29rkz4],
.Login_message .login-support p[b-h4pt29rkz4],
.Login_message .login-support li[b-h4pt29rkz4] {
    color: #000000;
}

html.sab-dark .Login_message[b-h4pt29rkz4],
html.sab-dark .Login_message .login-support[b-h4pt29rkz4],
html.sab-dark .Login_message .login-support h1[b-h4pt29rkz4],
html.sab-dark .Login_message .login-support h2[b-h4pt29rkz4],
html.sab-dark .Login_message .login-support h3[b-h4pt29rkz4],
html.sab-dark .Login_message .login-support p[b-h4pt29rkz4],
html.sab-dark .Login_message .login-support li[b-h4pt29rkz4] {
    color: #ffffff;
}
/* _content/ZabWebErp_dev/Components/Reports/MstEntryV2.Razor.rz.scp.css */

.mst-v2-card[b-u39xbzfd99] {
    background: var(--sab-bg);
    border-radius: 12px;
    padding: 15px;
    margin: 10px;
    box-shadow: 0 4px 15px rgba(0,0,0,.18);
}


.mst-v2-tab-content[b-u39xbzfd99] 
{
    padding: 15px;
}


.mst-v2-field-row[b-u39xbzfd99] {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 8px 10px;
    border-bottom: 1px solid var(--sab-border);
}


    .mst-v2-field-row b[b-u39xbzfd99] {
        width: 120px;
    }


    .mst-v2-field-row small[b-u39xbzfd99] {
        color: var(--sab-text-muted);
    }

.mst-v2-header[b-u39xbzfd99] {
    background: var(--sab-surface);
    color: var(--sab-text);
    border-radius: 12px;
    padding: 3px;
    margin: 10px;
    box-shadow: 0 4px 15px rgba(0,0,0,.18);
    position: sticky;
    top: 0;
    z-index: 10;
}


.mst-v2-title[b-u39xbzfd99] {
    display: flex;
    align-items: center;
    gap: 20px;
}


    .mst-v2-title h3[b-u39xbzfd99] {
        margin: 0;
    }


.mst-v2-info[b-u39xbzfd99] {
    display: flex;
    gap: 25px;
    margin-top: 8px;
    color: var(--sab-text-muted);
}

.sab-compact[b-u39xbzfd99] {
    --dxbl-editor-height: 20px;
}


.menu-title[b-u39xbzfd99] {
    position: relative;
    display: inline-block;
    cursor: default;
    
}

.menu-tooltip[b-u39xbzfd99] {
    display: none;
    position: absolute;
    top: 110%;
    left: 0;
    min-width: 220px;
    padding: 8px 10px;
    background: var(--sab-bg);
    color: var(--sab-text);
    border-radius: 6px;
    font-size: 12px;
    line-height: 1.5;
    z-index: 9999;
    box-shadow: 0 4px 12px rgba(0,0,0,.25);
}

.menu-title:hover .menu-tooltip[b-u39xbzfd99] {
    display: block;
}



[b-u39xbzfd99] .dxbl-tabs-tablist {
    background: linear-gradient(var(--sab-primary-soft) 0%, var(--sab-primary-soft-hover) 100%);
    border-radius: 10px;
    padding: 1px;
    box-shadow: 0 2px 8px rgba(0,0,0,.08);
}


.sab-image-thumb[b-u39xbzfd99] {
    width: 90px;
    height: 90px;
    object-fit: contain;
    border: 1px solid var(--sab-border);
    border-radius: 6px;
    cursor: pointer;
    background: var(--sab-bg);
}

    .sab-image-thumb:hover[b-u39xbzfd99] {
        border-color: var(--sab-primary);
        box-shadow: 0 0 6px rgba(0,0,0,.25);
    }

.sab-image-preview[b-u39xbzfd99] {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.sab-image-large[b-u39xbzfd99] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.sab-divider[b-u39xbzfd99] {
    width: 100%;
    height: 1px;
    background: var(--sab-border);
    margin: 8px 0;
}
.sab-checkbox[b-u39xbzfd99] {
    display: block;
    width: 100%;
    margin-right: 18px;
}

.sab-button[b-u39xbzfd99] {
    width: 100%;
    width: 40px;
    margin-right: 18px;
}

.sab-check-container[b-u39xbzfd99] {
    display: flex;
    align-items: center;
    height: 100%;
    padding-top: 8px;
}

.sab-button-container[b-u39xbzfd99] {
    display: flex;
    align-items: center;
    padding-top: 8px;
}

    .sab-button-container .dxbl-btn[b-u39xbzfd99] {
        min-width: 120px;
    }
.sab-panel-header[b-u39xbzfd99] {
    font-size: 16px;
    font-weight: 600;
    padding: 8px 12px;
    margin-bottom: 10px;
    border-bottom: 1px solid var(--sab-border);
    background: var(--sab-surface-hover);
}
.sab-grid .dxbl-grid-header .dxbl-grid-header-content[b-u39xbzfd99] {
    font-weight: 700;
}



[b-u39xbzfd99] .sab-button {
    border: 1px solid var(--sab-border);
    border-radius: 6px;
    padding: 5px 14px;
    background-color: var(--sab-bg);
    color: var(--sab-text);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
    min-height: 32px;
    transition: all 0.15s ease;
}

    [b-u39xbzfd99] .sab-button:hover {
        background-color: var(--sab-surface-hover);
        border-color: var(--sab-border-strong);
        box-shadow: 0 3px 7px rgba(0, 0, 0, 0.20);
    }

    [b-u39xbzfd99] .sab-button:active {
        transform: translateY(1px);
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    }
/*******************************************/

.barcode-notepad[b-u39xbzfd99] {
    display: flex;
    width:350px;
    flex-direction: column;
    height: 100%;
    gap: 12px;
}

.barcode-camera-box[b-u39xbzfd99] {
    position: relative;
    width: 100%;
    height: 240px;
    overflow: hidden;
    border-radius: 8px;
    background: #111;
    border: 1px solid var(--sab-border);
}

/* dashed target band = area the decoder looks at first (90% x 50%) */
.barcode-target[b-u39xbzfd99] {
    position: absolute;
    left: 5%;
    right: 5%;
    top: 25%;
    bottom: 25%;
    border: 2px dashed rgba(255, 255, 255, 0.85);
    border-radius: 6px;
    box-shadow: 0 0 0 999px rgba(0, 0, 0, 0.35);
    pointer-events: none;
}

.barcode-cam-controls[b-u39xbzfd99] {
    position: absolute;
    right: 6px;
    top: 6px;
    display: flex;
    gap: 6px;
}

.barcode-cam-btn[b-u39xbzfd99] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.6);
    background: rgba(0, 0, 0, 0.45);
    color: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    padding: 0;
}

    .barcode-cam-btn:hover[b-u39xbzfd99] {
        background: rgba(0, 0, 0, 0.7);
    }

    .barcode-cam-btn.on[b-u39xbzfd99] {
        background: var(--sab-primary);
        border-color: var(--sab-primary);
    }

.barcode-cam-info[b-u39xbzfd99] {
    position: absolute;
    left: 6px;
    bottom: 4px;
    font-size: 10px;
    color: rgba(255, 255, 255, 0.75);
}

.barcode-hint[b-u39xbzfd99] {
    font-size: 11px;
    color: var(--sab-text-muted);
    margin-top: -6px;
}

    .barcode-camera-box video[b-u39xbzfd99] {
        width: 100%;
        height: 100%;
        display: block;
        object-fit: cover;
    }

.barcode-scan-line[b-u39xbzfd99] {
    position: absolute;
    left: 7%;
    right: 7%;
    top: 50%;
    height: 2px;
    background: red;
    box-shadow: 0 0 8px red;
    animation: barcodeScan-b-u39xbzfd99 1.5s infinite;
}

@keyframes barcodeScan-b-u39xbzfd99 {

    0% {
        top: 28%;
    }

    50% {
        top: 72%;
    }

    100% {
        top: 28%;
    }
}

.barcode-list-title[b-u39xbzfd99] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.barcode-manual-add[b-u39xbzfd99] {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 1;
    justify-content: flex-end;
}

.barcode-manual-textbox[b-u39xbzfd99] {
    width: 100px;
}

.barcode-count[b-u39xbzfd99] {
    min-width: 28px;
    padding: 3px 8px;
    border-radius: 12px;
    text-align: center;
    font-size: 12px;
}

.barcode-listbox[b-u39xbzfd99] {
    width: 100%;
    flex: 1;
    min-height: 260px;
    border: 1px solid var(--sab-border);
    border-radius: 5px;
    background: var(--sab-bg);
    padding: 4px;
    font-family: Consolas, monospace;
    font-size: 14px;
    outline: none;
}

    .barcode-listbox option[b-u39xbzfd99] {
        padding: 7px 8px;
    }

.barcode-footer[b-u39xbzfd99] {
    width: 100%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
}

.menu-title[b-u39xbzfd99] {
    position: relative;
    cursor: default;
    
    padding: 5px;
}

.tooltip[b-u39xbzfd99] {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    left: 0;
    top: 100%;
    background: var(--sab-text);
    color: var(--sab-bg);
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
    transition: opacity 0.2s;
    z-index: 1000;
}

.menu-title:hover .tooltip[b-u39xbzfd99] {
    visibility: visible;
    opacity: 1;
}


.barcode-action-row[b-u39xbzfd99] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.barcode-entry-row[b-u39xbzfd99] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    margin-bottom: 8px;
}

.barcode-barno[b-u39xbzfd99] {
    white-space: nowrap;
    font-weight: 600;
}

.barcode-textbox-container[b-u39xbzfd99] {
    flex: 1;
    min-width: 0;
}

.barcode-footer[b-u39xbzfd99] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    width: 100%;
}

.pdf-viewer[b-u39xbzfd99] {
    width: 100%;
    height: calc(90vh - 80px);
}




/****************************/

.sab-pdf-popup[b-u39xbzfd99] {
    background-image: url('/images/sabback.jpg') !important;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* Header */
.sab-pdf-header[b-u39xbzfd99] {
    width: 100%;
    height: 45px;
    min-height: 45px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 8px;
    box-sizing: border-box;
    background: linear-gradient(var(--sab-primary-soft), var(--sab-primary-soft-hover));
    border: 1px solid var(--sab-primary-border);
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
}

/* Heading */
.sab-pdf-title-button[b-u39xbzfd99] {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: var(--sab-text) !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Close */
.sab-pdf-close[b-u39xbzfd99] {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    padding: 0 !important;
    border-radius: 7px !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    color: var(--sab-text) !important;
}

    .sab-pdf-close:hover[b-u39xbzfd99] {
        background: #dc3545 !important;
        color: white !important;
    }


/* ============================= */
/* POPUP SCROLL CONTROL           */
/* ============================= */

.sab-pdf-popup .dxbl-popup-content[b-u39xbzfd99] {
    overflow: hidden !important;
    padding: 0 !important;
}

.sab-pdf-popup .dxbl-popup-body[b-u39xbzfd99] {
    overflow: hidden !important;
    padding: 0 !important;
}


/* PDF container */
.sab-pdf-body[b-u39xbzfd99] {
    width: 100%;
    height: 100%;
    overflow: hidden;
}


/* PDF Viewer */
.pdf-viewer[b-u39xbzfd99] {
    width: 100%;
    height: 100%;
}
[b-u39xbzfd99] .dxbl-fl-cpt {
    padding-top: 0 !important;
    margin-top: 0 !important;
    align-self: center !important;
    line-height: 1.2;
    font-weight: 500 !important;
    color: var(--sab-text) !important;
}
/* _content/ZabWebErp_dev/Components/Reports/Report.razor.rz.scp.css */
[b-jfse7e7kto] .filter-item .dxbl-fl-cpt {
    width: 120px; /* Caption width */
}

[b-jfse7e7kto] .filter-item .dxbl-fl-editor {
    width: 250px; /* Editor area width */
}

[b-jfse7e7kto] .filter-item {
    min-width: 400px; /* Total item width */
}

.report-filter-container[b-jfse7e7kto] {
    width: 700px; /* fixed width */
    margin-bottom: 15px;
}

.filter-panel[b-jfse7e7kto] {
    padding: 15px;
}

.filter-layout[b-jfse7e7kto] {
    width: 100%;
}

.menu-title[b-jfse7e7kto] {
    background: var(--sab-surface);
    color: var(--sab-text);

    padding: 8px 12px;

    border: 1px solid var(--sab-border);
    border-radius: 6px;

    font-size: 18px;
    font-weight: 600;

    margin: 0 0 12px 0;

    box-sizing: border-box;
}
.tooltip[b-jfse7e7kto] {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    left: 0;
    top: 100%;
    background: var(--sab-text);
    color: var(--sab-bg);
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
    transition: opacity 0.2s;
    z-index: 1000;
}

.menu-title:hover .tooltip[b-jfse7e7kto] {
    visibility: visible;
    opacity: 1;
}



.filter-header[b-jfse7e7kto] {
    background: var(--sab-bg);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
    border-radius: 10px;
}


.report-filter-box[b-jfse7e7kto] {
    background: var(--sab-bg);
    border-radius: 10px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.25);
    padding: 12px;
}

    .report-filter-box input[b-jfse7e7kto] {
        background-color: var(--sab-bg) !important;
    }

    .report-filter-box .dxbl-text-edit[b-jfse7e7kto],
    .report-filter-box .dxbl-date-edit[b-jfse7e7kto],
    .report-filter-box .dxbl-input[b-jfse7e7kto] {
        background-color: var(--sab-bg) !important;
    }

[b-jfse7e7kto] .report-filter-box .sab-help-textbox {
    background-color: var(--sab-bg) !important;
}
/* _content/ZabWebErp_dev/Components/Reports/Report_grid.razor.rz.scp.css */
.sab-group[b-4hbko50nol] {
    background: var(--sab-surface);
    border: 1px solid var(--sab-border);
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
}

    .sab-group .dxbl-panel[b-4hbko50nol] {
        background: var(--sab-surface);
        border: 1px solid var(--sab-border);
        border-radius: 8px;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
    }



.report-container[b-4hbko50nol] {
    position: relative;
}

.report-loading-overlay[b-4hbko50nol] {
    position: absolute;
    inset: 0;
    z-index: 9999;
    background: var(--sab-overlay);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: wait;
}

.report-loading-box[b-4hbko50nol] {
    background: var(--sab-bg);
    padding: 12px 20px;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.20);
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
}

.report-spinner[b-4hbko50nol] {
    width: 18px;
    height: 18px;
    border: 3px solid var(--sab-border);
    border-top-color: var(--sab-text);
    border-radius: 50%;
    animation: report-spin-b-4hbko50nol 0.8s linear infinite;
}

@keyframes report-spin-b-4hbko50nol {
    to {
        transform: rotate(360deg);
    }
}
/* _content/ZabWebErp_dev/Components/Reports/Sabgridreport.razor.rz.scp.css */
[b-iaulxvv3bv] .filter-item .dxbl-fl-cpt {
    width: 120px; /* Caption width */
}

[b-iaulxvv3bv] .filter-item .dxbl-fl-editor {
    width: 250px; /* Editor area width */
}

[b-iaulxvv3bv] .filter-item {
    min-width: 400px; /* Total item width */
}

.report-filter-container[b-iaulxvv3bv] {
    width: 700px; /* fixed width */
    margin-bottom: 15px;
    padding:20px;
}

.filter-panel[b-iaulxvv3bv] {
    padding: 15px;
}

.filter-layout[b-iaulxvv3bv] {
    width: 100%;
}

.menu-title[b-iaulxvv3bv] {
    position: relative;
    cursor: default;
    background-color: var(--sab-surface);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
    padding : 10px;
}
    .menu-title h2[b-iaulxvv3bv] {
        margin: 0 !important;
        padding: 0 !important;
        font-size: 20px !important;
        font-weight: 700 !important;
        color: var(--sab-text);
        line-height: 1.3;
    }


.report-sabtext[b-iaulxvv3bv] {
    flex: 1;
    background-color: var(--sab-surface) !important;
}

[b-iaulxvv3bv] .report-sabtext .dxbl-text-editor {
    background-color: var(--sab-surface) !important;
}

[b-iaulxvv3bv] .report-sabtext .dxbl-text-editor-input {
    background-color: var(--sab-surface) !important;
}
.tooltip[b-iaulxvv3bv] {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    left: 0;
    top: 100%;
    background: var(--sab-text);
    color: var(--sab-bg);
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
    transition: opacity 0.2s;
    z-index: 1000;
}

.menu-title:hover .tooltip[b-iaulxvv3bv] {
    visibility: visible;
    opacity: 1;
}



.filter-header[b-iaulxvv3bv] {
    background: var(--sab-bg);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
    border-radius: 10px;
}


.report-filter-box[b-iaulxvv3bv] {
    background: var(--sab-bg);
    border-radius: 10px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.25);
    padding:10px;
}

    .report-filter-box input[b-iaulxvv3bv] {
        background-color: var(--sab-bg) !important;
    }

    .report-filter-box .dxbl-text-edit[b-iaulxvv3bv],
    .report-filter-box .dxbl-date-edit[b-iaulxvv3bv],
    .report-filter-box .dxbl-input[b-iaulxvv3bv] {
        background-color: var(--sab-bg) !important;
    }

[b-iaulxvv3bv] .report-filter-box .sab-help-textbox {
    background-color: var(--sab-bg) !important;
}


.report-loading-overlay[b-iaulxvv3bv] {
    position: absolute;
    inset: 0;
    background: var(--sab-overlay);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

.report-loading-box[b-iaulxvv3bv] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    font-size: 16px;
    font-weight: 600;
}
/* ---------------- AI assistant side panel ---------------- */
.sab-gridai-panel[b-iaulxvv3bv] {
    flex: 0 0 340px;
    width: 340px;
    height: 70vh;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px;
    box-sizing: border-box;
    background: var(--sab-surface);
    border: 1px solid var(--sab-border);
    border-radius: 10px;
    color: var(--sab-text);
}

.sab-gridai-head[b-iaulxvv3bv] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    color: var(--sab-primary-text);
}

.sab-gridai-provider[b-iaulxvv3bv] {
    margin-left: auto;
    font-size: 11px;
    font-weight: 400;
    color: var(--sab-text-muted);
    border: 1px solid var(--sab-border);
    border-radius: 10px;
    padding: 1px 8px;
}

.sab-gridai-close[b-iaulxvv3bv] {
    border: 0;
    background: transparent;
    color: var(--sab-text-muted);
    cursor: pointer;
    font-size: 14px;
}

    .sab-gridai-close:hover[b-iaulxvv3bv] { color: var(--sab-danger); }

.sab-gridai-chat[b-iaulxvv3bv] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 6px;
    background: var(--sab-bg);
    border: 1px solid var(--sab-border);
    border-radius: 8px;
}

.sab-gridai-hint[b-iaulxvv3bv] {
    color: var(--sab-text-muted);
    font-size: 13px;
    line-height: 1.6;
    padding: 6px;
}

.sab-gridai-msg[b-iaulxvv3bv] {
    max-width: 92%;
    padding: 6px 10px;
    border-radius: 10px;
    font-size: 13px;
    white-space: pre-wrap;
    word-break: break-word;
}

    .sab-gridai-msg.user[b-iaulxvv3bv] {
        align-self: flex-end;
        background: var(--sab-primary);
        color: var(--sab-on-primary);
        border-bottom-right-radius: 2px;
    }

    .sab-gridai-msg.bot[b-iaulxvv3bv] {
        align-self: flex-start;
        background: var(--sab-surface-hover);
        border-bottom-left-radius: 2px;
    }

.sab-gridai-interim[b-iaulxvv3bv] {
    font-style: italic;
    color: var(--sab-text-muted);
    font-size: 12px;
}

.sab-gridai-buttons[b-iaulxvv3bv] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    align-items: center;
}

@media (max-width: 900px) {
    .sab-gridai-panel[b-iaulxvv3bv] { flex-basis: 260px; width: 260px; }
}
/* _content/ZabWebErp_dev/Components/Shared/SabEntRibbon.razor.rz.scp.css */
.sab-toolbar[b-cc3g92jm2l] {
    display:none;
}
.sab-ribbon[b-cc3g92jm2l] {
    border-radius: 10px;
    padding: 1px;
    margin: 5px;
 
}


    .sab-ribbon button[b-cc3g92jm2l] {
        background: linear-gradient(var(--sab-primary-soft) 0%, var(--sab-primary-soft-hover) 100%) !important;
        color: var(--sab-text) !important;
        border: 1px solid var(--sab-primary-border) !important;
        border-radius: 8px !important;
        box-shadow: 0 1px 4px rgba(0,0,0,.12);
    }


        .sab-ribbon button:hover[b-cc3g92jm2l] {
            background: linear-gradient(var(--sab-primary-soft-hover) 0%, var(--sab-primary-border) 100%) !important;
        }

    .sab-ribbon .dxbl-btn[b-cc3g92jm2l] {
        background: linear-gradient(var(--sab-primary-soft), var(--sab-primary-soft-hover)) !important;
        color: var(--sab-text) !important;
    }


    .sab-ribbon .sab-print-running[b-cc3g92jm2l] {
        background: var(--sab-primary) !important;
        background-image: none !important;
        color: white !important;
    }

        .sab-ribbon .sab-print-running .dxbl-btn-icon[b-cc3g92jm2l],
        .sab-ribbon .sab-print-running svg[b-cc3g92jm2l] {
            color: white !important;
        }

    .sab-ribbon.sab-print-wait[b-cc3g92jm2l],
    .sab-ribbon.sab-print-wait *[b-cc3g92jm2l] {
        cursor: wait !important;
    }