/* ===============================================
 * Tables
 * Canonical table styles from site_ext.css and custom.css
 * =============================================== */

.table th .table-text {
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    margin-bottom: 0 !important;
}

.table th .col-resizer {
    border-right: none;
}

.table td .table-cell {
    font-size: 0.825rem !important;
    font-weight: 400 !important;
    padding-right: 2px;
    /*margin-bottom: 0 !important;*/
}

.table-fixed-header {
    overflow: visible !important;
}

.table td .weight-column {
    font-weight: 600 !important;
}

.table thead tr {
    border-bottom: solid 1px var(--bs-border-color);
}

.table-excel tbody tr.active:not(.is-edit), .table-excel .table-row.active {
    --bs-table-bg-type: var(--bs-body-bg) !important;
}
/* List / modals: do not force table-layout:fixed on BB excel tables */
:not(.bill-input) .table-excel.table-layout-fixed {
    table-layout: inherit !important;
}

.table i.dropdown-toggle {
    /*background-color: var(--bs-table-bg);*/
    font-size: smaller;
}

.table .form-control {
    color: var(--bs-table-color-state, var(--bs-table-color-type, var(--bs-table-color)));
    background-color: var(--bs-table-bg);
}

.table th .table-cell {
    min-height: var(--zii-table-row-h, 3.25rem) !important;
}

.table td .table-cell {
    min-height: var(--zii-table-row-h, 3.25rem) !important;
}

    .table td .table-cell .text-truncate {
        height: var(--zii-table-row-h, 3.25rem) !important;
        line-height: var(--zii-table-row-h, 3.25rem);
    }

.table > tbody > tr:is(.instruction-row), .table > tbody > tr:is(.instruction-row) a, .table > tbody > tr:is(.instruction-row).active, .table > tbody > tr:is(.instruction-row):is(:hover) {
    font-size: 0.75rem !important;
    color: #5a6a85 !important;
    font-style: italic;
}

.table > :not(caption) > * > * {
    border-color: var(--bs-border-color) !important;
}

.table .instruction-row .instruction-hidden {
    display: none !important;
}

.table > tbody > tr:is(.submenu-row), .table > tbody > tr:is(.submenu-row) a, .table > tbody > tr:is(.submenu-row).active, .table > tbody > tr:is(.submenu-row):is(:hover) {
    font-size: 0.75rem !important;
    color: var(--bs-table-color) !important;
}

.table .submenu-row .instruction-hidden {
    display: none !important;
}

.table-container .table-quick-search {
    padding-top: 16px;
}

.form-group:not(:has(> :not(.form-check))) {
    align-items: end;
    display: flex;
}

.form-group {
    margin-bottom: 1rem !important;
}

    .form-group > .form-check {
        padding-left: 4px;
    }

.table-search .table-search-buttons, .table-search-buttons {
    min-width: fit-content;
    padding-right: 8px;
    align-items: end;
    display: flex;
}

    .table-search .table-search-buttons .btn {
        height: fit-content !important;
        display: flex !important;
        align-items: center !important;
        margin-left: 0px !important;
    }

.dropdown-menu .table-scroll {
    overflow: visible !important;
}

.table-scroll {
    overflow-x: auto !important;
    overflow-y: auto !important;
}
/* ------------------------------------------------------------------
 * Table width modes — defer layout to BootstrapBlazor (official Table demo).
 * - Do NOT force table-layout:fixed on .table (breaks fluid shrink + CardView).
 * - Only constrain wrappers (min-width:0) so flex parents can shrink the pane.
 * - .bill-list: keep scroll/height fixes for list pages.
 * - .bill-input: InCell dropdown overflow + editor min-width overrides only.
 * ------------------------------------------------------------------ */
.bill-list .list-body, .bill-list .table-container, .bill-list .table-wrapper, .bill-list .table-shim, .bill-list .table-scroll {
    min-width: 0;
    max-width: 100%;
}
    /*
 * List / report pages (.bill-list): single page vertical scrollbar.
 * 1) BB setBodyHeight() may write inline height: calc(100% - chrome) even when
 *    IsFixedHeader=false → inner vertical scroller + page scroll.
 * 2) overflow-x/y:auto together: a needed h-scrollbar shrinks the viewport and
 *    often leaves a vertical gutter (looks like a second scrollbar).
 * Use height:auto + overflow-y:hidden so the box grows with rows (no clip) and
 * only horizontal scroll stays on the table. Leave .table-fixed alone.
 */
    .bill-list .table-wrapper:not(.table-fixed) > .table-scroll, .bill-list .table-container > .table-scroll {
        height: auto !important;
        max-height: none !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
    }

        .bill-list .table-wrapper:not(.table-fixed) > .table-scroll > .table, .bill-list .table-container > .table-scroll > .table {
            height: auto !important;
        }

.bill-input .table-zone, .bill-input .table-noscroll {
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
}

    .bill-input .table-noscroll .table-wrapper, .bill-input .table-noscroll .table-shim, .bill-input .table-noscroll .table-scroll {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }
    /* Detail lines: inner scrollport visible for dropdowns; outer zone scrolls if cols exceed pane */
    .bill-input .table-noscroll .table-scroll, .bill-input .table-noscroll .table-shim {
        overflow: visible !important;
    }
/* Tree + table split: flex/grid children must shrink so the table can be 100% of the pane */
.bill-list .row > [class*="col-"] {
    min-width: 0;
}
/* List panes: fluid table width (BB official); override inline px width from column resize */
.bill-list .table-wrapper, .bill-list .table-fixed, .bill-list .table-shim, .bill-list .table-scroll {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

    .bill-list .table-scroll > .table, .bill-list .table-shim > .table, .bill-list .table-fixed-body > .table, .bill-list .table-fixed-header > .table {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

.bill-list .table col, .bill-list .table-card col {
    min-width: 0 !important;
}

.bill-list .table th, .bill-list .table td, .bill-list .table-card .table-row-cell {
    min-width: 0 !important;
}
/* Long headers must ellipsis so columns can shrink (BB thead th is nowrap) */
.bill-list .table thead th .table-text {
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}
/* Bill detail lines: master / BB InCell — auto layout, not site_tables fixed */
.bill-input .table-noscroll .table-scroll > .table, .bill-input .table-noscroll .table-shim > .table, .bill-input .table-noscroll table.table {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    table-layout: auto !important;
}

.bill-input .table-noscroll .table col {
    min-width: 0 !important;
}

.bill-input .table-noscroll .table th, .bill-input .table-noscroll .table td {
    min-width: 0 !important;
}
/*
 * BB AllowResizing mirrors TableColumn Width onto header .table-text as inline px.
 * That second width floor blocks table-layout:auto from shrinking columns when the
 * pane narrows (DevTools: table 1999px vs shim 1410px; remove .table-text width → 716px).
 * Colgroup px alone is enough; fluid shrink matches BootstrapBlazor official Table.
 */
.bill-input .table-noscroll .table-text, .bill-list .table .table-text {
    width: auto !important;
    max-width: 100%;
}

.bill-input .table-noscroll .table td > .table-cell:not(.is-wrap), .bill-input .table-noscroll .table th > .table-cell:not(.is-wrap) {
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

    .bill-input .table-noscroll .table td > .table-cell:not(.is-wrap) .table-text, .bill-input .table-noscroll .table th > .table-cell:not(.is-wrap) .table-text {
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;
    }
/* InCell editors must not inflate columns (beats custom-forms min-width: 80px) */
.bill-input .table-noscroll .table-cell .form-control, .bill-input .table-noscroll .table-cell .form-select, .bill-input .table-noscroll .table-cell .datetime-picker, .bill-input .table-noscroll .table-cell .datetime-picker-input, .bill-input .table-noscroll .table-cell .select, .bill-input .table-noscroll .table-cell .input-group, .bill-input .table-noscroll .table-cell .multi-select, .bill-input .table-noscroll .table-cell .auto-complete, .bill-input .table-noscroll .table-cell .popover {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
}
/* Actions: compact, do not absorb leftover blank space */
.bill-input .table-noscroll .table th.table-column-button, .bill-input .table-noscroll .table td.table-column-button, .bill-input .table-noscroll .table th.fixed-right, .bill-input .table-noscroll .table td.fixed-right {
    width: 3.75rem !important;
    min-width: 3.75rem !important;
    max-width: 3.75rem !important;
    white-space: nowrap;
}
/* Denser cells on laptop widths so more columns remain readable */
@media (max-width: 1599.98px) {
    .bill-list .table > :not(caption) > * > * {
        padding-left: 0.35rem !important;
        padding-right: 0.35rem !important;
    }
}

@media (max-width: 1399.98px) {
    .bill-list .table th .table-text,
    .bill-list .table td .table-cell,
    .tree-node-text {
        font-size: 0.75rem !important;
    }
}
/* Text truncates when a column is squeezed; TextWrap (.is-wrap) keeps wrapping */
.bill-list .table td > .table-cell:not(.is-wrap), .bill-list .table th > .table-cell:not(.is-wrap) {
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

    .bill-list .table td > .table-cell:not(.is-wrap) .table-text, .bill-list .table th > .table-cell:not(.is-wrap) .table-text {
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;
    }
/* TextWrap must beat global .text-truncate fixed height, or multi-line cells look "clipped" */
.bill-list .table td > .table-cell.is-wrap, .bill-list .table th > .table-cell.is-wrap, .bill-input .table-noscroll .table td > .table-cell.is-wrap, .bill-input .table-noscroll .table th > .table-cell.is-wrap {
    overflow: visible;
    white-space: normal;
    height: auto !important;
    line-height: 1.35;
    text-overflow: unset;
    vertical-align: middle;
}

    .bill-list .table td > .table-cell.is-wrap .text-truncate, .bill-list .table td > .table-cell.is-wrap .table-text, .bill-list .table th > .table-cell.is-wrap .text-truncate, .bill-list .table th > .table-cell.is-wrap .table-text, .bill-input .table-noscroll .table td > .table-cell.is-wrap .text-truncate, .bill-input .table-noscroll .table td > .table-cell.is-wrap .table-text, .bill-input .table-noscroll .table th > .table-cell.is-wrap .text-truncate, .bill-input .table-noscroll .table th > .table-cell.is-wrap .table-text {
        height: auto !important;
        max-height: none !important;
        line-height: 1.35 !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: unset !important;
    }
/* Item Code: compact ratio; wrap long codes without spaces */
.bill-list .table td.col-item-code > .table-cell.is-wrap, .bill-list .table th.col-item-code > .table-cell.is-wrap, .bill-list .table td.col-item-code > .table-cell.is-wrap .table-text, .bill-list .table th.col-item-code > .table-cell.is-wrap .table-text, .bill-input .table-noscroll .table td.col-item-code > .table-cell.is-wrap, .bill-input .table-noscroll .table th.col-item-code > .table-cell.is-wrap, .bill-input .table-noscroll .table td.col-item-code > .table-cell.is-wrap .table-text, .bill-input .table-noscroll .table th.col-item-code > .table-cell.is-wrap .table-text {
    word-break: break-all;
    overflow-wrap: anywhere;
}
/* Keep action / switch columns usable when the pane is narrow (list pages) */
.bill-list .table .table-column-button, .bill-list .table td.table-column-button, .bill-list .table th.table-column-button {
    overflow: hidden;
    white-space: nowrap;
    width: 4.75rem;
    max-width: 5.25rem;
}

.bill-list .table td .switch, .bill-list .table th .switch {
    max-width: 100%;
}
/* ------------------------------------------------------------------
 * Category tree + table split — fluid width.
 * Wide page/pane → tree grows; narrow → shrinks; phone / tiny pane → hide.
 * ------------------------------------------------------------------ */
.bill-list-split {
    container-type: inline-size;
    container-name: bill-list-split;
    /* ~192px … ~22% of split … ~352px */
    --zii-bill-tree-w: clamp(12rem, 22cqi, 22rem);
}

@supports not (width: 1cqi) {
    .bill-list-split {
        --zii-bill-tree-w: clamp(12rem, 16vw, 22rem);
    }
}

.bill-list-split > .bill-list-tree.dynamic-fixed-left {
    flex: 0 0 var(--zii-bill-tree-w) !important;
    width: var(--zii-bill-tree-w) !important;
    max-width: var(--zii-bill-tree-w) !important;
    min-width: 0;
}

.bill-list-split > .bill-list-main {
    flex: 1 1 0 !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0;
    overflow: hidden; /* keep fixed-layout table inside the pane */
}
/* Width spacer inserted by FixedHeaderManager while the tree is position:fixed */
.bill-list-split > .dynamic-fixed-left-placeholder {
    flex-shrink: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
    visibility: hidden !important;
}
/* Long category labels: one line + horizontal scroll on tree pane (not ellipsis) */
.bill-list-tree .tree-root.scroll, .bill-list-tree .scroll {
    overflow-x: auto !important;
    overflow-y: auto !important;
}

.bill-list-tree .tree-content, .bill-list-tree .tree-node, .bill-list-tree .tree-item, .bill-list-tree .node-content {
    white-space: nowrap;
    max-width: none;
    overflow: visible;
    text-overflow: unset;
}
/* Phone / small tablet: hide tree, table full width (Bootstrap md = 768px) */
@media (max-width: 767.98px) {
    .bill-list-split > .bill-list-tree.dynamic-fixed-left,
    .bill-list-split > .dynamic-fixed-left-placeholder {
        display: none !important;
        flex: 0 0 0 !important;
        width: 0 !important;
        max-width: 0 !important;
        min-width: 0 !important;
    }

    .bill-list-split > .bill-list-main {
        flex: 1 1 100% !important;
        max-width: 100% !important;
    }
}
/* Extremely narrow split (IDE side Browser): hide tree even on large viewports */
@container bill-list-split (max-width: 720px) {
    .bill-list-tree.dynamic-fixed-left,
    .dynamic-fixed-left-placeholder {
        display: none !important;
        flex: 0 0 0 !important;
        width: 0 !important;
        max-width: 0 !important;
        min-width: 0 !important;
    }

    .bill-list-main {
        flex: 1 1 100% !important;
        max-width: 100% !important;
    }
}

table th .table-cell.is-sort:has(.bb-popover) {
    padding-right: 2rem;
}

.table th .table-cell .bb-popover {
    display: flex !important;
    right: 0.25rem;
    top: 0;
    bottom: 0;
    color: var(--bs-black);
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: absolute;
}

.table th .table-cell.is-sort .bb-popover {
    right: 1.5rem;
}
/* Bill detail tables: allow SelectorInput/AutoComplete dropdowns to float
   over the table instead of expanding .table-scroll's scrollport.
   Root cause: .table-scroll { overflow: auto !important } was winning over
   .table-noscroll .table-scroll (no !important). Also avoid pairing
   overflow-x:scroll with overflow-y:visible — browsers compute the visible
   axis as auto, which recreates the scrollbar. Horizontal scroll stays on
   .table-noscroll (mobile) so the inner .table-scroll can remain visible. */
.table-noscroll {
    min-height: var(--zii-table-noscroll-min-h, 18.75rem);
}

    .table-noscroll .table-scroll, .table-noscroll .table-shim, .firefox .table-noscroll .table-scroll {
        overflow: auto !important;
    }

    .table-noscroll .overflow-auto {
        overflow: auto !important;
    }

.table-overflow .table-scroll {
    overflow: visible !important;
}
/* Wide editable tables in modals (e.g. Register Expenses) exceed ExtraLarge
   width; keep inner .table-scroll visible for dropdowns and scroll on the outer. */
.modal-body .table-noscroll {
    overflow-x: auto;
    max-width: 100%;
}
    /* InCell edit Save/Cancel text buttons must stay inside the action column;
   otherwise they spill into the adjacent date picker under overflow:visible. */
    .modal-body .table-noscroll .table-column-button {
        white-space: nowrap;
        overflow: hidden;
        vertical-align: middle;
    }

@media(max-width:767px) {
    .bill-input .table-noscroll {
        overflow-x: auto;
        padding-top: 8px;
    }
}

@media(max-width:768px) {
    .list-body {
        overflow-x: scroll;
    }
}
/*--- table-fixed-body Scrollbar style start ---*/
/*.table-fixed-body > .table > tbody > tr > td, .table-fixed-header > .table > thead > tr > th {
    overflow: inherit !important;
}*/
/* Keep table-layout:fixed from BB so TableColumn Width applies. */
/*
.table-fixed-body {
    overflow: auto;
}

    .table-fixed-body::-webkit-scrollbar {
        -webkit-appearance: none;
        width: 10px;
        height: 10px;
        background-color: transparent;
    }

    .table-fixed-body::-webkit-scrollbar-thumb {
        border-radius: 3px;
        background-color: var(--bs-scrollbar-bg);
    }

    .table-fixed-body:hover::-webkit-scrollbar, .table-fixed-body:hover::-webkit-scrollbar-thumb, .table-fixed-body:focus::-webkit-scrollbar, .table-fixed-body:focus::-webkit-scrollbar-thumb {
        visibility: visible;
    }

.firefox .table-fixed-body {
    overflow: auto !important;
    table-fixed-body-color: var(--bs-scrollbar-bg) transparent;
    table-fixed-body-width: thin;
}

.firefox .navbar-vibrant .table-fixed-body {
    overflow: auto !important;
    scrollbar-color: rgba(255, 255, 255, 0.4) transparent;
    scrollbar-width: thin;
}
*/
.table-excel .table-cell > .disabled {
    background-color: transparent !important;
}

.table-filter .table-filter-item {
    background-color: var(--bs-gray-200);
}

.table-filter .card-arrow:after {
    top: 1px;
    border-width: 0 .5rem .5rem .5rem;
}

.table-filter .card-footer .btn {
    border: inherit;
}

.table thead th.filterable .table-cell .fa-filter {
    right: -4px;
}

.table {
    margin-bottom: 0px;
}

    .table .form-label {
        margin-bottom: 0px !important;
    }
/*
.table-bordered {
    border-top: none !important;
}

    .table-bordered > :not(caption) > * > * {
        border-width: 0 1px !important;
    }*/
.flex-column .table-fixed {
    display: flex;
    flex-flow: column;
    flex: 1;
}

.table tfoot > tr > th:first-child, .table thead > tr > th:first-child, .table tr th:first-child, .table tr td:first-child {
    padding-left: 0.25rem;
}

.table-fixed .scroll {
    height: calc(100% - 46px) !important;
}

.table td {
    vertical-align: middle;
}

.table-excel.table > :not(caption):not(thead) > * > .table-column-button {
    padding: 0px 8px 0 16px;
}

.barcode-table .table td {
    height: 60px;
    vertical-align: middle;
    font-size: 1rem;
}

.table-toolbar-divider {
    margin: 4px 0px 4px 0px !important;
    background-color: var(--bs-gray-400);
}

.table > thead {
    color: var(--bs-gray-900) !important;
    height: 40px;
}

.table thead th {
    vertical-align: middle !important;
}

.table-cell:not(.is-wrap) {
    white-space: nowrap;
}

.table-cell .has-label .form-label {
    width: 80px !important;
    border-radius: 0px;
}

.table-cell .has-label .form-control, .table-cell .has-label .datetime-picker, .table-cell .has-label .select {
    width: calc(100% - 80px) !important;
    border-radius: 0px;
}

.table-cell .table-cell-dropdown .form-control, .table-cell .table-cell-dropdown .datetime-picker, .table-cell .table-cell-dropdown .form-select {
    width: calc(100% - var(--bb-row-label-width)) !important;
}

.table-cell .table-cell-dropdown .radio-list {
    width: 100% !important;
}

tr:not(.is-edit) .table-cell .dropdown .form-select-append {
    /*  color: var(--bs-input-color) !important;temp*/
}

.table-cell .btn-xs, .btn-group-xs > .btn {
    font-size: .8rem !important;
}

.is-edit .table-cell .form-control {
    height: var(--zii-table-edit-h, 2.375rem) !important;
}

.is-edit .table-cell .form-select {
    height: var(--zii-table-edit-h, 2.375rem) !important;
}

.is-edit .table-cell .switch {
    height: var(--zii-table-edit-h, 2.375rem) !important;
}

.table-cell .table-text.text-end {
    margin-right: 4px;
}

.table-cell.is-ellips {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    position: relative !important;
    left: 0px !important;
    right: 0px !important;
    padding-right: 8px;
}

.table-cell.is-ellips {
    overflow: inherit !important;
    text-overflow: inherit !important;
}

.table-cell.is-wrap {
    overflow: inherit !important;
    text-overflow: inherit !important;
    white-space: inherit !important;
}

.is-dblclick.is-edit .table-cell.is-ellips {
    padding-top: 4px;
    padding-bottom: 0px;
    margin-bottom: -4px;
}

.table-excel .table-cell .form-select {
    height: 36px !important;
}

.table-cell.text-end.is-ellips.is-resizable {
    padding-right: 8px;
}

.table-cell .dropdown-menu {
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    border: 1px solid var(--bs-border-color);
    background: var(--bs-body-bg);
    max-height: 400px;
}

.table-cell > .form-check {
    padding-left: 2.0em !important;
}

th .table-cell.is-ellips {
    display: flex !important;
}

    th .table-cell.is-ellips .table-text {
        overflow: hidden;
    }

.table-striped > tbody > tr:nth-of-type(odd) > * {
    color: inherit;
}

.table-striped > tbody > tr:nth-of-type(even) > * {
    color: inherit;
}

.table tbody tr.active:not(.is-edit), .table-row.active {
    background-color: var(--zii-gray) !important;
    color: var(--bs-table-striped-color) !important;
}

.table-excel tbody tr.active:not(.is-edit), .table-excel .table-row.active {
    background-color: inherit !important;
}

.table > tbody > tr:is(.instruction-row), .table > tbody > tr:is(.instruction-row) a, .table > tbody > tr:is(.instruction-row).active, .table > tbody > tr:is(.instruction-row):is(:hover) {
    font-size: 0.75rem !important;
    color: var(--bs-gray-700) !important;
}

.table .instruction-row .instruction-hidden {
    display: none !important;
}

.table thead th.sortable:hover, .table thead th.sortable:hover > .fa {
    color: #999;
}

.table thead.table-dark th.sortable:hover, .table-modal-footer {
    padding-top: 1rem;
    text-align: right;
}

    .table-modal-footer button {
        margin-left: 4px;
    }

.table-fixed-body .table-col-warning {
    font-weight: bold;
    color: var(--bs-warning) !important;
    padding-right: 8px;
}

.table-filter .card-header {
    background-color: var(--bs-gray-400) !important;
    color: var(--bs-gray-900) !important;
    border-bottom: 1px solid var(--bs-card-border-color);
}

.table-container .table > :not(caption) > * > * {
    padding: var(--bb-table-td-padding-y) var(--bb-table-td-padding-x) !important;
}
/*.table-container {
    display: flex;
    flex-direction: column
}*/
/* ----------------------- end table ----------------------- */
/* ===============================================
 * Tables - quick / advance search zones
 * =============================================== */
.search-zone.quick-search-zone > .row {
    width: 100% !important;
}

.search-zone.advance-search-zone .form-label {
    width: 180px;
    overflow: hidden;
    display: flex;
    flex-wrap: nowrap;
}

.search-zone.advance-search-zone .select-calctype + .form-control, .search-zone.advance-search-zone .select-calctype + .select {
    width: calc(100% - 120px) !important;
}

.table-quick-search > .flex-row {
    width: 100% !important;
    flex-wrap: wrap !important;
}

    .table-quick-search > .flex-row form {
        width: 100% !important;
    }

.table-quick-search .form-inline {
    width: 100%;
}

.table-quick-search > .d-flex {
    flex-wrap: wrap !important;
}
/* ===============================================
 * Tables - Search Zone
 * =============================================== */
.search-zone .row.item .form-group {
    display: flex;
}

.search-zone .filter-item .item-first {
    width: 30% !important;
}

.search-zone .filter-item:not(.item-third) .item-second {
    width: 70% !important;
}

.search-zone .filter-item:has(.item-third) .item-second {
    width: 35% !important;
}

.search-zone .filter-item .item-third {
    width: 35% !important;
}

.search-zone.advance-search-zone .row.item {
    width: 100%;
}

@media(max-width:992px) {
    .search-zone.advance-search-zone .row.item .form-group {
        display: block;
    }
}

.filter-item .select-calctype, .select-calctype, .filter-item .select-calctype .dropdown-toggle {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-right: none;
}
/*
.table-quick-search .form-inline .search-with-filter .dropdown-menu input {
    width: 100% !important;
}

.table-quick-search .form-inline .search-with-filter input {
    width: 120px !important;
}

    .table-quick-search .form-inline .search-with-filter input.select-calctype {
        width: 80px !important;
    }*/
/* ===============================================
 * Tables - column filter popover from custom.css
 * =============================================== */
.table-filter {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 5;
}

    .table-filter .table-filter-item {
        min-width: 220px;
        background-color: #fff;
        border: 1px solid rgba(0,0,0,.125);
        position: absolute;
        display: none;
    }

        .table-filter .table-filter-item.show {
            display: block;
        }

    .table-filter .card-header {
        padding: 0.5rem 1rem;
    }

    .table-filter .card-arrow {
        position: absolute;
        display: block;
        width: 1rem;
        height: .5rem;
        margin: 0;
        top: calc((.5rem + 1px) * -1);
        left: calc(50% - 0.5rem);
    }

        .table-filter .card-arrow:before, .table-filter .card-arrow:after {
            position: absolute;
            display: block;
            content: "";
            border-color: transparent;
            border-style: solid;
        }

        .table-filter .card-arrow:before {
            border-bottom-color: #ced4da;
            top: 0;
            border-width: 0 .5rem .5rem .5rem;
        }

        .table-filter .card-arrow:after {
            top: 1px;
            border-width: 0 .5rem .5rem .5rem;
            border-bottom-color: #f7f7f7;
        }

    .table-filter .card-body {
        padding: 1rem;
    }

        .table-filter .card-body .is-condition {
            max-width: 10rem;
        }

        .table-filter .card-body > *:not(:first-child) {
            margin-top: 0.5rem;
        }

        .table-filter .card-body .select {
            display: block;
        }

    .table-filter .card-footer {
        padding: 0.5rem;
        display: flex;
        white-space: nowrap;
    }

        .table-filter .card-footer .btn:not(:first-child) {
            margin-left: 0.5rem;
        }

        .table-filter .card-footer .btn {
            padding: 7px 15px;
            font-size: 0.875rem;
            line-height: 12px;
            border: 1px solid #dcdfe6;
            color: #606266;
            transition: border-color .3s linear, color .3s linear;
        }

            .table-filter .card-footer .btn:not(.disabled):not(:disabled):hover {
                border-color: var(--bs-primary);
                color: var(--bs-primary);
            }
/* ===============================================
 * Tables - cell helpers from custom.css
 * =============================================== */
.table-cell.is-ellips {
    display: table-cell;
    vertical-align: middle; /* 垂直居中 */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.table-toolbar-button {
    height: 39px;
}

.table-column-right {
    margin-left: 0px !important;
}

.table-toolbar:has(.row) {
    display: flex;
    width: 100%;
}

.table-toolbar > .row {
    flex: 1 1 auto;
    display: flex;
    justify-content: center;
    margin: 0;
}

.table-toolbar .table-toolbar-button .btn, .table-column-right .float-end .btn {
    margin-right: 12px;
    margin-left: 0px;
}

.table-toolbar .table-toolbar-button .input-group-compact .btn, .table-column-right .float-end .input-group-compact .btn {
    margin-right: 0px;
}

.table-toolbar-search.form-control {
    border-top-right-radius: 7px !important;
    border-bottom-right-radius: 7px !important;
}

.table .table-footer td {
    padding-top: 1rem !important;
    border-bottom: none !important;
}
/*.table .table-cell .form-control, .table-shim .table-cell .form-control {
    min-width: 100px;
}*/
/*.table-resize table {
    table-layout: fixed !important;
}*/
.table .table-footer .link-button {
    color: var(--bs-body-color) !important;
}

.table i {
    font-size: inherit;
}

.table .datetime-picker i, .table .datetime-picker .datetime-picker-bar {
    top: 16px;
    padding-left: 4px !important;
    padding-right: 0px !important;
}

.table tbody tr.active:not(.is-edit), .table-row.active {
    background-color: var(--bs-gray-300) !important;
    color: var(--bs-table-striped-color) !important;
}

.table tbody tr.active:not(.is-edit), .table-row.active {
    --bs-table-bg-type: var(--bb-table-row-active-bg);
}

.barcode-from .table .finished-row, .barcode-from .table .finished-row td {
    background-color: var(--bs-success) !important;
}

.active-row.finished-row.active {
    background-color: var(--bs-success) !important;
}

.barcode-from .table .active-row {
    /* background-color: var(--bs-warning) !important; */
    border-width: 4px !important;
    border-color: var(--bs-primary) !important;
    background-color: transparent !important;
}

.table-loader {
    position: relative;
    background-color: transparent;
}

    .table-loader .progress {
        width: 100%;
        border-radius: 0;
        /*height: 5px !important;*/
    }

        .table-loader .progress .progress-bar {
            border-radius: 0;
        }

.table-loading, .table-loader {
    border: none;
    padding: 0;
    border: none;
    margin: 0 calc(var(--bs-gutter-x,24px) * -.5);
}

.table thead th.sortable .table-text, .table thead th.filterable .table-text {
    padding-right: 1.5rem !important;
}