/* Force sticky columns in Filament tables */

/* Column toggle dropdown - make it overlay everything */
.fi-ta-header-ctn [x-data] > div > div[role="menu"],
.fi-dropdown-panel,
[x-show][style*="display: block"] {
    position: fixed !important;
    z-index: 9999 !important;
}

/* Ensure the dropdown trigger button has proper z-index */
.fi-ta-header-ctn button[aria-expanded] {
    position: relative;
    z-index: 40;
}

/* Make sure Filament's column toggle dropdown is properly positioned */
.fi-ta .fi-dropdown {
    position: relative;
}

.fi-ta .fi-dropdown .fi-dropdown-panel {
    position: fixed !important;
    z-index: 9999 !important;
}

/* Name column - first column (sticky left) */
.fi-ta table thead tr th:first-child {
    position: sticky !important;
    left: 0 !important;
    z-index: 30 !important;
    background-color: rgb(249, 250, 251) !important;
    border-right: 1px solid rgb(229, 231, 235);
}

.fi-ta table tbody tr td:first-child {
    position: sticky !important;
    left: 0 !important;
    z-index: 30 !important;
    background-color: white !important;
    border-right: 1px solid rgb(229, 231, 235);
}

.dark .fi-ta table thead tr th:first-child {
    background-color: rgb(17, 24, 39) !important;
    border-right: 1px solid rgb(55, 65, 81);
}

.dark .fi-ta table tbody tr td:first-child {
    background-color: rgb(31, 41, 55) !important;
    border-right: 1px solid rgb(55, 65, 81);
}

/* Also target the specific class */
th.sticky-column-left {
    position: sticky !important;
    left: 0 !important;
    z-index: 30 !important;
    background-color: rgb(249, 250, 251) !important;
    border-right: 1px solid rgb(229, 231, 235);
}

td.sticky-column-left {
    position: sticky !important;
    left: 0 !important;
    z-index: 30 !important;
    background-color: white !important;
    border-right: 1px solid rgb(229, 231, 235);
}

.dark th.sticky-column-left {
    background-color: rgb(17, 24, 39) !important;
    border-right: 1px solid rgb(55, 65, 81);
}

.dark td.sticky-column-left {
    background-color: rgb(31, 41, 55) !important;
    border-right: 1px solid rgb(55, 65, 81);
}

/* Actions column (sticky right) - last column */
.fi-ta table thead tr th:last-child {
    position: sticky !important;
    right: 0 !important;
    z-index: 30 !important;
    background-color: rgb(249, 250, 251) !important;
    border-left: 1px solid rgb(229, 231, 235);
}

.fi-ta table tbody tr td:last-child {
    position: sticky !important;
    right: 0 !important;
    z-index: 30 !important;
    background-color: white !important;
    border-left: 1px solid rgb(229, 231, 235);
}

.dark .fi-ta table thead tr th:last-child {
    background-color: rgb(17, 24, 39) !important;
    border-left: 1px solid rgb(55, 65, 81);
}

.dark .fi-ta table tbody tr td:last-child {
    background-color: rgb(31, 41, 55) !important;
    border-left: 1px solid rgb(55, 65, 81);
}

/* Make sure the table wrapper allows horizontal scroll */
.fi-ta-ctn,
.fi-ta-table-ctn {
    overflow-x: auto !important;
}

