/* Override Filament's default max-width to use full available width */
.fi-main {
    max-width: 100% !important;
}

/* Improve horizontal scrollbar visibility */
.fi-ta-content {
    overflow-x: auto;
    /* Make scrollbar always visible and more prominent */
    scrollbar-width: thin;
    scrollbar-color: rgba(156, 163, 175, 0.7) rgba(156, 163, 175, 0.1);
}

/* For WebKit browsers (Chrome, Safari, Edge) */
.fi-ta-content::-webkit-scrollbar {
    height: 12px;
}

.fi-ta-content::-webkit-scrollbar-track {
    background: rgba(156, 163, 175, 0.1);
    border-radius: 6px;
}

.fi-ta-content::-webkit-scrollbar-thumb {
    background: rgba(156, 163, 175, 0.7);
    border-radius: 6px;
}

.fi-ta-content::-webkit-scrollbar-thumb:hover {
    background: rgba(107, 114, 128, 0.9);
}

/* Dark mode scrollbar */
:is(.dark .fi-ta-content)::-webkit-scrollbar-track {
    background: rgba(75, 85, 99, 0.2);
}

:is(.dark .fi-ta-content)::-webkit-scrollbar-thumb {
    background: rgba(156, 163, 175, 0.5);
}

:is(.dark .fi-ta-content)::-webkit-scrollbar-thumb:hover {
    background: rgba(156, 163, 175, 0.7);
}

.dark .tox .tox-dropzone {
	background-color: var(--gray-900);
	border-color: var(--gray-600);
}

.dark .tox .tox-dropzone p {
	color: var(--gray-200);
}
:is(.dark .fi-ta-content) {
    scrollbar-color: rgba(156, 163, 175, 0.5) rgba(75, 85, 99, 0.2);
}

/* Add some bottom padding to tables to prevent row hover from overlapping scrollbar */
.fi-ta-content > table {
    margin-bottom: 8px;
}