/* ===================================================================
 * styles-dark-mode-stats.css
 * Purpose: Dark-mode dashboard statistics card visibility + projects card overrides
 * Extracted from styles.css during the Apr 2026 split (task #23).
 * =================================================================== */
/* DARK MODE TEXT VISIBILITY FIX FOR DASHBOARD STATISTICS CARDS */
/* Ensure all text in overview cards is visible on white/light backgrounds in dark mode */
[data-theme="dark"] .overview-card,
[data-theme="dark"] .overview-card .card-body,
[data-theme="dark"] .sortable-stat-container .card,
[data-theme="dark"] .sortable-stat-container .card-body {
    background-color: #ffffff !important;
    color: #000000 !important;
}

[data-theme="dark"] .overview-card h5,
[data-theme="dark"] .overview-card h6,
[data-theme="dark"] .overview-card .card-title,
[data-theme="dark"] .overview-card .mb-0,
[data-theme="dark"] .sortable-stat-container h5,
[data-theme="dark"] .sortable-stat-container h6,
[data-theme="dark"] .sortable-stat-container .card-title,
[data-theme="dark"] .sortable-stat-container .mb-0 {
    color: #000000 !important;
}

/* Ensure all text elements inside statistics cards are dark/black in dark mode */
[data-theme="dark"] .overview-card *:not(i):not(.stat-icon):not(.text-primary):not(.text-danger):not(.text-warning):not(.text-info):not(.text-success),
[data-theme="dark"] .sortable-stat-container *:not(i):not(.stat-icon):not(.text-primary):not(.text-danger):not(.text-warning):not(.text-info):not(.text-success) {
    color: #000000 !important;
}

/* Light mode - ensure cards have proper styling */
[data-theme="light"] .overview-card,
[data-theme="light"] .overview-card .card-body,
[data-theme="light"] .sortable-stat-container .card,
[data-theme="light"] .sortable-stat-container .card-body {
    background-color: #ffffff !important;
    color: #000000 !important;
}

[data-theme="light"] .overview-card h5,
[data-theme="light"] .overview-card h6,
[data-theme="light"] .overview-card .card-title,
[data-theme="light"] .overview-card .mb-0,
[data-theme="light"] .sortable-stat-container h5,
[data-theme="light"] .sortable-stat-container h6,
[data-theme="light"] .sortable-stat-container .card-title,
[data-theme="light"] .sortable-stat-container .mb-0 {
    color: #000000 !important;
}

/* DARK MODE FIX: Projects page "My Projects" section text visibility */
/* Strategy: Set default black text for card-body, let components use their own colors */

/* Set white background and default black text for the card */
[data-theme="dark"] .projects-table-card {
    background-color: #ffffff !important;
}

[data-theme="dark"] .projects-table-card .card-body {
    background-color: #ffffff !important;
    color: #000000 !important;
}

/* Fix all text elements in the projects card header section */
[data-theme="dark"] .projects-table-card h2,
[data-theme="dark"] .projects-table-card h1,
[data-theme="dark"] .projects-table-card h3,
[data-theme="dark"] .projects-table-card h4,
[data-theme="dark"] .projects-table-card h5,
[data-theme="dark"] .projects-table-card h6,
[data-theme="dark"] .projects-table-card .d-flex,
[data-theme="dark"] .projects-table-card small {
    color: #000000 !important;
}

/* Fix text-muted elements in the projects card to use dark gray in dark mode */
[data-theme="dark"] .projects-table-card .text-muted {
    color: #6c757d !important;
}

/* Project numbers/links should be orange in dark mode - override the black text rule */
[data-theme="dark"] .projects-table-card .constructions-pilot-theme,
[data-theme="dark"] .projects-table-card a.constructions-pilot-theme,
[data-theme="dark"] .projects-table-card .table tbody td a.constructions-pilot-theme,
[data-theme="dark"] .projects-table-card .table tbody tr td a.constructions-pilot-theme,
[data-theme="dark"] .projects-table-card tbody td a.constructions-pilot-theme,
[data-theme="dark"] .projects-table-card tbody tr td a.constructions-pilot-theme {
    color: var(--color-accent-600) !important;
}

/* Additional specificity for project number links */
[data-theme="dark"] .table tbody td:first-child a,
[data-theme="dark"] .projects-table-card .table tbody td:first-child a {
    color: var(--color-accent-600) !important;
}

/* Fix Info column text to be black in dark mode - Enhanced targeting */
[data-theme="dark"] .projects-table-card .table tbody td:nth-child(5),
[data-theme="dark"] .projects-table-card .table tbody td:nth-child(5) *,
[data-theme="dark"] .projects-table-card .table tbody tr td:nth-child(5),
[data-theme="dark"] .projects-table-card .table tbody tr td:nth-child(5) *,
[data-theme="dark"] .projects-table-card .table tbody td:nth-child(5) .dropdown-toggle,
[data-theme="dark"] .projects-table-card .table tbody td:nth-child(5) .btn,
[data-theme="dark"] .projects-table-card .table tbody td:nth-child(5) button,
[data-theme="dark"] .projects-table-card .table tbody td:nth-child(5) a {
    color: #000000 !important;
    background-color: transparent !important;
}

/* Restore dark theme for the table section only - be specific to avoid affecting components */
[data-theme="dark"] .projects-table-card .table-responsive {
    background-color: var(--dark-bg) !important;
}

[data-theme="dark"] .projects-table-card .table {
    background-color: var(--dark-bg) !important;
    color: var(--text-light) !important;
}

/* Only target actual table structure elements, not all descendants */
/* Removed duplicate rules - consolidated below after global .table styles for proper precedence */

/* Light mode - ensure consistency */
[data-theme="light"] .projects-table-card {
    background-color: #ffffff !important;
}

[data-theme="light"] .projects-table-card .card-body {
    background-color: #ffffff !important;
    color: #000000;
}

/* ULTIMATE INFO COLUMN TEXT FIX - Maximum specificity */
.projects-table-card .table tbody td:nth-child(5),
.projects-table-card .table tbody td:nth-child(5) *,
.projects-table-card .table tbody td:nth-child(5) .dropdown-toggle,
.projects-table-card .table tbody td:nth-child(5) .btn,
.projects-table-card .table tbody td:nth-child(5) button,
.projects-table-card .table tbody td:nth-child(5) a,
.projects-table-card .table tbody td:nth-child(5) .dropdown-item,
html .projects-table-card .table tbody td:nth-child(5),
html .projects-table-card .table tbody td:nth-child(5) *,
body .projects-table-card .table tbody td:nth-child(5),
body .projects-table-card .table tbody td:nth-child(5) * {
    color: #000000 !important;
    background-color: transparent !important;
}

/* Force text color for all themes in Info column */
[data-theme="dark"] .projects-table-card .table tbody td:nth-child(5),
[data-theme="dark"] .projects-table-card .table tbody td:nth-child(5) *,
[data-theme="light"] .projects-table-card .table tbody td:nth-child(5),
[data-theme="light"] .projects-table-card .table tbody td:nth-child(5) *,
html[data-theme="dark"] .projects-table-card .table tbody td:nth-child(5),
html[data-theme="dark"] .projects-table-card .table tbody td:nth-child(5) *,
html[data-theme="light"] .projects-table-card .table tbody td:nth-child(5),
html[data-theme="light"] .projects-table-card .table tbody td:nth-child(5) * {
    color: #000000 !important;
}

/* Ensure Info column text is black in light mode too - Enhanced targeting */
[data-theme="light"] .projects-table-card .table tbody td:nth-child(5),
[data-theme="light"] .projects-table-card .table tbody td:nth-child(5) *,
[data-theme="light"] .projects-table-card .table tbody tr td:nth-child(5),
[data-theme="light"] .projects-table-card .table tbody tr td:nth-child(5) *,
[data-theme="light"] .projects-table-card .table tbody td:nth-child(5) .dropdown-toggle,
[data-theme="light"] .projects-table-card .table tbody td:nth-child(5) .btn,
[data-theme="light"] .projects-table-card .table tbody td:nth-child(5) button,
[data-theme="light"] .projects-table-card .table tbody td:nth-child(5) a {
    color: #000000 !important;
    background-color: transparent !important;
}

