/* Appeals Table Styling Fixes */

/* Increase font size for better visibility */
.appeals-table,
#appealsTable {
    font-size: 1.1rem;
}

/* Fix alternating row colors for better readability in dark theme */
[data-theme="dark"] .appeals-table tbody tr:nth-of-type(odd),
[data-theme="dark"] #appealsTable tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, 0.1) !important;
    color: #f8f9fa !important;
}

[data-theme="dark"] .appeals-table tbody tr:nth-of-type(even),
[data-theme="dark"] #appealsTable tbody tr:nth-of-type(even) {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: #f8f9fa !important;
}

/* Ensure all table text is visible in dark theme */
[data-theme="dark"] .appeals-table td,
[data-theme="dark"] .appeals-table th,
[data-theme="dark"] #appealsTable td,
[data-theme="dark"] #appealsTable th {
    color: #f8f9fa !important;
}

/* Make the Total Appeals count larger and more prominent */
.total-appeals-count,
.card-header .badge {
    font-size: 1.4rem !important;
    font-weight: bold !important;
    color: white !important;
    background: none !important;
    padding: 0 !important;
}

/* Remove button styling from view links */
.view-link,
#appealsTable .btn-outline-info,
#appealsTable .btn-sm {
    color: var(--primary-color) !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    font-size: 1.1rem !important;
    padding: 0.5rem 1rem !important;
    display: inline-block !important;
    transition: all 0.2s ease !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
}

.view-link:hover {
    color: var(--accent-color);
    transform: translateY(-2px);
}

[data-theme="dark"] .view-link,
[data-theme="dark"] #appealsTable .btn-outline-info,
[data-theme="dark"] #appealsTable .btn-sm {
    color: var(--primary-color) !important;
}

/* Fix pagination in dark theme */
[data-theme="dark"] .pagination .page-link {
    background-color: var(--card-bg) !important;
    border-color: var(--border-color) !important;
    color: var(--text-color) !important;
}

[data-theme="dark"] .pagination .page-item.active .page-link {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: white !important;
}

[data-theme="dark"] .pagination .page-item.disabled .page-link {
    background-color: rgba(255, 255, 255, 0.05) !important;
    border-color: var(--border-color) !important;
    color: rgba(255, 255, 255, 0.5) !important;
}

/* Fix badge styling */
[data-theme="dark"] .badge.bg-info {
    background-color: #4facfe !important;
    color: white !important;
}

[data-theme="dark"] .badge.bg-secondary {
    background-color: #6c757d !important;
    color: white !important;
}

/* Fix DataTables search and info text */
[data-theme="dark"] .dataTables_wrapper .dataTables_filter label,
[data-theme="dark"] .dataTables_wrapper .dataTables_info {
    color: var(--text-color) !important;
}

[data-theme="dark"] .dataTables_wrapper .dataTables_filter input {
    background-color: var(--input-bg) !important;
    color: var(--text-color) !important;
    border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .view-link:hover,
[data-theme="dark"] #appealsTable .btn-outline-info:hover,
[data-theme="dark"] #appealsTable .btn-sm:hover {
    color: var(--accent-color);
}

/* Fix for badge styling */
.appeals-table .badge {
    font-size: 1.1rem;
    padding: 0.5rem 0.75rem;
}

/* Fix for DataTables styling */
.dataTables_wrapper .dataTables_length, 
.dataTables_wrapper .dataTables_filter, 
.dataTables_wrapper .dataTables_info, 
.dataTables_wrapper .dataTables_processing, 
.dataTables_wrapper .dataTables_paginate {
    font-size: 1.1rem;
    margin-bottom: 1rem;
}

/* Fix for DataTables in dark mode */
[data-theme="dark"] .dataTables_wrapper .dataTables_length, 
[data-theme="dark"] .dataTables_wrapper .dataTables_filter, 
[data-theme="dark"] .dataTables_wrapper .dataTables_info, 
[data-theme="dark"] .dataTables_wrapper .dataTables_processing, 
[data-theme="dark"] .dataTables_wrapper .dataTables_paginate {
    color: #f8f9fa !important;
}

[data-theme="dark"] .dataTables_wrapper .dataTables_filter input,
[data-theme="dark"] .dataTables_wrapper .dataTables_length select {
    background-color: #253047 !important;
    color: #f8f9fa !important;
    border: 1px solid #303d5d !important;
}