/* Custom CSS for vertical tabs in ContentResource */
/* Target all possible tab containers */
.filament-tables-tabs,
[class*="tabs"],
[class*="tab-list"],
.filament-tables-tabs-list,
.filament-tables-tabs-container {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.5rem !important;
    width: 100% !important;
}

/* Target tab items */
.filament-tables-tabs-item,
[class*="tab-item"],
.filament-tables-tabs-list > *,
.filament-tables-tabs-list li {
    width: 100% !important;
    margin-right: 0 !important;
    margin-bottom: 0.5rem !important;
    display: block !important;
    flex: 1 1 100% !important;
    min-width: 100% !important;
}

/* Target tab buttons */
.filament-tables-tabs-item button,
[class*="tab-item"] button,
.filament-tables-tabs-list button {
    width: 100% !important;
    text-align: left !important;
    justify-content: flex-start !important;
    display: block !important;
}

/* Force vertical layout for any tab-like elements */
[role="tablist"],
[data-tabs],
.tabs,
.tab-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.5rem !important;
}

[role="tablist"] > *,
[data-tabs] > *,
.tabs > *,
.tab-list > * {
    width: 100% !important;
    margin-right: 0 !important;
    margin-bottom: 0.5rem !important;
}