:root {
        --c-banner-hero-height: 0px;
        --c-tab-pane-height: 0px;
    }
    /* GENERIC CSS: Works for all tables with DataTables */

    table {
        width: auto;
    }

    td, th {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* DataTables Integration - Common patterns from orders table */
    .dataTables_scrollHead {
        position: sticky !important;
        top: 0 !important; /* Override DataTables default */
        z-index: 3;
        background-color: white;
    }

    /* GENERIC FALLBACK: Works for any table with DataTables FixedColumns */
    /* Remove JavaScript debugging borders and backgrounds */
    table th:nth-child(1)[style*="background-color"],
    table td:nth-child(1)[style*="background-color"],
    table th:nth-child(2)[style*="background-color"],
    table td:nth-child(2)[style*="background-color"] {
        background-color: white !important;
        border: none !important;
    }

    /* Ensure header borders are consistent */
    table thead th,
    table thead td {
        background-color: white !important;
    }

    /* Style the table within the scroll head */
    .dataTables_wrapper .dataTables_scrollHead table {
        margin-bottom: 0 !important;
        background-color: white !important;
    }

    .dataTables_wrapper .dataTables_scrollHead table thead tr {
        background-color: white !important;
    }

    /* Override any manual positioning that conflicts with FixedColumns */
    .dataTables_wrapper .dataTables_scrollBody table th:nth-child(1):not(.dtfc-fixed-left):not([class*="c-table-col"]):not([class*="c-table-cell"]),
    .dataTables_wrapper .dataTables_scrollBody table td:nth-child(1):not(.dtfc-fixed-left):not([class*="c-table-col"]):not([class*="c-table-cell"]),
    .dataTables_wrapper .dataTables_scrollBody table th:nth-child(2):not(.dtfc-fixed-left):not([class*="c-table-col"]):not([class*="c-table-cell"]),
    .dataTables_wrapper .dataTables_scrollBody table td:nth-child(2):not(.dtfc-fixed-left):not([class*="c-table-col"]):not([class*="c-table-cell"]) {
        position: static !important;
        left: auto !important;
    }

    /* Ensure DataTables wrapper allows proper scrolling */
    .dataTables_wrapper {
        overflow: visible !important;
    }

    .dataTables_wrapper .dataTables_scroll {
        overflow: visible !important;
    }

    .dataTables_wrapper .dataTables_scrollBody {
        overflow-x: auto !important;
        overflow-y: auto !important;
    }

    /* GLOBAL FIX: Ensure ALL dropdown menus appear above DataTables elements */
    .dropdown-menu,
    .dropdown-menu.show,
    ul.dropdown-menu,
    ul.dropdown-menu.show {
        z-index: 25000 !important; /* Higher than Bootstrap modal backdrop */
    }

    /* Specific fix for view dropdown menus that appear outside table containers */
    .dropdown-menu[data-popper-placement],
    .dropdown-menu[style*="transform"] {
        z-index: 1070 !important; /* Even higher for positioned dropdowns */
    }

    /* Prevent clipping around table/nav dropdowns */
    .c-table-nav .dropdown-toggle,
    .c-table-nav-alt .dropdown-toggle,
    .c-drawer-nav .dropdown-toggle {
        position: relative;
        z-index: 30;
    }
    .c-table-nav .dropdown-menu,
    .c-table-nav-alt .dropdown-menu,
    .c-drawer-nav .dropdown-menu {
        z-index: 25000 !important;
    }
    .c-view-dropdown {
        position: absolute !important;
        z-index: 6000 !important;
        overflow: visible !important;
        margin-top: -32px !important; /* lift above thead so it overlays header */
    }

    /* Prevent main content container from clipping nav dropdowns */
    #kt_content_container {
        overflow: visible !important;
    }
    .table-responsive {
        overflow-y: auto !important;
        overflow-x: auto !important;
    }

    /* Ensure view container allows dropdown overflow */
    #view-container {
        overflow: visible !important;
    }

    /* Ensure table navigation area allows dropdown overflow */
    .nav.nav-tabs.nav-line-tabs,
    .tw-flex.align-items-end.justify-content-between,
    .d-flex.align-items-end.justify-content-between {
        overflow: visible !important;
    }
    /* Table nav wrappers: keep dropdowns on top */
    .c-table-nav,
    .c-table-nav-alt {
        overflow: visible !important;
        position: relative;
        z-index: 20000 !important;
    }
    .c-drawer-nav {
        overflow: visible !important;
        position: relative;
        z-index: 10 !important;
    }
    .c-table-nav .dropdown-menu,
    .c-table-nav-alt .dropdown-menu,
    .c-drawer-nav .dropdown-menu {
        z-index: 2100 !important;
    }

    /* Ensure dropdown container allows overflow */
    .nav-item {
        overflow: visible !important;
    }

    /* Tabs container should not clip dropdowns */
    .c-banner-hero {
        position: sticky;
        top: 0;
        z-index: 50;
        background-color: #FAFAFA !important;
    }

    .c-tab-pane {
        overflow: visible !important;
        position: sticky !important;
        top: var(--c-banner-hero-height, 0px);
        z-index: 45 !important; /* keep toolbar/header pinned above table body */
        background-color: #ffffff;
    }

    /* INVENTORY SPECIFIC: Hide all sorting indicators - DataTable and Handsontable */
    table.dataTable thead .sorting,
    table.dataTable thead .sorting_asc,
    table.dataTable thead .sorting_desc,
    table.dataTable thead .sorting_asc_disabled,
    table.dataTable thead .sorting_desc_disabled {
        background-image: none !important;
        background: none !important;
        padding-right: 0 !important;
    }

    /* Remove sorting cursor */
    table.dataTable thead th {
        cursor: default !important;
    }

    /* Remove sorting attributes and classes */
    .inventory-table th {
        background-image: none !important;
        cursor: default !important;
        padding-right: 0 !important;
    }

    /* Override any Handsontable sorting indicators */
    .handsontable .columnSorting,
    .handsontable span.colHeader.columnSorting::before,
    .handsontable span.colHeader.columnSorting::after {
        background-image: none !important;
        content: none !important;
        display: none !important;
    }

    /* Remove sorting hover effects */
    .handsontable .columnSorting.sortAction:hover {
        text-decoration: none !important;
        cursor: default !important;
    }

    /* Additional rules to prevent sorting indicators */
    .dataTable thead th.sorting::after,
    .dataTable thead th.sorting_asc::after,
    .dataTable thead th.sorting_desc::after {
        display: none !important;
    }

    .dataTable thead th.sorting::before,
    .dataTable thead th.sorting_asc::before,
    .dataTable thead th.sorting_desc::before {
        display: none !important;
    }

    .fa-arrow-down {
        transform: rotate(-90deg);
        transition: transform 0.3s ease;
    }

    .fa-arrow-down.open {
        transform: rotate(0deg);
    }

    /* Generic sticky thead behavior for non-DataTables tables */
    thead.position-sticky {
        position: sticky;
        top: 0;
        z-index: 3; /* Keep below view nav, above body sticky cells */
        background: #ffffff;
        border-bottom: 1px solid #EAEAEA; /* Persist bottom divider while sticky */
        box-shadow: 0 1px 0 0 #EAEAEA;  /* Visual continuity with rows */
    }

    /* Items table: ensure left sticky columns keep a visible right divider when scrolling */
    .items-table th.c-table-col-checkbox,
    .items-table td.c-table-col-checkbox {
        border-right: 0px solid #fff !important;
        box-shadow: 6px 0 6px -6px rgba(15,23,42,0.10);
        background-color: #ffffff !important;
        position: sticky; /* ensure stacking context for ::after */
        z-index: 2 !important;
    }

    .items-table th.c-table-col-checkbox::after,
    .items-table td.c-table-col-checkbox::after {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        width: 1px;
        height: 100%;
        background-color: #fff;
        pointer-events: none;
    }

    .items-table th.c-table-col-id,
    .items-table td.c-table-cell-id {
        border-right: 1px solid #E4E6EF !important;
        box-shadow: 6px 0 6px -6px rgba(15,23,42,0.20);
        background-color: #ffffff !important;
        position: sticky; /* ensure stacking context for ::after */
        z-index: 2 !important; /* keep under header row */
    }

    /* Keep sticky header above body sticky cells but below view nav */
    thead.position-sticky th.c-table-col-checkbox,
    thead.position-sticky th.c-table-col-checkbox-sm,
    thead.position-sticky th.c-table-col-id,
    thead.position-sticky th.c-table-cell-id,
    thead.position-sticky th.c-table-cell-lock {
        z-index: 3 !important;
    }

    tbody td.c-table-col-checkbox,
    tbody td.c-table-col-checkbox-sm,
    tbody td.c-table-col-id,
    tbody td.c-table-cell-id,
    tbody td.c-table-cell-lock {
        z-index: 2 !important;
    }

    .items-table th.c-table-col-id::after,
    .items-table td.c-table-cell-id::after {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        width: 1px;
        height: 100%;
        background-color: #EAEAEA;
        pointer-events: none;
    }

    /* ITEMS: When DataTables FixedColumns is active, disable our manual sticky columns
       so we don't double-fix the first columns (checkbox + ID). */
    .dataTables_wrapper.has-dtfc .items-table th.c-table-col-checkbox,
    .dataTables_wrapper.has-dtfc .items-table td.c-table-col-checkbox,
    .dataTables_wrapper.has-dtfc .items-table td.c-table-col-checkbox-sm,
    .dataTables_wrapper.has-dtfc .items-table th.c-table-col-id,
    .dataTables_wrapper.has-dtfc .items-table td.c-table-col-id,
    .dataTables_wrapper.has-dtfc .items-table td.c-table-cell-id {
        position: static !important;
        left: auto !important;
        z-index: auto !important;
    }

    /* Ensure the FixedColumns clone looks correct and stays on top of scroll body */
    .dataTables_wrapper.has-dtfc .dtfc-fixed-left {
        z-index: 9;
    }

    .dataTables_wrapper.has-dtfc .dtfc-fixed-left th,
    .dataTables_wrapper.has-dtfc .dtfc-fixed-left td {
        background-color: #ffffff !important;
    }

    /* Optional visual aid when debugging */
    body[data-items-debug="1"] .items-table th.c-table-col-checkbox,
    body[data-items-debug="1"] .items-table td.c-table-col-checkbox,
    body[data-items-debug="1"] .items-table th.c-table-col-id,
    body[data-items-debug="1"] .items-table td.c-table-col-id,
    body[data-items-debug="1"] .items-table td.c-table-cell-id {
        outline: 1px dashed #9c27b0;
        outline-offset: -1px;
    }

    .table-responsive.c-has-custom-scrollbar {
        position: relative;
        scrollbar-width: none;
    }

    .table-responsive.c-has-custom-scrollbar::-webkit-scrollbar:horizontal {
        height: 0;
    }

    .c-table-scrollbar {
        position: relative;
        width: 100%;
        height: 10px;
        background: transparent;
        border-radius: 999px;
        overflow: hidden;
        transition: opacity 0.2s ease;
    }

    .c-table-scrollbar.is-hidden {
        opacity: 0;
        height: 0;
        margin-top: 0;
        pointer-events: none;
    }

    .c-table-scrollbar.is-active .c-table-scrollbar-thumb {
        box-shadow: 0 0 0 2px rgba(64, 116, 255, 0.15);
    }

    .c-table-scrollbar-thumb {
        height: 100%;
        min-width: 48px;
        background: #f6f1e9;
        border-radius: inherit;
        cursor: grab;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.4);
        transition: background 0.2s ease;
        touch-action: none;
        user-select: none;
    }

    .c-table-scrollbar-thumb:active {
        cursor: grabbing;
        background: #b6b1ab;
    }



/* Keep view dropdowns above sticky table headers, and headers above sticky body cells. */
.table-responsive thead.position-sticky {
    z-index: 3 !important;
}

.table-responsive thead.position-sticky th.c-table-col-checkbox,
.table-responsive thead.position-sticky th.c-table-col-checkbox-sm,
.table-responsive thead.position-sticky th.c-table-col-id,
.table-responsive thead.position-sticky th.c-table-cell-id,
.table-responsive thead.position-sticky th.c-table-cell-lock {
    z-index: 3 !important;
}

.table-responsive tbody td.c-table-col-checkbox,
.table-responsive tbody td.c-table-col-checkbox-sm,
.table-responsive tbody td.c-table-col-id,
.table-responsive tbody td.c-table-cell-id,
.table-responsive tbody td.c-table-cell-lock {
    z-index: 2 !important;
}