/* ========== DARK MODE THEME ========== */
/* Covers: layouts, inline styles, auth pages, all views */

/* ===================================================================
   THEME TOGGLE BUTTON
   =================================================================== */
.theme-toggle {
    background: none;
    border: 1px solid rgba(128, 128, 128, 0.3);
    cursor: pointer;
    width: 40px;
    height: 40px;
    border-radius: 0.625rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
}

.theme-toggle .icon-sun,
.theme-toggle .icon-moon {
    position: absolute;
    transition: all 0.3s ease;
}

.theme-toggle .icon-sun {
    opacity: 0;
    transform: rotate(-90deg) scale(0);
}

.theme-toggle .icon-moon {
    opacity: 1;
    transform: rotate(0) scale(1);
}

/* Dark header (public app.blade.php) */
.header .theme-toggle {
    color: rgba(255,255,255,0.9);
    border-color: rgba(255,255,255,0.2);
}

.header .theme-toggle:hover {
    background: rgba(255,255,255,0.15);
    border-color: rgba(255,255,255,0.3);
}

/* Light header (admin, professor, participant) */
.admin-header .theme-toggle,
.professor-header .theme-toggle,
.participant-header .theme-toggle {
    color: #6b7280;
    border-color: #e5e7eb;
}

.admin-header .theme-toggle:hover,
.professor-header .theme-toggle:hover,
.participant-header .theme-toggle:hover {
    background: #f3f4f6;
    color: #374151;
    border-color: #d1d5db;
}

/* ===================================================================
   DARK MODE — ICON SWAP
   =================================================================== */
[data-theme="dark"] .theme-toggle .icon-sun {
    opacity: 1;
    transform: rotate(0) scale(1);
}

[data-theme="dark"] .theme-toggle .icon-moon {
    opacity: 0;
    transform: rotate(90deg) scale(0);
}

/* ===================================================================
   DARK MODE — BODY & ROOT
   =================================================================== */
[data-theme="dark"] body {
    background: #0f172a !important;
    color: #e2e8f0 !important;
}

/* ===================================================================
   DARK MODE — PUBLIC LAYOUT (app.blade.php)
   =================================================================== */
[data-theme="dark"] .header {
    background: linear-gradient(135deg, #0f172a 0%, #020617 100%) !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.4);
}

[data-theme="dark"] .mobile-nav {
    background: linear-gradient(180deg, #0f172a 0%, #020617 100%) !important;
}

[data-theme="dark"] .dropdown-menu {
    background: #1e293b !important;
    box-shadow: 0 10px 40px rgba(0,0,0,0.5) !important;
}

[data-theme="dark"] .dropdown-menu a,
[data-theme="dark"] .dropdown-menu button {
    color: #cbd5e1 !important;
}

[data-theme="dark"] .dropdown-menu a:hover,
[data-theme="dark"] .dropdown-menu button:hover {
    background: #334155 !important;
}

[data-theme="dark"] .dropdown-menu button {
    border-top-color: #334155 !important;
}

[data-theme="dark"] .footer {
    background: linear-gradient(135deg, #020617 0%, #0f172a 100%) !important;
}

/* ===================================================================
   DARK MODE — ADMIN LAYOUT
   =================================================================== */
[data-theme="dark"] .admin-sidebar {
    background: linear-gradient(180deg, #0f172a 0%, #020617 100%) !important;
    box-shadow: 4px 0 20px rgba(0,0,0,0.4);
}

[data-theme="dark"] .sidebar-header {
    background: linear-gradient(180deg, #0f172a 0%, #020617 100%) !important;
}

[data-theme="dark"] .admin-header {
    background: #1e293b !important;
    border-bottom-color: #334155 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}

[data-theme="dark"] .admin-header-left h2 {
    color: #f1f5f9 !important;
}

[data-theme="dark"] .language-btn {
    background: #334155 !important;
    color: #cbd5e1 !important;
}

[data-theme="dark"] .language-btn:hover {
    background: #475569 !important;
}

[data-theme="dark"] .language-menu {
    background: #1e293b !important;
    box-shadow: 0 10px 40px rgba(0,0,0,0.5) !important;
}

[data-theme="dark"] .language-menu a {
    color: #cbd5e1 !important;
}

[data-theme="dark"] .language-menu a:hover {
    background: #334155 !important;
}

[data-theme="dark"] .admin-user-menu {
    background: #1e293b !important;
    box-shadow: 0 10px 40px rgba(0,0,0,0.5) !important;
}

[data-theme="dark"] .admin-user-menu a,
[data-theme="dark"] .admin-user-menu button {
    color: #cbd5e1 !important;
}

[data-theme="dark"] .admin-user-menu a:hover,
[data-theme="dark"] .admin-user-menu button:hover {
    background: #334155 !important;
}

[data-theme="dark"] .admin-user-menu button {
    border-top-color: #334155 !important;
}

[data-theme="dark"] .admin-content {
    background: #0f172a !important;
}

/* ===================================================================
   DARK MODE — PROFESSOR LAYOUT
   =================================================================== */
[data-theme="dark"] .professor-sidebar {
    background: linear-gradient(180deg, #0f172a 0%, #020617 100%) !important;
    box-shadow: 4px 0 20px rgba(0,0,0,0.4);
}

[data-theme="dark"] .professor-header {
    background: #1e293b !important;
    border-bottom-color: #334155 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}

[data-theme="dark"] .professor-header h2 {
    color: #f1f5f9 !important;
}

[data-theme="dark"] .professor-user span {
    color: #cbd5e1 !important;
}

[data-theme="dark"] .professor-content {
    background: #0f172a !important;
}

/* ===================================================================
   DARK MODE — PARTICIPANT LAYOUT
   =================================================================== */
[data-theme="dark"] .participant-header {
    background: #1e293b !important;
    border-bottom-color: #334155 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}

[data-theme="dark"] .logo-text {
    color: #f1f5f9 !important;
}

[data-theme="dark"] .public-nav a {
    color: #94a3b8 !important;
}

[data-theme="dark"] .public-nav a:hover {
    color: #f1f5f9 !important;
}

[data-theme="dark"] .lang-toggle {
    color: #94a3b8 !important;
    border-color: #334155 !important;
    background: #334155 !important;
}

[data-theme="dark"] .lang-toggle:hover {
    background: #475569 !important;
    color: #f1f5f9 !important;
}

[data-theme="dark"] .lang-menu {
    background: #1e293b !important;
    box-shadow: 0 10px 40px rgba(0,0,0,0.5) !important;
}

[data-theme="dark"] .lang-menu a {
    color: #cbd5e1 !important;
}

[data-theme="dark"] .lang-menu a:hover {
    background: #334155 !important;
}

[data-theme="dark"] .participant-sidebar {
    background: #1e293b !important;
    box-shadow: 4px 0 30px rgba(0,0,0,0.4);
}

[data-theme="dark"] .sidebar-overlay {
    background: rgba(0,0,0,0.6) !important;
}

[data-theme="dark"] .user-button {
    background: #334155 !important;
    border-color: #475569 !important;
    color: #e2e8f0 !important;
}

[data-theme="dark"] .user-button:hover {
    background: #475569 !important;
}

[data-theme="dark"] .user-name {
    color: #f1f5f9 !important;
}

[data-theme="dark"] .user-dropdown {
    background: #1e293b !important;
    box-shadow: 0 10px 40px rgba(0,0,0,0.5) !important;
}

[data-theme="dark"] .dropdown-item {
    color: #cbd5e1 !important;
    border-bottom-color: #334155 !important;
}

[data-theme="dark"] .dropdown-item:hover {
    background: #334155 !important;
}

[data-theme="dark"] .cart-icon {
    color: #cbd5e1 !important;
}

/* ===================================================================
   DARK MODE — CARDS (CSS class-based)
   =================================================================== */
[data-theme="dark"] .card {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3) !important;
}

[data-theme="dark"] .card-header {
    background: linear-gradient(135deg, #1e293b 0%, #253349 100%) !important;
    border-bottom-color: #334155 !important;
    color: #f1f5f9 !important;
}

[data-theme="dark"] .stat-card,
[data-theme="dark"] .stats-card,
[data-theme="dark"] .seminar-card,
[data-theme="dark"] .news-card,
[data-theme="dark"] .info-card,
[data-theme="dark"] .review-card,
[data-theme="dark"] .partner-card,
[data-theme="dark"] .conference-card,
[data-theme="dark"] .certificate-card,
[data-theme="dark"] .payment-card {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3) !important;
}

/* ===================================================================
   DARK MODE — INLINE STYLE OVERRIDES (background)
   Covers: background: white, #fff, #ffffff, #f9fafb, #f3f4f6, #f8fafc
   Applied to: div, section, article, main, aside, header, footer, form, a, span
   =================================================================== */

/* background: white */
[data-theme="dark"] div[style*="background: white"],
[data-theme="dark"] div[style*="background:white"],
[data-theme="dark"] section[style*="background: white"],
[data-theme="dark"] article[style*="background: white"],
[data-theme="dark"] main[style*="background: white"],
[data-theme="dark"] aside[style*="background: white"],
[data-theme="dark"] form[style*="background: white"],
[data-theme="dark"] a[style*="background: white"],
[data-theme="dark"] span[style*="background: white"],
[data-theme="dark"] header[style*="background: white"] {
    background: #1e293b !important;
    color: #e2e8f0 !important;
}

/* background: #fff / #ffffff */
[data-theme="dark"] div[style*="background: #fff"],
[data-theme="dark"] div[style*="background:#fff"],
[data-theme="dark"] section[style*="background: #fff"],
[data-theme="dark"] article[style*="background: #fff"] {
    background: #1e293b !important;
    color: #e2e8f0 !important;
}

/* background: #f9fafb */
[data-theme="dark"] div[style*="background: #f9fafb"],
[data-theme="dark"] div[style*="background:#f9fafb"],
[data-theme="dark"] section[style*="background: #f9fafb"],
[data-theme="dark"] article[style*="background: #f9fafb"],
[data-theme="dark"] a[style*="background: #f9fafb"],
[data-theme="dark"] a[style*="background:#f9fafb"] {
    background: #0f172a !important;
}

/* background: #f3f4f6 */
[data-theme="dark"] div[style*="background: #f3f4f6"],
[data-theme="dark"] div[style*="background:#f3f4f6"],
[data-theme="dark"] section[style*="background: #f3f4f6"],
[data-theme="dark"] article[style*="background: #f3f4f6"],
[data-theme="dark"] label[style*="background: #f3f4f6"],
[data-theme="dark"] button[style*="background: #f3f4f6"],
[data-theme="dark"] button[style*="background:#f3f4f6"] {
    background: #1e293b !important;
}

/* background: #f8fafc */
[data-theme="dark"] div[style*="background: #f8fafc"],
[data-theme="dark"] section[style*="background: #f8fafc"] {
    background: #0f172a !important;
}

/* background: #e5e7eb (used for buttons like back/cancel) */
[data-theme="dark"] a[style*="background: #e5e7eb"],
[data-theme="dark"] button[style*="background: #e5e7eb"] {
    background: #334155 !important;
    color: #cbd5e1 !important;
}

/* background: #dbeafe (light blue info boxes, buttons) */
[data-theme="dark"] [style*="background: #dbeafe"],
[data-theme="dark"] [style*="background:#dbeafe"] {
    background: rgba(59, 130, 246, 0.15) !important;
}

/* background: #bfdbfe (light blue hover) */
[data-theme="dark"] [style*="background: #bfdbfe"],
[data-theme="dark"] [style*="background:#bfdbfe"] {
    background: rgba(59, 130, 246, 0.25) !important;
}

/* color: #1e40af (dark blue text on info boxes) */
[data-theme="dark"] [style*="color: #1e40af"],
[data-theme="dark"] [style*="color:#1e40af"] {
    color: #93c5fd !important;
}

/* color: #92400e (dark amber text on warning badges) */
[data-theme="dark"] [style*="color: #92400e"],
[data-theme="dark"] [style*="color:#92400e"] {
    color: #fbbf24 !important;
}

/* color: #065f46 (dark green text on success badges) */
[data-theme="dark"] [style*="color: #065f46"],
[data-theme="dark"] [style*="color:#065f46"] {
    color: #4ade80 !important;
}

/* background: #d1fae5 (success badge bg) */
[data-theme="dark"] [style*="background: #d1fae5"],
[data-theme="dark"] [style*="background:#d1fae5"] {
    background: rgba(34, 197, 94, 0.15) !important;
}

/* background: #fef3c7 (warning badge bg) */
[data-theme="dark"] [style*="background: #fef3c7"],
[data-theme="dark"] [style*="background:#fef3c7"] {
    background: rgba(245, 158, 11, 0.15) !important;
}

/* ===================================================================
   DARK MODE — INLINE STYLE OVERRIDES (text colors)
   =================================================================== */

/* color: #111827 */
[data-theme="dark"] [style*="color: #111827"],
[data-theme="dark"] [style*="color:#111827"] {
    color: #f1f5f9 !important;
}

/* color: #1f2937 */
[data-theme="dark"] [style*="color: #1f2937"],
[data-theme="dark"] [style*="color:#1f2937"] {
    color: #e2e8f0 !important;
}

/* color: #374151 */
[data-theme="dark"] [style*="color: #374151"],
[data-theme="dark"] [style*="color:#374151"] {
    color: #cbd5e1 !important;
}

/* color: #4b5563 */
[data-theme="dark"] [style*="color: #4b5563"],
[data-theme="dark"] [style*="color:#4b5563"] {
    color: #94a3b8 !important;
}

/* color: #6b7280 */
[data-theme="dark"] [style*="color: #6b7280"],
[data-theme="dark"] [style*="color:#6b7280"] {
    color: #94a3b8 !important;
}

/* color: #9ca3af */
[data-theme="dark"] [style*="color: #9ca3af"],
[data-theme="dark"] [style*="color:#9ca3af"] {
    color: #64748b !important;
}

/* ===================================================================
   DARK MODE — INLINE STYLE OVERRIDES (borders)
   =================================================================== */

/* border with #e5e7eb */
[data-theme="dark"] [style*="border: 1px solid #e5e7eb"],
[data-theme="dark"] [style*="border:1px solid #e5e7eb"],
[data-theme="dark"] [style*="border: 2px solid #e5e7eb"],
[data-theme="dark"] [style*="border:2px solid #e5e7eb"],
[data-theme="dark"] [style*="border: 3px solid #e5e7eb"],
[data-theme="dark"] [style*="border: 2px dashed #e5e7eb"],
[data-theme="dark"] [style*="border-bottom: 1px solid #e5e7eb"],
[data-theme="dark"] [style*="border-bottom: 2px solid #e5e7eb"],
[data-theme="dark"] [style*="border-top: 1px solid #e5e7eb"],
[data-theme="dark"] [style*="border-top: 2px solid #e5e7eb"],
[data-theme="dark"] [style*="border-right: 2px solid #e5e7eb"] {
    border-color: #334155 !important;
}

/* border with #d1d5db */
[data-theme="dark"] [style*="border: 1px solid #d1d5db"],
[data-theme="dark"] [style*="border:1px solid #d1d5db"],
[data-theme="dark"] [style*="border: 2px solid #d1d5db"],
[data-theme="dark"] [style*="border: 3px solid #d1d5db"],
[data-theme="dark"] [style*="border: 3px dashed #d1d5db"],
[data-theme="dark"] [style*="border: 2px dashed #d1d5db"] {
    border-color: #475569 !important;
}

/* ===================================================================
   DARK MODE — TABLES
   =================================================================== */
[data-theme="dark"] table {
    color: #e2e8f0 !important;
}

[data-theme="dark"] thead,
[data-theme="dark"] th {
    background: #1e293b !important;
    color: #94a3b8 !important;
    border-color: #334155 !important;
}

[data-theme="dark"] td {
    border-color: #334155 !important;
    color: #cbd5e1 !important;
}

[data-theme="dark"] tr:hover td {
    background: #1e293b !important;
}

[data-theme="dark"] .table,
[data-theme="dark"] table {
    border-color: #334155 !important;
}

[data-theme="dark"] tbody tr:nth-child(even) {
    background: rgba(30, 41, 59, 0.5) !important;
}

/* ===================================================================
   DARK MODE — FORMS
   =================================================================== */
[data-theme="dark"] input,
[data-theme="dark"] textarea,
[data-theme="dark"] select,
[data-theme="dark"] .form-control {
    background: #0f172a !important;
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}

[data-theme="dark"] input:focus,
[data-theme="dark"] textarea:focus,
[data-theme="dark"] select:focus,
[data-theme="dark"] .form-control:focus {
    border-color: #667eea !important;
    background: #1e293b !important;
    color: #f1f5f9 !important;
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
    color: #64748b !important;
}

[data-theme="dark"] label,
[data-theme="dark"] .form-label {
    color: #cbd5e1 !important;
}

[data-theme="dark"] input[disabled],
[data-theme="dark"] input[readonly],
[data-theme="dark"] textarea[disabled],
[data-theme="dark"] select[disabled] {
    background: #1e293b !important;
    color: #64748b !important;
}

[data-theme="dark"] option {
    background: #1e293b;
    color: #e2e8f0;
}

/* ===================================================================
   DARK MODE — ALERTS
   =================================================================== */
[data-theme="dark"] .alert {
    border-color: #334155 !important;
}

[data-theme="dark"] .alert-success {
    background: rgba(34, 197, 94, 0.15) !important;
    color: #4ade80 !important;
    border-color: rgba(34, 197, 94, 0.3) !important;
}

[data-theme="dark"] .alert-danger {
    background: rgba(239, 68, 68, 0.15) !important;
    color: #f87171 !important;
    border-color: rgba(239, 68, 68, 0.3) !important;
}

[data-theme="dark"] .alert-info {
    background: rgba(59, 130, 246, 0.15) !important;
    color: #60a5fa !important;
    border-color: rgba(59, 130, 246, 0.3) !important;
}

[data-theme="dark"] .alert-warning {
    background: rgba(245, 158, 11, 0.15) !important;
    color: #fbbf24 !important;
    border-color: rgba(245, 158, 11, 0.3) !important;
}

/* ===================================================================
   DARK MODE — TEXT ELEMENTS
   =================================================================== */
[data-theme="dark"] h1, [data-theme="dark"] h2, [data-theme="dark"] h3,
[data-theme="dark"] h4, [data-theme="dark"] h5, [data-theme="dark"] h6 {
    color: #f1f5f9 !important;
}

[data-theme="dark"] p {
    color: #cbd5e1 !important;
}

[data-theme="dark"] a:not(.btn):not([style*="background: linear-gradient"]):not([style*="background: #667eea"]):not([style*="background:#667eea"]) {
    color: #93c5fd;
}

[data-theme="dark"] small,
[data-theme="dark"] .text-muted {
    color: #64748b !important;
}

[data-theme="dark"] strong {
    color: #f1f5f9;
}

/* ===================================================================
   DARK MODE — AUTH PAGES (login.blade.php, register.blade.php)
   =================================================================== */
[data-theme="dark"] .auth-container {
    background: #1e293b !important;
}

[data-theme="dark"] .auth-logo {
    background: #1e293b !important;
}

[data-theme="dark"] .auth-right h2 {
    color: #f1f5f9 !important;
}

[data-theme="dark"] .btn-google {
    background: #334155 !important;
    color: #cbd5e1 !important;
    border-color: #475569 !important;
}

[data-theme="dark"] .btn-google:hover {
    background: #475569 !important;
}

[data-theme="dark"] .divider::before,
[data-theme="dark"] .divider::after {
    background: #334155 !important;
}

[data-theme="dark"] .role-card {
    border-color: #334155 !important;
    background: #0f172a !important;
}

[data-theme="dark"] .role-card:hover {
    background: #1e293b !important;
}

[data-theme="dark"] .role-card.selected {
    border-color: #667eea !important;
    background: rgba(102, 126, 234, 0.1) !important;
}

[data-theme="dark"] .role-title {
    color: #f1f5f9 !important;
}

/* ===================================================================
   DARK MODE — MODALS
   =================================================================== */
[data-theme="dark"] .modal-dialog {
    background: #1e293b !important;
    color: #e2e8f0 !important;
}

[data-theme="dark"] .modal-header {
    background: linear-gradient(135deg, #1e293b 0%, #253349 100%) !important;
    border-bottom-color: #334155 !important;
    color: #f1f5f9 !important;
}

[data-theme="dark"] .modal-footer {
    background: #1e293b !important;
    border-top-color: #334155 !important;
}

[data-theme="dark"] .modal-close {
    color: #94a3b8 !important;
}

[data-theme="dark"] .modal-content {
    background: #1e293b !important;
    color: #e2e8f0 !important;
}

/* ===================================================================
   DARK MODE — PAGINATION (inline <style> in views)
   =================================================================== */
[data-theme="dark"] .pagination li a,
[data-theme="dark"] .pagination li span,
[data-theme="dark"] .pagination a,
[data-theme="dark"] .pagination span {
    background: #1e293b !important;
    border-color: #334155 !important;
    color: #cbd5e1 !important;
}

[data-theme="dark"] .pagination li a:hover,
[data-theme="dark"] .pagination a:hover {
    background: #334155 !important;
    color: #f1f5f9 !important;
}

[data-theme="dark"] .pagination .active span,
[data-theme="dark"] .pagination li.active span {
    background: #667eea !important;
    border-color: #667eea !important;
    color: white !important;
}

/* ===================================================================
   DARK MODE — PAGE TITLE & EMPTY STATE
   =================================================================== */
[data-theme="dark"] .page-title {
    color: #f1f5f9 !important;
}

[data-theme="dark"] .empty-state {
    color: #94a3b8 !important;
}

[data-theme="dark"] .empty-state i {
    color: #475569 !important;
}

[data-theme="dark"] .empty-state h3 {
    color: #f1f5f9 !important;
}

/* ===================================================================
   DARK MODE — BADGES
   =================================================================== */
[data-theme="dark"] .badge {
    opacity: 0.95;
}

/* ===================================================================
   DARK MODE — HOME PAGE SPECIFIC
   =================================================================== */

/* White blur decorative circles — make them dark blue glow */
[data-theme="dark"] div[style*="background: white"][style*="filter: blur"] {
    background: rgba(102, 126, 234, 0.15) !important;
}

/* White gradient fade overlays on partners carousel */
[data-theme="dark"] div[style*="background: linear-gradient(to right, white"] {
    background: linear-gradient(to right, #0f172a, transparent) !important;
}

[data-theme="dark"] div[style*="background: linear-gradient(to left, white"] {
    background: linear-gradient(to left, #0f172a, transparent) !important;
}

/* White buttons with color: #667eea → keep white text, make bg dark */
[data-theme="dark"] a[style*="background: white"][style*="color: #667eea"] {
    background: #1e293b !important;
    color: #93c5fd !important;
    border-color: #667eea !important;
}

/* ===================================================================
   DARK MODE — GRADIENT SECTION PRESERVATIONS (Hero, CTA)
   White buttons and text on gradient backgrounds must stay visible
   =================================================================== */
[data-theme="dark"] section[style*="background: linear-gradient"] a[style*="background: white"] {
    background: white !important;
    color: #667eea !important;
}

[data-theme="dark"] section[style*="background: linear-gradient"] h1,
[data-theme="dark"] section[style*="background: linear-gradient"] h2 {
    color: white !important;
}

[data-theme="dark"] section[style*="background: linear-gradient"] p {
    color: rgba(255,255,255,0.95) !important;
}

/* ===================================================================
   DARK MODE — FOOTER TEXT PRESERVATION
   Footer already has a dark background; keep its text colors intact
   =================================================================== */
[data-theme="dark"] .footer p,
[data-theme="dark"] .footer-about p,
[data-theme="dark"] .footer-contact,
[data-theme="dark"] .footer-contact p {
    color: rgba(255,255,255,0.8) !important;
}

[data-theme="dark"] .footer h4 {
    color: white !important;
}

[data-theme="dark"] .footer-bottom p {
    color: rgba(255,255,255,0.6) !important;
}

[data-theme="dark"] .footer-links a {
    color: rgba(255,255,255,0.8) !important;
}

[data-theme="dark"] .footer-links a:hover {
    color: white !important;
}

[data-theme="dark"] .social-link {
    color: white !important;
}

/* ===================================================================
   DARK MODE — CHAT PAGES
   =================================================================== */
[data-theme="dark"] div[style*="border-right: 2px solid #e5e7eb"] {
    border-right-color: #334155 !important;
}

/* ===================================================================
   DARK MODE — INLINE hover JS workaround
   Some elements use onmouseover/onmouseout with hardcoded colors.
   We override the base state; JS hover will still briefly flash white
   but returns to dark on mouseout via CSS specificity.
   =================================================================== */

/* ===================================================================
   DARK MODE — SCROLLBARS
   =================================================================== */
[data-theme="dark"] ::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

[data-theme="dark"] ::-webkit-scrollbar-track {
    background: #0f172a;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background: #334155;
    border-radius: 4px;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background: #475569;
}

/* ===================================================================
   DARK MODE — HR & MISC BORDERS
   =================================================================== */
[data-theme="dark"] hr {
    border-color: #334155 !important;
}

/* ===================================================================
   DARK MODE — TOGGLE BUTTON APPEARANCE IN DARK MODE
   =================================================================== */
[data-theme="dark"] .admin-header .theme-toggle,
[data-theme="dark"] .professor-header .theme-toggle,
[data-theme="dark"] .participant-header .theme-toggle {
    color: #fbbf24 !important;
    border-color: #475569 !important;
}

[data-theme="dark"] .admin-header .theme-toggle:hover,
[data-theme="dark"] .professor-header .theme-toggle:hover,
[data-theme="dark"] .participant-header .theme-toggle:hover {
    background: #334155 !important;
    border-color: #fbbf24 !important;
}

[data-theme="dark"] .header .theme-toggle {
    color: #fbbf24 !important;
}

/* ===================================================================
   DARK MODE — MOBILE NAV ACTIVE LANGUAGE
   =================================================================== */
[data-theme="dark"] .mobile-lang-links a {
    background: rgba(255,255,255,0.05) !important;
}

[data-theme="dark"] .mobile-lang-links a:hover,
[data-theme="dark"] .mobile-lang-links a.active-lang {
    background: rgba(255,255,255,0.15) !important;
}

/* ===================================================================
   DARK MODE — SIDEBAR NAV LINKS (participant)
   =================================================================== */
[data-theme="dark"] .sidebar-nav a {
    color: #cbd5e1 !important;
}

[data-theme="dark"] .sidebar-nav a:hover,
[data-theme="dark"] .sidebar-nav a.active {
    background: rgba(102, 126, 234, 0.15) !important;
    color: #93c5fd !important;
}

/* ===================================================================
   DARK MODE — INLINE LANGUAGE ACTIVE STATE (background: #f3f4f6 in style attr)
   =================================================================== */
[data-theme="dark"] a[style*="background: #f3f4f6"] {
    background: #334155 !important;
}

/* ===================================================================
   TRANSITIONS (smooth theme switch)
   =================================================================== */
body,
.header,
.admin-header,
.admin-sidebar,
.admin-content,
.professor-header,
.professor-sidebar,
.professor-content,
.participant-header,
.participant-sidebar,
.dropdown-menu,
.language-menu,
.admin-user-menu,
.lang-menu,
.footer,
.card,
.card-header,
input, textarea, select,
table, th, td,
.auth-container {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}