/* ===========================================
   GRIT - Dark Mode Styles
   Premium Dark Theme for Training Platform
   =========================================== */

/* Dark Mode CSS Variables */
:root[data-theme="dark"],
body.theme-dark {
    /* Background Colors - Rich Dark */
    --bg-primary: #0F0F12;
    --bg-secondary: #16161A;
    --bg-tertiary: #1C1C22;
    --bg-elevated: #222228;
    --bg-dark-950: #0A0A0D;
    --bg-dark-900: #0F0F12;
    --bg-dark-850: #16161A;
    --bg-dark-800: #1C1C22;
    --bg-dark-700: #28282F;
    --bg-dark-600: #35353D;
    
    /* Card & Surface */
    --card-background: #16161A;
    --card-elevated: #1C1C22;
    --background-color: #0F0F12;
    
    /* Borders */
    --border-color: rgba(255, 255, 255, 0.08);
    --border-accent: rgba(230, 57, 70, 0.3);
    --border-subtle: rgba(255, 255, 255, 0.04);
    
    /* Text - Light on Dark */
    --text-primary: #F5F5F7;
    --text-secondary: #A1A1AA;
    --text-tertiary: #71717A;
    --text-muted: #52525B;
    --muted-light: #E4E4E7;
    --text-dark: #F5F5F7;
    --text-dark-secondary: #A1A1AA;
    --text-dark-muted: #71717A;
    
    /* Brand Colors - Vibrant */
    --grit-primary: #E63946;
    --grit-primary-dark: #D1293A;
    --grit-primary-light: #FF5A67;
    --grit-accent: #2DD4BF;
    --grit-accent-dark: #14B8A6;
    
    /* Semantic Colors */
    --success: #22C55E;
    --warning: #F59E0B;
    --danger: #EF4444;
    --info: #3B82F6;
    
    /* Legacy Aliases */
    --grit-red: #E63946;
    --grit-blue: #3B82F6;
    --grit-green: #22C55E;
    --grit-gold: #F59E0B;
    --grit-orange: #F97316;
    --accent-blue: #3B82F6;
    --accent-cyan: #06B6D4;
    --accent-green: #22C55E;
    --accent-emerald: #10B981;
    --accent-purple: #8B5CF6;
    --accent-orange: #F97316;
    
    /* Training Zones - Neon */
    --zone-recovery: #22C55E;
    --zone-endurance: #3B82F6;
    --zone-tempo: #F59E0B;
    --zone-threshold: #F97316;
    --zone-vo2max: #EF4444;
    --zone-anaerobic: #DC2626;
    
    /* Shadows - Deep */
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.3), 0 1px 2px rgba(0, 0, 0, 0.2);
    --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.4), 0 2px 4px rgba(0, 0, 0, 0.3);
    --shadow-lg: 0 10px 20px rgba(0, 0, 0, 0.4), 0 4px 8px rgba(0, 0, 0, 0.3);
    --shadow-xl: 0 20px 40px rgba(0, 0, 0, 0.5), 0 8px 16px rgba(0, 0, 0, 0.4);
    --shadow-2xl: 0 30px 60px rgba(0, 0, 0, 0.6);
    --shadow-inset: inset 0 2px 4px rgba(0, 0, 0, 0.3);
    --shadow-glow-primary: 0 0 20px rgba(230, 57, 70, 0.3);
    --shadow-glow-accent: 0 0 20px rgba(45, 212, 191, 0.3);
    
    /* Gradients */
    --gradient-primary: linear-gradient(135deg, #E63946 0%, #FF6B6B 100%);
    --gradient-dark: linear-gradient(180deg, #0F0F12 0%, #16161A 100%);
    --gradient-card: linear-gradient(145deg, #1C1C22 0%, #16161A 100%);
    --gradient-glow: radial-gradient(ellipse at top, rgba(230, 57, 70, 0.15) 0%, transparent 50%);
}

/* Dark Mode Body */
body.theme-dark {
    background: var(--bg-primary);
    color: var(--text-primary);
}

body.theme-dark::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 400px;
    background: var(--gradient-glow);
    pointer-events: none;
    z-index: -1;
}

/* Dark Mode Header */
body.theme-dark header {
    background: rgba(15, 15, 18, 0.95);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--border-color);
}

body.theme-dark nav a {
    color: var(--text-secondary);
}

body.theme-dark nav a:hover {
    color: var(--text-primary);
    background: rgba(255, 255, 255, 0.05);
}

body.theme-dark nav a.active {
    color: var(--grit-primary);
    background: rgba(230, 57, 70, 0.1);
}

/* Dark Mode Cards */
body.theme-dark .card {
    background: var(--card-background);
    border: 1px solid var(--border-color);
    box-shadow: var(--shadow-sm);
}

body.theme-dark .card:hover {
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: var(--shadow-md);
}

body.theme-dark .card-header {
    border-bottom-color: var(--border-color);
}

/* Dark Mode Forms */
body.theme-dark input,
body.theme-dark select,
body.theme-dark textarea {
    background: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

body.theme-dark input:focus,
body.theme-dark select:focus,
body.theme-dark textarea:focus {
    border-color: var(--grit-primary);
    box-shadow: 0 0 0 3px rgba(230, 57, 70, 0.15);
}

body.theme-dark input::placeholder {
    color: var(--text-muted);
}

body.theme-dark select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23A1A1AA' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
}

body.theme-dark select option {
    background: var(--bg-tertiary);
    color: var(--text-primary);
}

/* Dark Mode Buttons */
body.theme-dark .btn-secondary {
    background: var(--bg-tertiary);
    color: var(--text-secondary);
    border: 1px solid var(--border-color);
}

body.theme-dark .btn-secondary:hover {
    background: var(--bg-elevated);
    color: var(--text-primary);
    border-color: rgba(255, 255, 255, 0.15);
}

body.theme-dark .btn-outline {
    color: var(--grit-primary);
    border-color: var(--grit-primary);
    background: transparent;
}

body.theme-dark .btn-outline:hover {
    background: rgba(230, 57, 70, 0.1);
}

/* Dark Mode Tables */
body.theme-dark table {
    background: var(--bg-secondary);
    border-color: var(--border-color);
}

body.theme-dark table th {
    background: var(--bg-tertiary);
    color: var(--text-secondary);
}

body.theme-dark table td {
    color: var(--text-secondary);
    border-top-color: var(--border-color);
}

body.theme-dark table tr:hover {
    background: var(--bg-tertiary);
}

/* Dark Mode Scrollbar */
body.theme-dark ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

body.theme-dark ::-webkit-scrollbar-track {
    background: var(--bg-primary);
}

body.theme-dark ::-webkit-scrollbar-thumb {
    background: var(--bg-dark-600);
    border-radius: 4px;
}

body.theme-dark ::-webkit-scrollbar-thumb:hover {
    background: var(--bg-dark-700);
}

/* Dark Mode Modals */
body.theme-dark .modal-content {
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
    box-shadow: var(--shadow-xl);
}

/* Dark Mode Dropdowns */
body.theme-dark .dropdown-menu {
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
    box-shadow: var(--shadow-lg);
}

body.theme-dark .dropdown-menu a {
    color: var(--text-secondary);
}

body.theme-dark .dropdown-menu a:hover {
    background: var(--bg-tertiary);
    color: var(--text-primary);
}

/* Dark Mode Stats Cards */
body.theme-dark .stat-card {
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

body.theme-dark .metric-label {
    color: var(--text-tertiary);
}

body.theme-dark .metric-value {
    color: var(--text-primary);
}

/* Dark Mode Tooltips */
body.theme-dark .tooltip-icon:hover::after {
    background: var(--bg-elevated);
    color: var(--text-primary);
    border: 1px solid var(--border-color);
}

/* Dark Mode Charts */
body.theme-dark .chart-card {
    background: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

/* Dark Mode Progress Bars */
body.theme-dark progress {
    background: var(--bg-tertiary);
}

body.theme-dark progress::-webkit-progress-bar {
    background: var(--bg-tertiary);
}

/* Dark Mode Badges */
body.theme-dark .badge {
    background: var(--bg-tertiary);
    color: var(--text-secondary);
}

/* Dark Mode Calendar */
body.theme-dark .calendar-day {
    background: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

body.theme-dark .calendar-day:hover {
    background: var(--bg-elevated);
    border-color: rgba(255, 255, 255, 0.15);
}

body.theme-dark .calendar-day.today {
    border-color: var(--grit-primary);
}

/* Dark Mode Activity Items */
body.theme-dark .training-item {
    background: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

body.theme-dark .training-item:hover {
    background: var(--bg-elevated);
    border-color: var(--grit-primary);
}

/* Dark Mode Hero Section */
body.theme-dark .hero {
    background: linear-gradient(135deg, var(--bg-secondary) 0%, var(--bg-tertiary) 100%);
}

/* Dark Mode Footer */
body.theme-dark footer {
    background: linear-gradient(135deg, #1E3A8A 0%, #2563EB 100%) !important;
    border-top: 1px solid rgba(255, 255, 255, 0.18) !important;
    color: rgba(255, 255, 255, 0.92) !important;
}

body.theme-dark footer a {
    color: #FFFFFF !important;
}

body.theme-dark footer a:hover {
    color: #FFFFFF !important;
}

/* Dark Mode Mobile Bottom Nav */
body.theme-dark .mobile-bottom-nav {
    background: rgba(15, 15, 18, 0.95);
    backdrop-filter: blur(20px);
    border-top: 1px solid var(--border-color);
}

body.theme-dark .mobile-bottom-nav a {
    color: var(--text-tertiary);
}

body.theme-dark .mobile-bottom-nav a.active {
    color: var(--grit-primary);
}

/* Dark Mode Leaderboard */
body.theme-dark .leaderboard-table tr.current-user {
    background: rgba(230, 57, 70, 0.1);
}

body.theme-dark .rank-1 {
    color: #FFD700;
}

body.theme-dark .rank-2 {
    color: #C0C0C0;
}

body.theme-dark .rank-3 {
    color: #CD7F32;
}

/* Dark Mode Alerts */
body.theme-dark .success {
    background: rgba(34, 197, 94, 0.15);
    border-left-color: var(--success);
}

body.theme-dark .error {
    background: rgba(239, 68, 68, 0.15);
    border-left-color: var(--danger);
}

/* Dark Mode Zone Colors */
body.theme-dark .zone-1 { background: var(--zone-recovery); }
body.theme-dark .zone-2 { background: var(--zone-endurance); }
body.theme-dark .zone-3 { background: var(--zone-tempo); }
body.theme-dark .zone-4 { background: var(--zone-threshold); }
body.theme-dark .zone-5 { background: var(--zone-vo2max); }

/* Dark Mode Empty States */
body.theme-dark .empty-state {
    color: var(--text-tertiary);
}

body.theme-dark .empty-state-icon {
    color: var(--text-muted);
}

/* Dark Mode Loading Skeletons */
body.theme-dark .skeleton {
    background: linear-gradient(
        90deg,
        var(--bg-tertiary) 0%,
        var(--bg-elevated) 50%,
        var(--bg-tertiary) 100%
    );
    background-size: 200% 100%;
    animation: skeleton-loading 1.5s infinite;
}

@keyframes skeleton-loading {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* Dark Mode Glowing Elements */
body.theme-dark .glow-primary {
    box-shadow: var(--shadow-glow-primary);
}

body.theme-dark .glow-accent {
    box-shadow: var(--shadow-glow-accent);
}

/* Dark Mode GRIT Score */
body.theme-dark .grit-score {
    text-shadow: 0 0 30px rgba(230, 57, 70, 0.5);
}

/* Dark Mode Hover Effects */
body.theme-dark .hover-glow:hover {
    box-shadow: 0 0 30px rgba(230, 57, 70, 0.2);
}

/* Dark Mode Dividers */
body.theme-dark hr {
    border-color: var(--border-color);
}

/* Dark Mode Toast */
body.theme-dark .toast {
    background: var(--bg-elevated);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
}

body.theme-dark .toast-success {
    border-left: 4px solid var(--success);
}

body.theme-dark .toast-error {
    border-left: 4px solid var(--danger);
}

body.theme-dark .toast-warning {
    border-left: 4px solid var(--warning);
}

/* Dark Mode Workout Library */
body.theme-dark .workout-library-sidebar {
    background: var(--bg-secondary);
    border-right: 1px solid var(--border-color);
}

body.theme-dark .library-workout-card {
    background: var(--bg-tertiary);
    border: 1px solid var(--border-color);
}

body.theme-dark .library-workout-card:hover {
    border-color: var(--grit-primary);
}

/* Theme Toggle Button Dark Mode Style */
body.theme-dark #themeToggle {
    background: var(--bg-tertiary);
    border: 1px solid var(--border-color);
    color: var(--grit-gold);
}

body.theme-dark #themeToggle:hover {
    background: var(--bg-elevated);
    box-shadow: var(--shadow-glow-accent);
}

/* Transitions for Theme Switch */
body.theme-transitioning,
body.theme-transitioning *,
body.theme-transitioning *::before,
body.theme-transitioning *::after {
    transition: 
        background-color 0.3s ease,
        background 0.3s ease,
        border-color 0.3s ease,
        color 0.3s ease,
        box-shadow 0.3s ease,
        fill 0.3s ease,
        stroke 0.3s ease !important;
}

/* Prefer Dark Mode Media Query */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        /* Apply dark mode variables when system prefers dark */
        --bg-primary: #0F0F12;
        --bg-secondary: #16161A;
        --text-primary: #F5F5F7;
        --text-secondary: #A1A1AA;
    }
}

/* ===========================================
   Light Mode Overrides
   Ensure readability in light theme
   =========================================== */
:root[data-theme="light"],
body.theme-light {
    /* Background Colors */
    --bg-primary: #FFFFFF;
    --bg-secondary: #F8FAFC;
    --bg-tertiary: #F1F5F9;
    --bg-elevated: #FFFFFF;
    --bg-dark-950: #FFFFFF;
    --bg-dark-900: #FFFFFF;
    --bg-dark-850: #F8FAFC;
    --bg-dark-800: #F1F5F9;
    --bg-dark-700: #E2E8F0;
    --bg-dark-600: #CBD5E1;
    
    /* Card & Surface */
    --card-background: #FFFFFF;
    --card-elevated: #FFFFFF;
    --background-color: #F8FAFC;
    
    /* Borders */
    --border-color: #E2E8F0;
    --border-accent: rgba(230, 57, 70, 0.2);
    --border-subtle: rgba(0, 0, 0, 0.05);
    
    /* Text - Dark on Light (HIGH CONTRAST) */
    --text-primary: #1E293B;
    --text-secondary: #475569;
    --text-tertiary: #64748B;
    --text-muted: #94A3B8;
    --muted-light: #CBD5E1;
    --text-dark: #1E293B;
    --text-dark-secondary: #475569;
    --text-dark-muted: #64748B;
    
    /* Shadows - Softer for light */
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.05);
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.04);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.07), 0 2px 4px rgba(0, 0, 0, 0.05);
    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.08), 0 4px 6px rgba(0, 0, 0, 0.05);
    --shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.1), 0 8px 10px rgba(0, 0, 0, 0.05);
    --shadow-2xl: 0 25px 50px rgba(0, 0, 0, 0.15);
}

/* Light Mode Body Background */
body.theme-light,
:root[data-theme="light"] body {
    background: #F8FAFC !important;
    color: #1E293B !important;
}

/* Light Mode Component Fixes */
[data-theme="light"] .card,
body.theme-light .card {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
    color: #1E293B !important;
}

[data-theme="light"] h1,
[data-theme="light"] h2,
[data-theme="light"] h3,
[data-theme="light"] h4,
[data-theme="light"] h5,
[data-theme="light"] h6,
body.theme-light h1,
body.theme-light h2,
body.theme-light h3,
body.theme-light h4,
body.theme-light h5,
body.theme-light h6 {
    color: #1E293B !important;
}

[data-theme="light"] p,
[data-theme="light"] span,
[data-theme="light"] div,
[data-theme="light"] label,
body.theme-light p,
body.theme-light span,
body.theme-light div,
body.theme-light label {
    color: inherit;
}

[data-theme="light"] .text-secondary,
body.theme-light .text-secondary {
    color: #475569 !important;
}

[data-theme="light"] .text-muted,
body.theme-light .text-muted {
    color: #64748B !important;
}

/* Light Mode Header */
[data-theme="light"] header,
body.theme-light header {
    background: #FFFFFF !important;
    border-bottom-color: #E2E8F0 !important;
}

[data-theme="light"] header nav a,
body.theme-light header nav a {
    color: #475569 !important;
}

[data-theme="light"] header nav a:hover,
[data-theme="light"] header nav a.active,
body.theme-light header nav a:hover,
body.theme-light header nav a.active {
    color: #E63946 !important;
}

/* Light Mode Analytics Tabs */
[data-theme="light"] .analytics-tab,
[data-theme="light"] a.analytics-tab,
body.theme-light .analytics-tab,
body.theme-light a.analytics-tab {
    color: #475569 !important;
    background: #F8FAFC !important;
    border-color: #E2E8F0 !important;
}

[data-theme="light"] .analytics-tab.active,
[data-theme="light"] a.analytics-tab.active,
body.theme-light .analytics-tab.active,
body.theme-light a.analytics-tab.active {
    color: white !important;
    background: var(--grit-primary, #E63946) !important;
}

/* Light Mode Inputs */
[data-theme="light"] input,
[data-theme="light"] select,
[data-theme="light"] textarea,
body.theme-light input,
body.theme-light select,
body.theme-light textarea {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
    color: #1E293B !important;
}

[data-theme="light"] input::placeholder,
body.theme-light input::placeholder {
    color: #94A3B8 !important;
}

/* Light Mode Buttons */
[data-theme="light"] .btn-secondary,
body.theme-light .btn-secondary {
    background: #F1F5F9 !important;
    border-color: #E2E8F0 !important;
    color: #475569 !important;
}

[data-theme="light"] .btn-secondary:hover,
body.theme-light .btn-secondary:hover {
    background: #E2E8F0 !important;
    color: #1E293B !important;
}

/* Light Mode Tables */
[data-theme="light"] table th,
body.theme-light table th {
    background: #F8FAFC !important;
    color: #475569 !important;
}

[data-theme="light"] table td,
body.theme-light table td {
    color: #1E293B !important;
    border-color: #E2E8F0 !important;
}

[data-theme="light"] table tr:hover,
body.theme-light table tr:hover {
    background: #F1F5F9 !important;
}

/* Light Mode Mobile Bottom Nav */
[data-theme="light"] .mobile-bottom-nav,
body.theme-light .mobile-bottom-nav {
    background: #FFFFFF !important;
    border-top-color: #E2E8F0 !important;
}

[data-theme="light"] .mobile-bottom-nav a,
body.theme-light .mobile-bottom-nav a {
    color: #64748B !important;
}

[data-theme="light"] .mobile-bottom-nav a.active,
body.theme-light .mobile-bottom-nav a.active {
    color: #E63946 !important;
}

/* Light Mode Chart Containers */
[data-theme="light"] .chart-container,
[data-theme="light"] .curve-container,
[data-theme="light"] .wellness-form,
[data-theme="light"] .wellness-metric,
body.theme-light .chart-container,
body.theme-light .curve-container,
body.theme-light .wellness-form,
body.theme-light .wellness-metric {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
}

/* Light Mode Stats/Metric Cards */
[data-theme="light"] .stat-card,
[data-theme="light"] .improvement-card,
[data-theme="light"] .race-card,
[data-theme="light"] .quick-stat,
body.theme-light .stat-card,
body.theme-light .improvement-card,
body.theme-light .race-card,
body.theme-light .quick-stat {
    background: #F8FAFC !important;
    border-color: #E2E8F0 !important;
}

[data-theme="light"] .stat-card .metric-value,
[data-theme="light"] .improvement-value,
[data-theme="light"] .quick-stat-value,
body.theme-light .stat-card .metric-value,
body.theme-light .improvement-value,
body.theme-light .quick-stat-value {
    color: #1E293B !important;
}

[data-theme="light"] .stat-card .metric-label,
[data-theme="light"] .improvement-label,
[data-theme="light"] .quick-stat-label,
body.theme-light .stat-card .metric-label,
body.theme-light .improvement-label,
body.theme-light .quick-stat-label {
    color: #64748B !important;
}

/* Light Mode Wellness Sliders */
[data-theme="light"] .slider-value,
body.theme-light .slider-value {
    color: #1E293B !important;
}

/* Light Mode Footer */
[data-theme="light"] footer,
body.theme-light footer {
    background: linear-gradient(135deg, #1E3A8A 0%, #2563EB 100%) !important;
    color: rgba(255, 255, 255, 0.92) !important;
    border-top-color: rgba(255, 255, 255, 0.18) !important;
}

[data-theme="light"] footer a,
body.theme-light footer a {
    color: #FFFFFF !important;
}

/* Light Mode ATP Page */
[data-theme="light"] .atp-stat-card,
body.theme-light .atp-stat-card {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
}

[data-theme="light"] .atp-stat-value,
[data-theme="light"] .atp-stat-label,
body.theme-light .atp-stat-value,
body.theme-light .atp-stat-label {
    color: #1E293B !important;
}

[data-theme="light"] .atp-stat-sub,
body.theme-light .atp-stat-sub {
    color: #64748B !important;
}

[data-theme="light"] .atp-chart-container,
[data-theme="light"] .atp-table-container,
body.theme-light .atp-chart-container,
body.theme-light .atp-table-container {
    background: #FFFFFF !important;
    border-color: #E2E8F0 !important;
}

[data-theme="light"] .atp-table th,
body.theme-light .atp-table th {
    background: #F8FAFC !important;
    color: #475569 !important;
}

[data-theme="light"] .atp-table td,
body.theme-light .atp-table td {
    color: #1E293B !important;
    border-color: #E2E8F0 !important;
}

[data-theme="light"] .atp-table tr:hover,
body.theme-light .atp-table tr:hover {
    background: #F1F5F9 !important;
}

/* Final Footer Text Override - keep white everywhere */
footer,
footer *,
footer a,
footer a:visited,
footer a:active,
footer a:focus,
footer .text-muted,
footer .text-secondary,
footer .text-tertiary,
footer [class*="text-"] {
    color: #FFFFFF !important;
    opacity: 1 !important;
}

[data-theme="light"] .atp-table .month-label,
body.theme-light .atp-table .month-label {
    background: #F8FAFC !important;
    color: #1E293B !important;
}

[data-theme="light"] .atp-btn-secondary,
body.theme-light .atp-btn-secondary {
    background: #F8FAFC !important;
    border-color: #E2E8F0 !important;
    color: #475569 !important;
}

[data-theme="light"] .atp-btn-secondary:hover,
body.theme-light .atp-btn-secondary:hover {
    background: #E2E8F0 !important;
    color: #1E293B !important;
}

[data-theme="light"] .modal,
body.theme-light .modal {
    background: #FFFFFF !important;
}

[data-theme="light"] .limiter-tag,
body.theme-light .limiter-tag {
    background: #F1F5F9 !important;
    color: #475569 !important;
}

[data-theme="light"] .phase-timeline .phase-block,
body.theme-light .phase-timeline .phase-block {
    color: #FFFFFF !important;
}