/* Browse Page Styles */

/* Filters Section */
#year-slider {
    margin-right:10px;
    margin-top: .5rem;
}

.filters-section {
    background-color: var(--cream);
    padding: 1.5rem 0;
    border-bottom: 1px solid rgba(139, 35, 50, 0.2);
}

[data-bs-theme="dark"] .filters-section {
    background-color: #1a1d1f;
}

.filters-section h5 {
    color: var(--burgundy);
    font-weight: 600;
    margin-bottom: 1rem;
}

/* noUISlider Customization */
.noUi-connect {
    background: var(--burgundy) !important;
}

.noUi-handle {
    border: 2px solid var(--burgundy) !important;
    background: white !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1) !important;
}

.noUi-handle:before,
.noUi-handle:after {
    background: var(--burgundy) !important;
}

.noUi-target {
    background: #ddd;
    border: none;
    box-shadow: none;
}

[data-bs-theme="dark"] .noUi-target {
    background: #404040;
}

/* DataTables Customization */
.table {
    font-size: 0.9rem;
}

.table thead th {
    background-color: var(--burgundy);
    color: white;
    font-weight: 600;
    border-bottom: none;
}

.table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: rgba(139, 35, 50, 0.03);
}

[data-bs-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: rgba(168, 53, 69, 0.1);
}

.table-hover tbody tr:hover {
    background-color: rgba(139, 35, 50, 0.08);
    cursor: pointer;
}

[data-bs-theme="dark"] .table-hover tbody tr:hover {
    background-color: rgba(168, 53, 69, 0.15);
}

/* DataTables Controls */
.dataTables_wrapper .dataTables_length select,
.dataTables_wrapper .dataTables_filter input {
    border: 1px solid var(--burgundy);
}

.dataTables_wrapper .dataTables_length select:focus,
.dataTables_wrapper .dataTables_filter input:focus {
    border-color: var(--burgundy);
    box-shadow: 0 0 0 0.25rem rgba(139, 35, 50, 0.25);
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background-color: var(--burgundy) !important;
    border-color: var(--burgundy) !important;
    color: white !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background-color: var(--dark-burgundy) !important;
    border-color: var(--dark-burgundy) !important;
    color: white !important;
}

/* Loading Indicator */
#loading-indicator {
    margin-top: 4rem;
}

.spinner-border {
    color: var(--burgundy) !important;
}

/* Buttons */
.dt-buttons .btn {
    background-color: var(--burgundy);
    border-color: var(--burgundy);
    color: white;
}

.dt-buttons .btn:hover {
    background-color: var(--dark-burgundy);
    border-color: var(--dark-burgundy);
}

/* Filter Inputs */
.form-select:focus,
.form-control:focus {
    border-color: var(--burgundy);
    box-shadow: 0 0 0 0.25rem rgba(139, 35, 50, 0.25);
}

/* Responsive Design */
@media (max-width: 768px) {
    .browse-header {
        padding: 1.5rem 0 1rem;
    }

    .browse-header h2 {
        font-size: 1.5rem;
    }

    .filters-section {
        padding: 1rem 0;
    }

    .table {
        font-size: 0.85rem;
    }
}

/* Dark Mode Table Adjustments */
[data-bs-theme="dark"] .table {
    color: var(--text-dark);
}

[data-bs-theme="dark"] .table thead th {
    background-color: var(--burgundy);
    border-color: #404040;
}

[data-bs-theme="dark"] .dataTables_wrapper .dataTables_length,
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_filter,
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_info,
[data-bs-theme="dark"] .dataTables_wrapper .dataTables_paginate {
    color: var(--text-dark);
}