/* 🌙 French Dictionary - Global Dark Mode Styles */

/* CSS Variables for Theme Management */
:root {
    /* Light Theme Colors */
    --bg-primary: #ffffff;
    --bg-secondary: #f8f9fa;
    --bg-tertiary: #e9ecef;
    --bg-card: #ffffff;
    --bg-navbar: #0d6efd;
    --bg-footer: #f8f9fa;
    --bg-sidebar: #f8f9fa;
    
    --text-primary: #212529;
    --text-secondary: #6c757d;
    --text-muted: #6c757d;
    --text-light: #ffffff;
    --text-dark: #212529;
    
    --border-color: #dee2e6;
    --border-light: #e9ecef;
    --border-dark: #adb5bd;
    
    --shadow-color: rgba(0, 0, 0, 0.15);
    --card-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    --hover-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    
    --hover-bg: #f8f9fa;
    --hover-bg-light: #e9ecef;
    --hover-bg-dark: #dee2e6;
    
    --link-color: #0d6efd;
    --link-hover: #0a58ca;
    --link-visited: #6f42c1;
    
    --success-color: #198754;
    --warning-color: #ffc107;
    --danger-color: #dc3545;
    --info-color: #0dcaf0;
    --primary-color: #0d6efd;
    --secondary-color: #6c757d;
    
    --code-bg: #f8f9fa;
    --code-border: #e9ecef;
    --code-text: #e83e8c;
    
    --table-stripe: #f8f9fa;
    --table-hover: #e9ecef;
    
    --modal-backdrop: rgba(0, 0, 0, 0.5);
    --tooltip-bg: #212529;
    --tooltip-text: #ffffff;
}

[data-theme="dark"] {
    /* Dark Theme Colors */
    --bg-primary: #1a1a1a;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #404040;
    --bg-card: #2d2d2d;
    --bg-navbar: #1a1a1a;
    --bg-footer: #2d2d2d;
    --bg-sidebar: #2d2d2d;
    
    --text-primary: #ffffff;
    --text-secondary: #b0b0b0;
    --text-muted: #888888;
    --text-light: #ffffff;
    --text-dark: #e0e0e0;
    
    --border-color: #404040;
    --border-light: #505050;
    --border-dark: #606060;
    
    --shadow-color: rgba(0, 0, 0, 0.3);
    --card-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.2);
    --hover-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.3);
    
    --hover-bg: #404040;
    --hover-bg-light: #505050;
    --hover-bg-dark: #606060;
    
    --link-color: #66b3ff;
    --link-hover: #99ccff;
    --link-visited: #b366ff;
    
    --success-color: #28a745;
    --warning-color: #ffc107;
    --danger-color: #dc3545;
    --info-color: #17a2b8;
    --primary-color: #66b3ff;
    --secondary-color: #6c757d;
    
    --code-bg: #2d2d2d;
    --code-border: #404040;
    --code-text: #ff6b9d;
    
    --table-stripe: #2d2d2d;
    --table-hover: #404040;
    
    --modal-backdrop: rgba(0, 0, 0, 0.7);
    --tooltip-bg: #ffffff;
    --tooltip-text: #212529;
}

/* Global Theme Application */
* {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

body {
    background-color: var(--bg-primary);
    color: var(--text-primary);
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* Navigation & Header */
.navbar {
    background-color: var(--bg-navbar) !important;
    border-bottom: 1px solid var(--border-color);
    box-shadow: 0 2px 4px var(--shadow-color);
}

.navbar-brand {
    color: var(--text-light) !important;
}

.navbar-nav .nav-link {
    color: var(--text-light) !important;
}

.navbar-nav .nav-link:hover {
    color: var(--text-light) !important;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 4px;
}

/* Cards & Containers */
.card {
    background-color: var(--bg-card);
    border-color: var(--border-color);
    box-shadow: var(--card-shadow);
}

.card-header {
    background-color: var(--bg-secondary);
    border-bottom-color: var(--border-color);
    color: var(--text-primary);
}

.card-footer {
    background-color: var(--bg-secondary);
    border-top-color: var(--border-color);
}

/* Forms & Inputs */
.form-control {
    background-color: var(--bg-card);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.form-control:focus {
    background-color: var(--bg-card);
    border-color: var(--link-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.25rem rgba(102, 179, 255, 0.25);
}

.form-select {
    background-color: var(--bg-card);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.form-select:focus {
    background-color: var(--bg-card);
    border-color: var(--link-color);
    color: var(--text-primary);
    box-shadow: 0 0 0 0.25rem rgba(102, 179, 255, 0.25);
}

.form-check-input {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

.form-check-input:checked {
    background-color: var(--link-color);
    border-color: var(--link-color);
}

/* Buttons */
.btn-outline-primary {
    color: var(--link-color);
    border-color: var(--link-color);
}

.btn-outline-primary:hover {
    background-color: var(--link-color);
    border-color: var(--link-color);
    color: var(--text-light);
}

.btn-outline-secondary {
    color: var(--text-secondary);
    border-color: var(--border-color);
}

.btn-outline-secondary:hover {
    background-color: var(--text-secondary);
    border-color: var(--text-secondary);
    color: var(--text-light);
}

.btn-outline-success {
    color: var(--success-color);
    border-color: var(--success-color);
}

.btn-outline-success:hover {
    background-color: var(--success-color);
    border-color: var(--success-color);
    color: var(--text-light);
}

.btn-outline-warning {
    color: var(--warning-color);
    border-color: var(--warning-color);
}

.btn-outline-warning:hover {
    background-color: var(--warning-color);
    border-color: var(--warning-color);
    color: var(--text-dark);
}

.btn-outline-danger {
    color: var(--danger-color);
    border-color: var(--danger-color);
}

.btn-outline-danger:hover {
    background-color: var(--danger-color);
    border-color: var(--danger-color);
    color: var(--text-light);
}

.btn-outline-info {
    color: var(--info-color);
    border-color: var(--info-color);
}

.btn-outline-info:hover {
    background-color: var(--info-color);
    border-color: var(--info-color);
    color: var(--text-light);
}

/* Tables */
.table {
    color: var(--text-primary);
}

.table th {
    background-color: var(--bg-secondary);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.table td {
    border-color: var(--border-color);
}

.table-striped > tbody > tr:nth-of-type(odd) > td {
    background-color: var(--table-stripe);
}

.table-hover > tbody > tr:hover > td {
    background-color: var(--table-hover);
}

/* Lists */
.list-group-item {
    background-color: var(--bg-card);
    border-color: var(--border-color);
    color: var(--text-primary);
}

.list-group-item:hover {
    background-color: var(--hover-bg);
}

.list-group-item.active {
    background-color: var(--link-color);
    border-color: var(--link-color);
    color: var(--text-light);
}

/* Breadcrumbs */
.breadcrumb {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

.breadcrumb-item a {
    color: var(--link-color);
}

.breadcrumb-item.active {
    color: var(--text-muted);
}

/* Badges */
.badge {
    border: 1px solid var(--border-color);
}

/* Modals */
.modal-content {
    background-color: var(--bg-card);
    border-color: var(--border-color);
}

.modal-header {
    background-color: var(--bg-secondary);
    border-bottom-color: var(--border-color);
    color: var(--text-primary);
}

.modal-footer {
    background-color: var(--bg-secondary);
    border-top-color: var(--border-color);
}

.modal-backdrop {
    background-color: var(--modal-backdrop);
}

/* Dropdowns */
.dropdown-menu {
    background-color: var(--bg-card);
    border-color: var(--border-color);
    box-shadow: var(--hover-shadow);
}

.dropdown-item {
    color: var(--text-primary);
}

.dropdown-item:hover {
    background-color: var(--hover-bg);
    color: var(--text-primary);
}

.dropdown-divider {
    border-color: var(--border-color);
}

/* Alerts */
.alert {
    border-color: var(--border-color);
}

.alert-primary {
    background-color: rgba(102, 179, 255, 0.1);
    color: var(--link-color);
    border-color: var(--link-color);
}

.alert-success {
    background-color: rgba(40, 167, 69, 0.1);
    color: var(--success-color);
    border-color: var(--success-color);
}

.alert-warning {
    background-color: rgba(255, 193, 7, 0.1);
    color: var(--warning-color);
    border-color: var(--warning-color);
}

.alert-danger {
    background-color: rgba(220, 53, 69, 0.1);
    color: var(--danger-color);
    border-color: var(--danger-color);
}

.alert-info {
    background-color: rgba(23, 162, 184, 0.1);
    color: var(--info-color);
    border-color: var(--info-color);
}

/* Progress Bars */
.progress {
    background-color: var(--bg-secondary);
    border: 1px solid var(--border-color);
}

/* Code Blocks */
pre, code {
    background-color: var(--code-bg);
    border: 1px solid var(--code-border);
    color: var(--code-text);
}

/* Links */
a {
    color: var(--link-color);
}

a:hover {
    color: var(--link-hover);
}

a:visited {
    color: var(--link-visited);
}

/* Text Colors */
.text-muted {
    color: var(--text-muted) !important;
}

.text-success {
    color: var(--success-color) !important;
}

.text-warning {
    color: var(--warning-color) !important;
}

.text-danger {
    color: var(--danger-color) !important;
}

.text-info {
    color: var(--info-color) !important;
}

.text-primary {
    color: var(--primary-color) !important;
}

.text-secondary {
    color: var(--secondary-color) !important;
}

/* Background Colors */
.bg-light {
    background-color: var(--bg-secondary) !important;
}

.bg-dark {
    background-color: var(--bg-card) !important;
}

/* Footer */
footer {
    background-color: var(--bg-footer);
    border-top: 1px solid var(--border-color);
    color: var(--text-primary);
}

/* Sidebar */
.sidebar {
    background-color: var(--bg-sidebar);
    border-right: 1px solid var(--border-color);
}

/* Tooltips */
.tooltip-inner {
    background-color: var(--tooltip-bg);
    color: var(--tooltip-text);
}

.bs-tooltip-top .tooltip-arrow::before {
    border-top-color: var(--tooltip-bg);
}

.bs-tooltip-bottom .tooltip-arrow::before {
    border-bottom-color: var(--tooltip-bg);
}

.bs-tooltip-start .tooltip-arrow::before {
    border-left-color: var(--tooltip-bg);
}

.bs-tooltip-end .tooltip-arrow::before {
    border-right-color: var(--tooltip-bg);
}

/* Selection */
::selection {
    background-color: var(--link-color);
    color: var(--text-light);
}

::-moz-selection {
    background-color: var(--link-color);
    color: var(--text-light);
}

/* Scrollbar (Webkit browsers) */
::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    background: var(--bg-secondary);
}

::-webkit-scrollbar-thumb {
    background: var(--border-color);
    border-radius: 6px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--border-dark);
}

/* Dark Mode Specific Enhancements */
[data-theme="dark"] {
    /* Enhanced shadows for dark mode */
    .card {
        box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.3);
    }
    
    .card:hover {
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.4);
    }
    
    /* Better contrast for dark backgrounds */
    .bg-primary {
        background-color: var(--primary-color) !important;
    }
    
    .bg-success {
        background-color: var(--success-color) !important;
    }
    
    .bg-warning {
        background-color: var(--warning-color) !important;
    }
    
    .bg-danger {
        background-color: var(--danger-color) !important;
    }
    
    .bg-info {
        background-color: var(--info-color) !important;
    }

    /* Enhanced dark mode gradients */
    .bg-gradient-primary {
        background: linear-gradient(135deg, var(--primary-color), #4a90e2) !important;
    }

    .bg-gradient-success {
        background: linear-gradient(135deg, var(--success-color), #5cb85c) !important;
    }

    .bg-gradient-warning {
        background: linear-gradient(135deg, var(--warning-color), #f0ad4e) !important;
    }

    .bg-gradient-danger {
        background: linear-gradient(135deg, var(--danger-color), #d9534f) !important;
    }

    /* Improved dark mode borders */
    .border-primary {
        border-color: var(--primary-color) !important;
    }

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

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

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

    /* Dark mode specific text shadows */
    .text-shadow-dark {
        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    }

    /* Enhanced dark mode backgrounds */
    .bg-dark-soft {
        background-color: var(--bg-tertiary) !important;
    }

    .bg-dark-lighter {
        background-color: #3a3a3a !important;
    }

    /* Dark mode glassmorphism effect */
    .glass-dark {
        background: rgba(45, 45, 45, 0.8);
        backdrop-filter: blur(10px);
        border: 1px solid rgba(255, 255, 255, 0.1);
    }

    /* Dark mode neon effects */
    .neon-primary {
        box-shadow: 0 0 5px var(--primary-color), 0 0 10px var(--primary-color), 0 0 15px var(--primary-color);
    }

    .neon-success {
        box-shadow: 0 0 5px var(--success-color), 0 0 10px var(--success-color), 0 0 15px var(--success-color);
    }

    .neon-warning {
        box-shadow: 0 0 5px var(--warning-color), 0 0 10px var(--warning-color), 0 0 15px var(--warning-color);
    }

    .neon-danger {
        box-shadow: 0 0 5px var(--danger-color), 0 0 10px var(--danger-color), 0 0 15px var(--danger-color);
    }
}

/* Responsive Dark Mode */
@media (max-width: 768px) {
    [data-theme="dark"] .card {
        box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.4);
    }
}

/* Enhanced Component Styling */
[data-theme="dark"] .navbar {
    background: linear-gradient(135deg, var(--bg-navbar), #2d2d2d) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

/* Enhanced Card Styling for Dark Mode */
[data-theme="dark"] .card {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .card-body {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .card-title {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .card-text {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .card-subtitle {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .card-header {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-bottom: 2px solid var(--border-color);
    color: var(--text-primary) !important;
}

[data-theme="dark"] .btn-primary {
    background: linear-gradient(135deg, var(--primary-color), #4a90e2) !important;
    border: none !important;
    box-shadow: 0 4px 15px rgba(102, 179, 255, 0.3);
    transition: all 0.3s ease;
}

[data-theme="dark"] .btn-primary:hover {
    background: linear-gradient(135deg, #4a90e2, var(--primary-color)) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(102, 179, 255, 0.4);
}

[data-theme="dark"] .btn-success {
    background: linear-gradient(135deg, var(--success-color), #5cb85c) !important;
    border: none !important;
    box-shadow: 0 4px 15px rgba(40, 167, 69, 0.3);
}

[data-theme="dark"] .btn-success:hover {
    background: linear-gradient(135deg, #5cb85c, var(--success-color)) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(40, 167, 69, 0.4);
}

[data-theme="dark"] .btn-warning {
    background: linear-gradient(135deg, var(--warning-color), #f0ad4e) !important;
    border: none !important;
    box-shadow: 0 4px 15px rgba(255, 193, 7, 0.3);
}

[data-theme="dark"] .btn-warning:hover {
    background: linear-gradient(135deg, #f0ad4e, var(--warning-color)) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(255, 193, 7, 0.4);
}

[data-theme="dark"] .btn-danger {
    background: linear-gradient(135deg, var(--danger-color), #d9534f) !important;
    border: none !important;
    box-shadow: 0 4px 15px rgba(220, 53, 69, 0.3);
}

[data-theme="dark"] .btn-danger:hover {
    background: linear-gradient(135deg, #d9534f, var(--danger-color)) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(220, 53, 69, 0.4);
}

/* Enhanced Form Styling */
[data-theme="dark"] .form-control:focus {
    box-shadow: 0 0 0 0.25rem rgba(102, 179, 255, 0.25), 0 0 20px rgba(102, 179, 255, 0.1);
    border-color: var(--primary-color);
    transform: scale(1.02);
}

[data-theme="dark"] .form-select:focus {
    box-shadow: 0 0 0 0.25rem rgba(102, 179, 255, 0.25), 0 0 20px rgba(102, 179, 255, 0.1);
    border-color: var(--primary-color);
    transform: scale(1.02);
}

/* Enhanced Table Styling */
[data-theme="dark"] .table {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .table th {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    color: var(--text-primary);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > td {
    background-color: rgba(255, 255, 255, 0.02);
}

[data-theme="dark"] .table-hover > tbody > tr:hover > td {
    background-color: rgba(102, 179, 255, 0.1);
    transform: scale(1.01);
    transition: all 0.2s ease;
}

/* Enhanced Badge Styling */
[data-theme="dark"] .badge {
    border-radius: 12px;
    padding: 0.5em 0.8em;
    font-weight: 600;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    font-size: 0.75em;
}

[data-theme="dark"] .badge.bg-primary {
    background: linear-gradient(135deg, var(--primary-color), #4a90e2) !important;
    box-shadow: 0 2px 8px rgba(102, 179, 255, 0.3);
}

[data-theme="dark"] .badge.bg-success {
    background: linear-gradient(135deg, var(--success-color), #5cb85c) !important;
    box-shadow: 0 2px 8px rgba(40, 167, 69, 0.3);
}

[data-theme="dark"] .badge.bg-warning {
    background: linear-gradient(135deg, var(--warning-color), #f0ad4e) !important;
    box-shadow: 0 2px 8px rgba(255, 193, 7, 0.3);
}

[data-theme="dark"] .badge.bg-danger {
    background: linear-gradient(135deg, var(--danger-color), #d9534f) !important;
    box-shadow: 0 2px 8px rgba(220, 53, 69, 0.3);
}

/* Enhanced Progress Bar Styling */
[data-theme="dark"] .progress {
    height: 12px;
    border-radius: 6px;
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary));
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .progress-bar {
    border-radius: 6px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    position: relative;
    overflow: hidden;
}

[data-theme="dark"] .progress-bar::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    animation: shimmer 2s infinite;
}

@keyframes shimmer {
    0% { transform: translateX(-100%); }
    100% { transform: translateX(100%); }
}

/* Enhanced Alert Styling */
[data-theme="dark"] .alert {
    border-radius: 12px;
    border: none;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(10px);
}

[data-theme="dark"] .alert-primary {
    background: linear-gradient(135deg, rgba(102, 179, 255, 0.1), rgba(102, 179, 255, 0.05)) !important;
    border-left: 4px solid var(--primary-color);
    box-shadow: 0 4px 20px rgba(102, 179, 255, 0.1);
}

[data-theme="dark"] .alert-success {
    background: linear-gradient(135deg, rgba(40, 167, 69, 0.1), rgba(40, 167, 69, 0.05)) !important;
    border-left: 4px solid var(--success-color);
    box-shadow: 0 4px 20px rgba(40, 167, 69, 0.1);
}

[data-theme="dark"] .alert-warning {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.1), rgba(255, 193, 7, 0.05)) !important;
    border-left: 4px solid var(--warning-color);
    box-shadow: 0 4px 20px rgba(255, 193, 7, 0.1);
}

[data-theme="dark"] .alert-danger {
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.1), rgba(220, 53, 69, 0.05)) !important;
    border-left: 4px solid var(--danger-color);
    box-shadow: 0 4px 20px rgba(220, 53, 69, 0.1);
}

/* Enhanced Modal Styling */
[data-theme="dark"] .modal-content {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border: 1px solid var(--border-color);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(20px);
}

[data-theme="dark"] .modal-header {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-bottom: 2px solid var(--border-color);
}

[data-theme="dark"] .modal-footer {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-top: 2px solid var(--border-color);
}

/* Enhanced Dropdown Styling */
[data-theme="dark"] .dropdown-menu {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border: 1px solid var(--border-color);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(15px);
    border-radius: 12px;
}

[data-theme="dark"] .dropdown-item:hover {
    background: linear-gradient(135deg, var(--hover-bg), var(--hover-bg-light)) !important;
    transform: translateX(5px);
    transition: all 0.2s ease;
}

/* Enhanced List Group Styling */
[data-theme="dark"] .list-group-item {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border: 1px solid var(--border-color);
    transition: all 0.3s ease;
}

[data-theme="dark"] .list-group-item:hover {
    background: linear-gradient(135deg, var(--hover-bg), var(--hover-bg-light)) !important;
    transform: translateX(5px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .list-group-item.active {
    background: linear-gradient(135deg, var(--primary-color), #4a90e2) !important;
    border-color: var(--primary-color);
    box-shadow: 0 4px 15px rgba(102, 179, 255, 0.3);
}

/* Print Styles */
@media print {
    [data-theme="dark"] {
        --bg-primary: #ffffff;
        --bg-secondary: #f8f9fa;
        --bg-card: #ffffff;
        --text-primary: #000000;
        --text-secondary: #6c757d;
        --border-color: #dee2e6;
    }
}

/* Theme Notification Styles */
.theme-notification {
    position: fixed;
    top: 20px;
    right: 20px;
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary));
    color: var(--text-primary);
    padding: 1rem 1.5rem;
    border-radius: 12px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
    border: 1px solid var(--border-color);
    z-index: 10000;
    transform: translateX(100%);
    opacity: 0;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    backdrop-filter: blur(10px);
}

.theme-notification.show {
    transform: translateX(0);
    opacity: 1;
}

.theme-notification-content {
    display: flex;
    align-items: center;
    font-weight: 600;
}

/* Theme Context Menu Styles */
.theme-context-menu {
    position: fixed;
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary));
    border: 1px solid var(--border-color);
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(15px);
    z-index: 10000;
    min-width: 200px;
    overflow: hidden;
}

.theme-context-menu-item {
    padding: 0.75rem 1rem;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    color: var(--text-primary);
}

.theme-context-menu-item:hover {
    background: linear-gradient(135deg, var(--hover-bg), var(--hover-bg-light));
    transform: translateX(5px);
}

.theme-context-menu-divider {
    height: 1px;
    background: var(--border-color);
    margin: 0.5rem 0;
}

/* Keyboard Shortcut Feedback Styles */
.keyboard-shortcut-feedback {
    position: fixed;
    bottom: 20px;
    left: 20px;
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary));
    color: var(--text-primary);
    padding: 0.75rem 1rem;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    border: 1px solid var(--border-color);
    z-index: 10000;
    transform: translateY(100%);
    opacity: 0;
    transition: all 0.3s ease;
    backdrop-filter: blur(10px);
}

.keyboard-shortcut-feedback.show {
    transform: translateY(0);
    opacity: 1;
}

/* Theme Stats Modal Styles */
.theme-stats-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
    backdrop-filter: blur(5px);
}

.theme-stats-content {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary));
    color: var(--text-primary);
    padding: 2rem;
    border-radius: 16px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    border: 1px solid var(--border-color);
    max-width: 500px;
    width: 90%;
    backdrop-filter: blur(20px);
}

.theme-stats-grid {
    display: grid;
    gap: 1rem;
    margin: 1.5rem 0;
}

.stat-item {
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 8px;
    border-left: 3px solid var(--primary-color);
}

/* Enhanced Dark Mode Animations */
[data-theme="dark"] .card {
    animation: darkModeCardIn 0.5s ease-out;
}

@keyframes darkModeCardIn {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

[data-theme="dark"] .btn {
    animation: darkModeButtonIn 0.3s ease-out;
}

@keyframes darkModeButtonIn {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

/* Dark Mode Loading States */
[data-theme="dark"] .loading {
    background: linear-gradient(90deg, var(--bg-secondary), var(--bg-tertiary), var(--bg-secondary));
    background-size: 200% 100%;
    animation: loading 1.5s infinite;
}

/* Flashcard Interface Dark Mode Styling */
[data-theme="dark"] #flashcardInterface .card {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border: 2px solid var(--border-color) !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] #flashcardInterface .card-header {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    color: var(--text-light) !important;
    border-bottom: 2px solid var(--border-color) !important;
}

[data-theme="dark"] #flashcardInterface .card-body {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .flashcard-container {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
}

[data-theme="dark"] .flashcard {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border: 2px solid var(--border-color) !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] .flashcard-front,
[data-theme="dark"] .flashcard-back {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .flashcard-word {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .flashcard-definition {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .flashcard-examples {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .flashcard-progress {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    padding: 1rem;
    border-radius: 8px;
    border: 1px solid var(--border-color) !important;
}

/* Ensure all text elements in cards are visible in dark mode */
[data-theme="dark"] .card * {
    color: inherit;
}

[data-theme="dark"] .card h1,
[data-theme="dark"] .card h2,
[data-theme="dark"] .card h3,
[data-theme="dark"] .card h4,
[data-theme="dark"] .card h5,
[data-theme="dark"] .card h6 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .card p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .card small,
[data-theme="dark"] .card .text-muted {
    color: var(--text-muted) !important;
}

[data-theme="dark"] .card .text-primary {
    color: var(--primary-color) !important;
}

[data-theme="dark"] .card .text-success {
    color: var(--success-color) !important;
}

[data-theme="dark"] .card .text-warning {
    color: var(--warning-color) !important;
}

[data-theme="dark"] .card .text-danger {
    color: var(--danger-color) !important;
}

[data-theme="dark"] .card .text-info {
    color: var(--info-color) !important;
}

/* Ensure form elements in cards are visible */
[data-theme="dark"] .card .form-control {
    background-color: var(--bg-tertiary) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .card .form-label {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .card .form-text {
    color: var(--text-muted) !important;
}

/* Bootstrap utility classes in cards for dark mode */
[data-theme="dark"] .card .fw-bold {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .card .fst-italic {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .card .text-center {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .card .text-start {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .card .text-end {
    color: var(--text-primary) !important;
}

/* Ensure buttons in cards are properly styled */
[data-theme="dark"] .card .btn {
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .card .btn-outline-primary {
    color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

[data-theme="dark"] .card .btn-outline-success {
    color: var(--success-color) !important;
    border-color: var(--success-color) !important;
}

[data-theme="dark"] .card .btn-outline-warning {
    color: var(--warning-color) !important;
    border-color: var(--warning-color) !important;
}

[data-theme="dark"] .card .btn-outline-danger {
    color: var(--danger-color) !important;
    border-color: var(--danger-color) !important;
}

[data-theme="dark"] .card .btn-outline-info {
    color: var(--info-color) !important;
    border-color: var(--info-color) !important;
}

[data-theme="dark"] .card .btn-outline-secondary {
    color: var(--text-secondary) !important;
    border-color: var(--border-color) !important;
}

/* Word Card Specific Dark Mode Styling */
[data-theme="dark"] .word-card {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .word-card .word-header {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-bottom: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .word-card .word-title {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .word-card .word-title a {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .word-card .word-title a:hover {
    color: var(--primary-color) !important;
}

[data-theme="dark"] .word-card .word-definition {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .word-card .word-examples {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .word-card .word-badges {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .word-card .word-part-of-speech {
    background: linear-gradient(135deg, var(--bg-tertiary), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .word-card .difficulty-badge {
    color: var(--text-light) !important;
}

[data-theme="dark"] .word-card .difficulty-badge.beginner {
    background: linear-gradient(135deg, var(--success-color), #5cb85c) !important;
}

[data-theme="dark"] .word-card .difficulty-badge.intermediate {
    background: linear-gradient(135deg, var(--warning-color), #f0ad4e) !important;
}

[data-theme="dark"] .word-card .difficulty-badge.advanced {
    background: linear-gradient(135deg, var(--danger-color), #d9534f) !important;
}

[data-theme="dark"] .word-card .word-thumbnail {
    background: linear-gradient(135deg, var(--bg-tertiary), var(--bg-secondary)) !important;
    border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .word-card .word-thumbnail-img {
    border: 1px solid var(--border-color) !important;
}

/* Hover effects for word cards in dark mode */
[data-theme="dark"] .word-card:hover {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] .word-card:hover::before {
    background: linear-gradient(135deg, var(--primary-color), var(--link-color)) !important;
}

/* Main Page Specific Cards Dark Mode Styling */
[data-theme="dark"] .search-section .card {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border: 1px solid var(--border-color) !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .search-section .card-header {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-bottom: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .search-section .card-body {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .search-section .card-title {
    color: var(--text-primary) !important;
}

/* Statistics Section Dark Mode */
[data-theme="dark"] .stat-item {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: 8px;
    padding: 1rem;
    margin: 0.5rem;
}

[data-theme="dark"] .stat-item h3 {
    color: var(--primary-color) !important;
    font-weight: bold;
}

[data-theme="dark"] .stat-item p {
    color: var(--text-secondary) !important;
}

/* Search Input Dark Mode */
[data-theme="dark"] #searchInput {
    background-color: var(--bg-tertiary) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] #searchInput::placeholder {
    color: var(--text-muted) !important;
}

[data-theme="dark"] #searchInput:focus {
    background-color: var(--bg-tertiary) !important;
    border-color: var(--primary-color) !important;
    color: var(--text-primary) !important;
    box-shadow: 0 0 0 0.25rem rgba(102, 179, 255, 0.25) !important;
}

/* Difficulty Filter Buttons Dark Mode */
[data-theme="dark"] .btn-group .btn-outline-secondary {
    background-color: transparent !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .btn-group .btn-outline-secondary:hover,
[data-theme="dark"] .btn-group .btn-outline-secondary:focus {
    background-color: var(--hover-bg) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .btn-group .btn-check:checked + .btn-outline-secondary {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    color: var(--text-light) !important;
}

/* Footer and Additional Elements Dark Mode */
[data-theme="dark"] footer {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-top: 1px solid var(--border-color) !important;
}

[data-theme="dark"] footer h6 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] footer p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] footer .text-muted {
    color: var(--text-muted) !important;
}

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

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

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

[data-theme="dark"] .pagination .page-item.disabled .page-link {
    background-color: var(--bg-tertiary) !important;
    border-color: var(--border-color) !important;
    color: var(--text-muted) !important;
}

/* Empty State Dark Mode */
[data-theme="dark"] .empty-state {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .empty-state h5 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .empty-state p {
    color: var(--text-secondary) !important;
}

/* Word Page Specific Elements Dark Mode */
[data-theme="dark"] .word-definitions {
    background: transparent !important;
}

[data-theme="dark"] .definition-item {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .definition-item strong {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .definition-item em {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .word-examples {
    background: transparent !important;
}

[data-theme="dark"] .example-item {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .example-item strong {
    color: var(--text-primary) !important;
}

/* Video and Article Links Dark Mode */
[data-theme="dark"] .video-item,
[data-theme="dark"] .article-item {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .video-link,
[data-theme="dark"] .article-link {
    color: var(--link-color) !important;
}

[data-theme="dark"] .video-link:hover,
[data-theme="dark"] .article-link:hover {
    color: var(--link-hover) !important;
}

[data-theme="dark"] .video-link i,
[data-theme="dark"] .article-link i {
    color: var(--danger-color) !important;
}

/* Etymology Section Dark Mode */
[data-theme="dark"] .word-page h6 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .word-page p {
    color: var(--text-secondary) !important;
}

/* Conjugations Table Dark Mode */
[data-theme="dark"] .table-light,
[data-theme="dark"] .table.table-light {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .table-light th,
[data-theme="dark"] .table.table-light th,
[data-theme="dark"] .table.table-light thead th {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .table-light td,
[data-theme="dark"] .table.table-light td,
[data-theme="dark"] .table.table-light tbody td {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .table-light td strong,
[data-theme="dark"] .table.table-light td strong,
[data-theme="dark"] .table.table-light tbody td strong {
    color: var(--text-primary) !important;
}

/* Additional table styling for dark mode */
[data-theme="dark"] .table {
    background: transparent !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .table-bordered {
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .table-bordered th,
[data-theme="dark"] .table-bordered td {
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .table-sm th,
[data-theme="dark"] .table-sm td {
    padding: 0.3rem !important;
}

/* Ensure table responsiveness works in dark mode */
[data-theme="dark"] .table-responsive {
    background: transparent !important;
}

[data-theme="dark"] .table-responsive .table {
    background: transparent !important;
}

/* Comprehensive table override for dark mode */
[data-theme="dark"] .table.table-light,
[data-theme="dark"] .table-light,
[data-theme="dark"] .table.table-bordered.table-light {
    background: transparent !important;
}

[data-theme="dark"] .table.table-light thead,
[data-theme="dark"] .table-light thead,
[data-theme="dark"] .table.table-bordered.table-light thead {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
}

[data-theme="dark"] .table.table-light tbody,
[data-theme="dark"] .table-light tbody,
[data-theme="dark"] .table.table-bordered.table-light tbody {
    background: transparent !important;
}

[data-theme="dark"] .table.table-light thead tr,
[data-theme="dark"] .table-light thead tr,
[data-theme="dark"] .table.table-bordered.table-light thead tr {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
}

[data-theme="dark"] .table.table-light tbody tr,
[data-theme="dark"] .table-light tbody tr,
[data-theme="dark"] .table.table-bordered.table-light tbody tr {
    background: transparent !important;
}

[data-theme="dark"] .table.table-light thead tr th,
[data-theme="dark"] .table-light thead tr th,
[data-theme="dark"] .table.table-bordered.table-light thead tr th {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .table.table-light tbody tr td,
[data-theme="dark"] .table-light tbody tr td,
[data-theme="dark"] .table.table-bordered.table-light tbody tr td {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

/* Force override for Bootstrap's table-light class */
[data-theme="dark"] .table-light,
[data-theme="dark"] .table.table-light,
[data-theme="dark"] .table.table-bordered.table-light,
[data-theme="dark"] .table.table-sm.table-light {
    background: transparent !important;
}

[data-theme="dark"] .table-light *,
[data-theme="dark"] .table.table-light *,
[data-theme="dark"] .table.table-bordered.table-light *,
[data-theme="dark"] .table.table-sm.table-light * {
    background: inherit !important;
}

/* Nuclear option - override everything in the conjugations table */
[data-theme="dark"] .word-page .table-light,
[data-theme="dark"] .word-page .table.table-light,
[data-theme="dark"] .word-page .table.table-bordered.table-light,
[data-theme="dark"] .word-page .table.table-sm.table-light {
    background: transparent !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .word-page .table-light *,
[data-theme="dark"] .word-page .table.table-light *,
[data-theme="dark"] .word-page .table.table-bordered.table-light *,
[data-theme="dark"] .word-page .table.table-sm.table-light * {
    background: inherit !important;
    color: inherit !important;
}

/* Specific targeting for conjugations table */
[data-theme="dark"] .word-page .table-light thead,
[data-theme="dark"] .word-page .table.table-light thead,
[data-theme="dark"] .word-page .table.table-bordered.table-light thead {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
}

[data-theme="dark"] .word-page .table-light thead th,
[data-theme="dark"] .word-page .table.table-light thead th,
[data-theme="dark"] .word-page .table.table-bordered.table-light thead th {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .word-page .table-light tbody,
[data-theme="dark"] .word-page .table.table-light tbody,
[data-theme="dark"] .word-page .table.table-bordered.table-light tbody {
    background: transparent !important;
}

[data-theme="dark"] .word-page .table-light tbody tr,
[data-theme="dark"] .word-page .table.table-light tbody tr,
[data-theme="dark"] .word-page .table.table-bordered.table-light tbody tr {
    background: transparent !important;
}

[data-theme="dark"] .word-page .table-light tbody tr td,
[data-theme="dark"] .word-page .table.table-light tbody tr td,
[data-theme="dark"] .word-page .table.table-bordered.table-light tbody tr td {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .word-page .table-light tbody tr td strong,
[data-theme="dark"] .word-page .table.table-light tbody tr td strong,
[data-theme="dark"] .word-page .table.table-bordered.table-light tbody tr td strong {
    color: var(--text-primary) !important;
    font-weight: 600;
}

/* Force text visibility in all table elements */
[data-theme="dark"] .word-page .table-light,
[data-theme="dark"] .word-page .table.table-light,
[data-theme="dark"] .word-page .table.table-bordered.table-light {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .word-page .table-light th,
[data-theme="dark"] .word-page .table.table-light th,
[data-theme="dark"] .word-page .table.table-bordered.table-light th {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .word-page .table-light td,
[data-theme="dark"] .word-page .table.table-light td,
[data-theme="dark"] .word-page .table.table-bordered.table-light td {
    color: var(--text-primary) !important;
}

/* Override any Bootstrap text color classes */
[data-theme="dark"] .word-page .table-light .text-dark,
[data-theme="dark"] .word-page .table.table-light .text-dark,
[data-theme="dark"] .word-page .table.table-bordered.table-light .text-dark {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .word-page .table-light .text-muted,
[data-theme="dark"] .word-page .table.table-light .text-muted,
[data-theme="dark"] .word-page .table.table-bordered.table-light .text-muted {
    color: var(--text-secondary) !important;
}

/* Ensure all text in table cells is visible */
[data-theme="dark"] .word-page .table-light tbody tr td *,
[data-theme="dark"] .word-page .table.table-light tbody tr td *,
[data-theme="dark"] .word-page .table.table-bordered.table-light tbody tr td * {
    color: var(--text-primary) !important;
}

/* Specific override for the conjugations section */
[data-theme="dark"] .word-page .mt-3 .table-light,
[data-theme="dark"] .word-page .mt-3 .table.table-light,
[data-theme="dark"] .word-page .mt-3 .table.table-bordered.table-light {
    background: transparent !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .word-page .mt-3 .table-light *,
[data-theme="dark"] .word-page .mt-3 .table.table-light *,
[data-theme="dark"] .word-page .mt-3 .table.table-bordered.table-light * {
    color: var(--text-primary) !important;
}

/* Clean, working Conjugations Table Dark Mode */
[data-theme="dark"] .word-page .mt-3 .table-responsive .table {
    background: transparent !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-light {
    background: transparent !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-bordered {
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .word-page .mt-3 .table-responsive .table thead {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-light thead {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .word-page .mt-3 .table-responsive .table tbody {
    background: transparent !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-light tbody {
    background: transparent !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .word-page .mt-3 .table-responsive .table thead th {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
    font-weight: 600;
}

[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-light thead th {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
    font-weight: 600;
}

[data-theme="dark"] .word-page .mt-3 .table-responsive .table tbody td {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-light tbody td {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

/* Force override Bootstrap's table-light class */
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-light,
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-light * {
    background-color: transparent !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-light thead,
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-light thead * {
    background-color: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
}

/* Override Bootstrap CSS variables */
[data-theme="dark"] .word-page .mt-3 .table-responsive .table {
    --bs-table-bg: transparent !important;
    --bs-table-color: var(--text-primary) !important;
    --bs-table-border-color: var(--border-color) !important;
    --bs-table-striped-bg: transparent !important;
    --bs-table-hover-bg: var(--hover-bg) !important;
}

[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-light {
    --bs-table-bg: transparent !important;
    --bs-table-color: var(--text-primary) !important;
    --bs-table-border-color: var(--border-color) !important;
    --bs-table-striped-bg: transparent !important;
    --bs-table-hover-bg: var(--hover-bg) !important;
}

/* Maximum specificity override for table cells */
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-light tbody tr td,
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-bordered.table-light tbody tr td,
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-sm.table-light tbody tr td {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-light thead tr th,
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-bordered.table-light thead tr th,
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-sm.table-light thead tr th {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

/* Precise Conjugations Table Targeting - Based on DOM Structure */
/* Target the specific conjugations table (5th div in wordDetailContent) */
[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table {
    background: transparent !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table.table-light {
    background: transparent !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table.table-bordered {
    border-color: var(--border-color) !important;
}

/* Target thead specifically */
[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table thead {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table.table-light thead {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

/* Target tbody specifically */
[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table tbody {
    background: transparent !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table.table-light tbody {
    background: transparent !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

/* Target table headers */
[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table thead th {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
    font-weight: 600;
}

[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table.table-light thead th {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
    font-weight: 600;
}

/* Target table cells */
[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table tbody td {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table.table-light tbody td {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

/* Force override Bootstrap's table-light class for this specific table */
[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table.table-light,
[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table.table-light * {
    background-color: transparent !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table.table-light thead,
[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table.table-light thead * {
    background-color: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
}

/* Override Bootstrap CSS variables for this specific table */
[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table {
    --bs-table-bg: transparent !important;
    --bs-table-color: var(--text-primary) !important;
    --bs-table-border-color: var(--border-color) !important;
    --bs-table-striped-bg: transparent !important;
    --bs-table-hover-bg: var(--hover-bg) !important;
}

[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table.table-light {
    --bs-table-bg: transparent !important;
    --bs-table-color: var(--text-primary) !important;
    --bs-table-border-color: var(--border-color) !important;
    --bs-table-striped-bg: transparent !important;
    --bs-table-hover-bg: var(--hover-bg) !important;
}

/* Maximum specificity override for table cells in this specific table */
[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table.table-light tbody tr td,
[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table.table-bordered.table-light tbody tr td,
[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table.table-sm.table-light tbody tr td {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table.table-light thead tr th,
[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table.table-bordered.table-light thead tr th,
[data-theme="dark"] #wordDetailContent .mt-3:nth-child(5) .table-responsive .table.table-sm.table-light thead tr th {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

/* Force override for all table elements in conjugations section */
[data-theme="dark"] .word-page .mt-3 .table-responsive .table,
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-light,
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-bordered.table-light {
    background: transparent !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .word-page .mt-3 .table-responsive .table thead,
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-light thead,
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-bordered.table-light thead {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
}

[data-theme="dark"] .word-page .mt-3 .table-responsive .table tbody,
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-light tbody,
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-bordered.table-light tbody {
    background: transparent !important;
}

[data-theme="dark"] .word-page .mt-3 .table-responsive .table thead th,
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-light thead th,
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-bordered.table-light thead th {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .word-page .mt-3 .table-responsive .table tbody td,
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-light tbody td,
[data-theme="dark"] .word-page .mt-3 .table-responsive .table.table-bordered.table-light tbody td {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}

/* Pronunciation Practice Dark Mode Styling */
[data-theme="dark"] .pronunciation-practice {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] .practice-header {
    border-bottom-color: var(--border-color) !important;
}

[data-theme="dark"] .practice-header h3 {
    color: var(--text-primary) !important;
}

/* Recording Section Dark Mode */
[data-theme="dark"] .recording-section {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .recording-section h4 {
    color: var(--text-primary) !important;
}

/* Practice Cards Dark Mode */
[data-theme="dark"] .practice-card {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .practice-card-header {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-bottom-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-card-body {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
}

/* Practice Input Fields Dark Mode */
[data-theme="dark"] .practice-input {
    background-color: var(--bg-tertiary) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-input:focus {
    background-color: var(--bg-tertiary) !important;
    border-color: var(--primary-color) !important;
    color: var(--text-primary) !important;
    box-shadow: 0 0 0 0.25rem rgba(102, 179, 255, 0.25) !important;
}

/* Practice Feedback Dark Mode */
[data-theme="dark"] .practice-feedback {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-feedback.correct {
    border-left-color: var(--success-color) !important;
    background: linear-gradient(135deg, rgba(40, 167, 69, 0.1), rgba(40, 167, 69, 0.05)) !important;
}

[data-theme="dark"] .practice-feedback.incorrect {
    border-left-color: var(--danger-color) !important;
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.1), rgba(220, 53, 69, 0.05)) !important;
}

/* Practice Results Dark Mode */
[data-theme="dark"] .practice-results {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-results h5 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-results p {
    color: var(--text-secondary) !important;
}

/* Practice Statistics Dark Mode */
[data-theme="dark"] .practice-stats {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-stats h6 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-stats .stat-value {
    color: var(--primary-color) !important;
}

[data-theme="dark"] .practice-stats .stat-label {
    color: var(--text-secondary) !important;
}

/* Practice Progress Dark Mode */
[data-theme="dark"] .practice-progress {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .practice-progress-bar {
    background: linear-gradient(135deg, var(--primary-color), var(--link-color)) !important;
}

/* Practice Navigation Dark Mode */
[data-theme="dark"] .practice-navigation {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-navigation button {
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-navigation button:hover {
    background-color: var(--hover-bg) !important;
    color: var(--text-primary) !important;
}

/* Practice Timer Dark Mode */
[data-theme="dark"] .practice-timer {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-timer .time-display {
    color: var(--primary-color) !important;
}

/* Practice Instructions Dark Mode */
[data-theme="dark"] .practice-instructions {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-instructions h6 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-instructions p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .practice-instructions ul {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .practice-instructions li {
    color: var(--text-secondary) !important;
}

/* Pronunciation Comparison Dark Mode Styling */
[data-theme="dark"] .comparison-section {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .comparison-section h4 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .comparison-content {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .comparison-content audio {
    background: var(--bg-tertiary) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .comparison-feedback {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

/* AI Analysis Results Dark Mode */
[data-theme="dark"] .ai-analysis-results {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--primary-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .ai-analysis-results h5 {
    color: var(--primary-color) !important;
}

/* Score Overview Dark Mode */
[data-theme="dark"] .score-overview {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .overall-score {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .score-label {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .score-value {
    color: var(--primary-color) !important;
}

[data-theme="dark"] .score-grade {
    color: var(--success-color) !important;
    background: linear-gradient(135deg, rgba(40, 167, 69, 0.1), rgba(40, 167, 69, 0.05)) !important;
    border-color: var(--success-color) !important;
}

/* Detailed Scores Dark Mode */
[data-theme="dark"] .score-item {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .score-name {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .score-bar {
    background: var(--bg-tertiary) !important;
}

[data-theme="dark"] .score-fill {
    background: linear-gradient(135deg, var(--primary-color), var(--link-color)) !important;
}

/* Comparison Controls Dark Mode */
[data-theme="dark"] .comparison-controls {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .comparison-controls button {
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .comparison-controls button:hover {
    background-color: var(--hover-bg) !important;
    color: var(--text-primary) !important;
}

/* Comparison Metrics Dark Mode */
[data-theme="dark"] .comparison-metrics {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .comparison-metrics h6 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .comparison-metrics .metric-value {
    color: var(--primary-color) !important;
}

[data-theme="dark"] .comparison-metrics .metric-label {
    color: var(--text-secondary) !important;
}

/* Comparison Visualization Dark Mode */
[data-theme="dark"] .comparison-visualization {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .comparison-chart {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
}

[data-theme="dark"] .comparison-chart canvas {
    background: transparent !important;
}

/* Comparison History Dark Mode */
[data-theme="dark"] .comparison-history {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .comparison-history h6 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .comparison-history .history-item {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .comparison-history .history-date {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .comparison-history .history-score {
    color: var(--primary-color) !important;
}

/* Comparison Tips Dark Mode */
[data-theme="dark"] .comparison-tips {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .comparison-tips h6 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .comparison-tips .tip-item {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .comparison-tips .tip-icon {
    color: var(--primary-color) !important;
}

/* Practice Feedback Dark Mode Styling */
[data-theme="dark"] .practice-feedback-section {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-feedback-section h4 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-feedback-section h5 {
    color: var(--text-primary) !important;
}

/* Feedback Tips and Instructions Dark Mode */
[data-theme="dark"] .feedback-tips {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-tips h6 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-tips .tip-item {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
    padding: 1rem;
    border-radius: 8px;
    margin-bottom: 0.75rem;
}

[data-theme="dark"] .feedback-tips .tip-icon {
    color: var(--primary-color) !important;
    margin-right: 0.5rem;
}

/* Feedback Instructions Dark Mode */
[data-theme="dark"] .feedback-instructions {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-instructions h6 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-instructions p {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .feedback-instructions ul {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .feedback-instructions li {
    color: var(--text-secondary) !important;
    margin-bottom: 0.5rem;
}

/* Feedback Actions Dark Mode */
[data-theme="dark"] .feedback-actions {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-actions button {
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-actions button:hover {
    background-color: var(--hover-bg) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-actions .btn-primary {
    background: linear-gradient(135deg, var(--primary-color), var(--link-color)) !important;
    border-color: var(--primary-color) !important;
    color: var(--text-light) !important;
}

[data-theme="dark"] .feedback-actions .btn-primary:hover {
    background: linear-gradient(135deg, var(--link-color), var(--primary-color)) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(102, 179, 255, 0.4);
}

/* Feedback Progress Dark Mode */
[data-theme="dark"] .feedback-progress {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-progress h6 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-progress .progress-item {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
    padding: 0.75rem;
    border-radius: 6px;
    margin-bottom: 0.5rem;
}

[data-theme="dark"] .feedback-progress .progress-label {
    color: var(--text-primary) !important;
    font-weight: 600;
}

[data-theme="dark"] .feedback-progress .progress-value {
    color: var(--primary-color) !important;
    font-weight: 700;
}

/* Feedback Summary Dark Mode */
[data-theme="dark"] .feedback-summary {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-summary h6 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-summary .summary-item {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
    padding: 0.75rem;
    border-radius: 6px;
    margin-bottom: 0.5rem;
}

[data-theme="dark"] .feedback-summary .summary-label {
    color: var(--text-primary) !important;
    font-weight: 600;
}

[data-theme="dark"] .feedback-summary .summary-value {
    color: var(--primary-color) !important;
    font-weight: 700;
}

/* Feedback Help Dark Mode */
[data-theme="dark"] .feedback-help {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-help h6 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-help .help-text {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .feedback-help .help-link {
    color: var(--link-color) !important;
}

[data-theme="dark"] .feedback-help .help-link:hover {
    color: var(--link-hover) !important;
    text-decoration: underline;
}

/* Additional Practice Feedback Elements Dark Mode */
[data-theme="dark"] .feedback-suggestions {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-suggestions h6 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-suggestions .suggestion-item {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
    padding: 0.75rem;
    border-radius: 6px;
    margin-bottom: 0.5rem;
}

[data-theme="dark"] .feedback-suggestions .suggestion-icon {
    color: var(--primary-color) !important;
    margin-right: 0.5rem;
}

/* Generating Feedback Dark Mode */
[data-theme="dark"] .generating-feedback {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .generating-feedback .loading-text {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .generating-feedback .spinner {
    color: var(--primary-color) !important;
}

/* AI Analysis Results Dark Mode - Additional Styling */
[data-theme="dark"] .ai-analysis-results {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--primary-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .ai-analysis-results h5 {
    color: var(--primary-color) !important;
}

[data-theme="dark"] .ai-analysis-results .ai-feedback {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .ai-analysis-results .ai-feedback h6 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .ai-analysis-results .feedback-list {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .ai-analysis-results .feedback-item {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
    padding: 0.75rem;
    border-radius: 6px;
    margin-bottom: 0.5rem;
}

/* AI Analysis Controls Dark Mode */
[data-theme="dark"] .ai-analysis-controls {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .ai-analysis-controls .analyze-btn {
    background: linear-gradient(135deg, var(--primary-color), var(--link-color)) !important;
    border-color: var(--primary-color) !important;
    color: var(--text-light) !important;
}

[data-theme="dark"] .ai-analysis-controls .analyze-btn:hover {
    background: linear-gradient(135deg, var(--link-color), var(--primary-color)) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(102, 179, 255, 0.4);
}

/* Analysis Progress Dark Mode */
[data-theme="dark"] .analysis-progress {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .analysis-progress .progress-header {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .analysis-progress .progress-text {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .analysis-progress .progress-bar {
    background: var(--bg-tertiary) !important;
}

[data-theme="dark"] .analysis-progress .progress-fill {
    background: linear-gradient(135deg, var(--primary-color), var(--link-color)) !important;
}

/* Feedback Content Dark Mode */
[data-theme="dark"] .feedback-content {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-content h5 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-content .feedback-summary {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .feedback-content .feedback-score {
    color: var(--primary-color) !important;
    font-weight: 600;
}

[data-theme="dark"] .feedback-content .feedback-transcription {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .feedback-content .feedback-tips {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .feedback-content .feedback-tip {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-secondary) !important;
    padding: 0.75rem;
    border-radius: 6px;
    margin-bottom: 0.5rem;
}

/* Comparison Feedback Dark Mode */
[data-theme="dark"] .comparison-feedback {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .comparison-feedback h6 {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .comparison-feedback p {
    color: var(--text-secondary) !important;
}

/* Score Percentage Dark Mode */
[data-theme="dark"] .score-percentage {
    color: var(--primary-color) !important;
    font-weight: 600;
}

/* Detailed Scores Grid Dark Mode */
[data-theme="dark"] .detailed-scores {
    background: transparent !important;
}

[data-theme="dark"] .detailed-scores .score-item {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .detailed-scores .score-name {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .detailed-scores .score-bar {
    background: var(--bg-tertiary) !important;
}

[data-theme="dark"] .detailed-scores .score-fill {
    background: linear-gradient(135deg, var(--primary-color), var(--link-color)) !important;
}

/* Additional table styling for better dark mode appearance */
[data-theme="dark"] .table.table-light {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .table.table-light thead {
    border-bottom: 2px solid var(--border-color);
}

[data-theme="dark"] .table.table-light thead th {
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 1rem 0.75rem;
    border-bottom: 2px solid var(--border-color);
}

[data-theme="dark"] .table.table-light tbody td {
    padding: 0.75rem;
    vertical-align: middle;
    border-bottom: 1px solid var(--border-color);
}

[data-theme="dark"] .table.table-light tbody tr:last-child td {
    border-bottom: none;
}

[data-theme="dark"] .table.table-light tbody tr:hover td {
    background: linear-gradient(135deg, var(--hover-bg), var(--hover-bg-light)) !important;
    transform: scale(1.01);
    transition: all 0.2s ease;
}

/* Ensure strong elements in table cells are visible */
[data-theme="dark"] .table.table-light tbody td strong,
[data-theme="dark"] .table.table-light tbody td b {
    color: var(--text-primary) !important;
    font-weight: 600;
}

/* Table caption styling if present */
[data-theme="dark"] .table.table-light caption {
    color: var(--text-secondary) !important;
    font-style: italic;
    padding: 0.5rem;
}

/* Additional Word Page Elements Dark Mode */
[data-theme="dark"] .word-page .word-title {
    color: var(--text-primary) !important;
}

[data-theme="dark"] .word-page .word-definition {
    color: var(--text-secondary) !important;
}

[data-theme="dark"] .word-page .word-examples {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-left: 3px solid var(--primary-color) !important;
}

[data-theme="dark"] .word-page .example-item {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .word-page .word-part-of-speech {
    background: linear-gradient(135deg, var(--bg-tertiary), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
    border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] #wordImageContainer .text-muted {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border: 2px dashed var(--border-color) !important;
    color: var(--text-muted) !important;
}

/* Search Highlight Dark Mode */
[data-theme="dark"] .search-highlight {
    background: linear-gradient(135deg, var(--warning-color), #f0ad4e) !important;
    color: var(--text-dark) !important;
}

/* Pronunciation Practice Dark Mode */
[data-theme="dark"] .pronunciation-practice {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
}

[data-theme="dark"] .practice-card {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-card-header {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border-bottom: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-card-body {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-input {
    background-color: var(--bg-tertiary) !important;
    border-color: var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-input:focus {
    background-color: var(--bg-tertiary) !important;
    border-color: var(--primary-color) !important;
    color: var(--text-primary) !important;
    box-shadow: 0 0 0 0.25rem rgba(102, 179, 255, 0.25) !important;
}

[data-theme="dark"] .practice-feedback {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .practice-feedback.correct {
    border-left: 4px solid var(--success-color) !important;
    background: linear-gradient(135deg, rgba(40, 167, 69, 0.1), rgba(40, 167, 69, 0.05)) !important;
}

[data-theme="dark"] .practice-feedback.incorrect {
    border-left: 4px solid var(--danger-color) !important;
    background: linear-gradient(135deg, rgba(220, 53, 69, 0.1), rgba(220, 53, 69, 0.05)) !important;
}

/* Enhanced Audio Player Dark Mode */
[data-theme="dark"] .audio-player-container {
    background: linear-gradient(135deg, var(--bg-card), var(--bg-secondary)) !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-primary) !important;
}

[data-theme="dark"] .audio-controls {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary)) !important;
    border: 1px solid var(--border-color) !important;
}

[data-theme="dark"] .audio-progress {
    background: var(--bg-tertiary) !important;
}

[data-theme="dark"] .audio-progress::-webkit-slider-thumb {
    background: var(--primary-color) !important;
}

[data-theme="dark"] .audio-progress::-moz-range-thumb {
    background: var(--primary-color) !important;
}

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

/* Dark Mode Focus Indicators */
[data-theme="dark"] *:focus {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}

/* Dark Mode Selection */
[data-theme="dark"] ::selection {
    background: var(--primary-color);
    color: var(--text-light);
}

[data-theme="dark"] ::-moz-selection {
    background: var(--primary-color);
    color: var(--text-light);
}

/* Dark Mode Scrollbar */
[data-theme="dark"] ::-webkit-scrollbar {
    width: 14px;
}

[data-theme="dark"] ::-webkit-scrollbar-track {
    background: var(--bg-secondary);
    border-radius: 7px;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, var(--border-color), var(--border-dark));
    border-radius: 7px;
    border: 2px solid var(--bg-secondary);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, var(--primary-color), var(--link-color));
}

/* Dark Mode Tooltips */
[data-theme="dark"] .tooltip {
    background: var(--bg-card);
    color: var(--text-primary);
    border: 1px solid var(--border-color);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(10px);
}

/* Dark Mode Code Blocks */
[data-theme="dark"] pre {
    background: linear-gradient(135deg, var(--code-bg), var(--bg-tertiary));
    border: 1px solid var(--border-color);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] code {
    background: var(--code-bg);
    color: var(--code-text);
    padding: 0.2em 0.4em;
    border-radius: 4px;
    border: 1px solid var(--border-color);
}

/* Dark Mode Blockquotes */
[data-theme="dark"] blockquote {
    background: linear-gradient(135deg, var(--bg-secondary), var(--bg-tertiary));
    border-left: 4px solid var(--primary-color);
    padding: 1rem;
    margin: 1rem 0;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

/* Dark Mode Links */
[data-theme="dark"] a:not(.btn) {
    position: relative;
    transition: all 0.3s ease;
}

[data-theme="dark"] a:not(.btn):hover {
    color: var(--link-hover);
    text-shadow: 0 0 8px rgba(102, 179, 255, 0.3);
}

[data-theme="dark"] a:not(.btn)::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--primary-color), var(--link-color));
    transition: width 0.3s ease;
}

[data-theme="dark"] a:not(.btn):hover::after {
    width: 100%;
}