/* ===== THEME TOGGLE (centered in header) ===== */
.navbar-header-row {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 56px;
    pointer-events: none;
    z-index: 1;
}

.navbar-header-row .theme-toggle-wrapper {
    pointer-events: auto;
}

.theme-toggle-wrapper {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 1031;
    pointer-events: auto;
}

.theme-toggle {
    display: inline-flex;
    align-items: center;
    padding: 0;
    border: none;
    background: transparent;
    border-radius: 999px;
    cursor: pointer;
    transition: background 0.3s ease, box-shadow 0.3s ease;
}

.theme-toggle:hover .theme-toggle-track {
    background: rgba(102, 126, 234, 0.15);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.2);
}

.theme-toggle:focus {
    outline: none;
}

.theme-toggle:focus .theme-toggle-track {
    box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.4);
}

.theme-toggle-track {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 4.5rem;
    height: 2.1rem;
    padding: 0 0.375rem;
    background: rgba(102, 126, 234, 0.08);
    border-radius: 999px;
    transition: background 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.theme-toggle-thumb {
    position: absolute;
    left: 0.375rem;
    top: 50%;
    transform: translateY(-50%);
    width: 1.65rem;
    height: 1.65rem;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 50%;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.4);
    transition: none;
    z-index: 1;
}

.theme-toggle.theme-toggle-initialized .theme-toggle-thumb {
    transition: left 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.theme-toggle[data-theme="dark"] .theme-toggle-thumb {
    left: calc(100% - 1.65rem - 0.375rem);
}

.theme-toggle-track .theme-toggle-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    font-size: 0.975rem;
    color: #6c757d;
    transition: none;
    z-index: 0;
}

.theme-toggle-track .theme-toggle-icon.theme-toggle-sun {
    color: #f59e0b;
}

.theme-toggle-track .theme-toggle-icon.theme-toggle-moon {
    color: #6c757d;
}

.theme-toggle[data-theme="dark"] .theme-toggle-track .theme-toggle-icon.theme-toggle-moon {
    color: #a5b4fc;
}

.theme-toggle.theme-toggle-initialized .theme-toggle-track .theme-toggle-icon {
    transition: color 0.25s ease;
}

/* Мобильный вид: переключатель темы на 20% компактнее */
@media (max-width: 575.98px) {
    .theme-toggle-track {
        width: 3.6rem;
        height: 1.68rem;
        padding: 0 0.3rem;
    }

    .theme-toggle-thumb {
        left: 0.3rem;
        width: 1.32rem;
        height: 1.32rem;
    }

    .theme-toggle[data-theme="dark"] .theme-toggle-thumb {
        left: calc(100% - 1.32rem - 0.3rem);
    }

    .theme-toggle-track .theme-toggle-icon {
        width: 1.2rem;
        height: 1.2rem;
        font-size: 0.78rem;
    }
}

/* ===== DARK THEME (graphite) ===== */
html[data-theme="dark"] {
    color-scheme: dark;
}

html[data-theme="dark"] body {
    background-color: #1a1d23;
    color: #e2e6ed;
}

html[data-theme="dark"] .navbar-modern,
html[data-theme="dark"] .navbar-fixed.scrolled {
    background: linear-gradient(135deg, rgba(36, 40, 48, 0.98) 0%, rgba(26, 29, 35, 0.98) 100%) !important;
    border-bottom-color: rgba(165, 180, 252, 0.12);
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.3);
}

html[data-theme="dark"] .navbar-brand-modern {
    background: linear-gradient(135deg, #a5b4fc 0%, #c4b5fd 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

html[data-theme="dark"] .nav-link-modern {
    color: #d1d5dc;
}

html[data-theme="dark"] .nav-link-modern:hover {
    background-color: rgba(165, 180, 252, 0.12);
    color: #e2e6ed;
}

html[data-theme="dark"] .navbar-modern.navbar-light .navbar-nav .nav-link.nav-link-modern,
html[data-theme="dark"] .navbar-modern.navbar-light .navbar-nav .nav-link.nav-link-modern .nav-link-text {
    color: #d1d5dc !important;
}

html[data-theme="dark"] .navbar-modern.navbar-light .navbar-nav .nav-link.nav-link-modern:hover,
html[data-theme="dark"] .navbar-modern.navbar-light .navbar-nav .nav-link.nav-link-modern:focus,
html[data-theme="dark"] .navbar-modern.navbar-light .navbar-nav .nav-link.nav-link-modern[aria-expanded="true"],
html[data-theme="dark"] .navbar-modern.navbar-light .navbar-nav .dropdown.show .nav-link.nav-link-modern,
html[data-theme="dark"] .navbar-modern.navbar-light .navbar-nav .nav-link.nav-link-modern:hover .nav-link-text,
html[data-theme="dark"] .navbar-modern.navbar-light .navbar-nav .nav-link.nav-link-modern:focus .nav-link-text,
html[data-theme="dark"] .navbar-modern.navbar-light .navbar-nav .nav-link.nav-link-modern[aria-expanded="true"] .nav-link-text,
html[data-theme="dark"] .navbar-modern.navbar-light .navbar-nav .dropdown.show .nav-link.nav-link-modern .nav-link-text {
    color: #e2e6ed !important;
}

html[data-theme="dark"] .navbar-modern.navbar-light .navbar-nav .nav-link.nav-link-modern:hover,
html[data-theme="dark"] .navbar-modern.navbar-light .navbar-nav .nav-link.nav-link-modern:focus,
html[data-theme="dark"] .navbar-modern.navbar-light .navbar-nav .nav-link.nav-link-modern[aria-expanded="true"],
html[data-theme="dark"] .navbar-modern.navbar-light .navbar-nav .dropdown.show .nav-link.nav-link-modern {
    background-color: rgba(165, 180, 252, 0.12);
}

html[data-theme="dark"] .navbar-profile-avatar {
    border-color: #252932;
}

html[data-theme="dark"] .nav-tabs {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] .nav-tabs .nav-link {
    color: #9ca3af;
    background: transparent;
    border-color: transparent rgba(255, 255, 255, 0.08) rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] .nav-tabs .nav-link:hover {
    color: #e2e6ed;
    border-color: transparent rgba(255, 255, 255, 0.08) rgba(255, 255, 255, 0.1);
    background-color: rgba(165, 180, 252, 0.08);
}

html[data-theme="dark"] .nav-tabs .nav-link.active,
html[data-theme="dark"] .nav-tabs .nav-link.nav-link-modern.active {
    background-color: #2d323c;
    color: #a5b4fc;
    border-color: rgba(255, 255, 255, 0.08) rgba(255, 255, 255, 0.08) transparent;
    border-bottom: 2px solid #818cf8;
}

html[data-theme="dark"] .nav-tabs .nav-link.active .nav-link-icon,
html[data-theme="dark"] .nav-tabs .nav-link.nav-link-modern.active .nav-link-icon {
    color: #a5b4fc;
}

html[data-theme="dark"] .nav-link-icon {
    color: #a5b4fc;
}

html[data-theme="dark"] .navbar-toggler-modern {
    background: linear-gradient(135deg, rgba(102, 126, 234, 0.2) 0%, rgba(118, 75, 162, 0.15) 100%);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
}

html[data-theme="dark"] .navbar-toggler-modern:hover {
    background: linear-gradient(135deg, rgba(102, 126, 234, 0.28) 0%, rgba(118, 75, 162, 0.2) 100%);
    box-shadow: 0 4px 16px rgba(102, 126, 234, 0.2);
}

html[data-theme="dark"] .navbar-toggler-modern:focus {
    box-shadow: 0 0 0 3px rgba(165, 180, 252, 0.3);
}

html[data-theme="dark"] .hamburger-modern-line {
    background: linear-gradient(90deg, #a5b4fc 0%, #c4b5fd 100%);
}

html[data-theme="dark"] .dropdown-menu-modern,
html[data-theme="dark"] .navbar-fixed .dropdown-menu,
html[data-theme="dark"] .dropdown-menu {
    background: #252932;
    border-color: rgba(165, 180, 252, 0.15);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4);
}

html[data-theme="dark"] .dropdown-item-modern,
html[data-theme="dark"] .dropdown-item {
    color: #d1d5dc;
}

html[data-theme="dark"] .dropdown-item-modern:hover,
html[data-theme="dark"] .dropdown-item:hover {
    background: rgba(165, 180, 252, 0.15);
    color: #e2e6ed;
}

html[data-theme="dark"] .dropdown-item-modern:focus,
html[data-theme="dark"] .dropdown-item:focus,
html[data-theme="dark"] .dropdown-item-modern.active,
html[data-theme="dark"] .dropdown-item.active,
html[data-theme="dark"] .dropdown-item-modern:focus-visible,
html[data-theme="dark"] .dropdown-item:focus-visible {
    background: rgba(165, 180, 252, 0.15) !important;
    color: #e2e6ed !important;
}

html[data-theme="dark"] .dropdown-item-modern:visited,
html[data-theme="dark"] .dropdown-item:visited {
    color: #d1d5dc !important;
}

html[data-theme="dark"] .dropdown-header {
    color: #9ca3af;
}

html[data-theme="dark"] .dropdown-divider-modern,
html[data-theme="dark"] .dropdown-divider {
    border-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .app-updates-dropdown {
    color: #d1d5dc;
}
html[data-theme="dark"] .app-updates-dropdown .dropdown-header,
html[data-theme="dark"] .app-updates-dropdown .dropdown-header .fw-semibold {
    color: #e2e6ed !important;
}
html[data-theme="dark"] .app-updates-dropdown .text-muted {
    color: #9ca3af !important;
}
html[data-theme="dark"] .app-updates-dropdown li .fw-semibold,
html[data-theme="dark"] .app-updates-dropdown li .small:not(.text-muted) {
    color: #e2e6ed !important;
}

html[data-theme="dark"] .main-content {
    background-color: #1a1d23;
}

html[data-theme="dark"] .card,
html[data-theme="dark"] .modern-card,
html[data-theme="dark"] .nav-card,
html[data-theme="dark"] .welcome-card,
html[data-theme="dark"] .search-filter-card {
    background: #252932;
    border-color: rgba(255, 255, 255, 0.06);
    border-radius: 12px;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

html[data-theme="dark"] .card:hover,
html[data-theme="dark"] .modern-card:hover,
html[data-theme="dark"] .nav-card:hover {
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.35);
}

html[data-theme="dark"] .nav-card:hover .card-body {
    background: linear-gradient(135deg, rgba(165, 180, 252, 0.08) 0%, rgba(196, 181, 253, 0.08) 100%);
    border-radius: 12px;
}

html[data-theme="dark"] .nav-card .card-body,
html[data-theme="dark"] .welcome-card .card-body,
html[data-theme="dark"] .modern-card .card-body,
html[data-theme="dark"] .search-filter-card .card-body {
    border-radius: 12px;
}

html[data-theme="dark"] .welcome-achievement-block {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] .profile-avatar-photo {
    border-color: #252932;
}

html[data-theme="dark"] .profile-avatar-initials {
    border-color: rgba(255, 255, 255, 0.12);
}

html[data-theme="dark"] .profile-page-hero,
html[data-theme="dark"] .profile-page-actions-inline {
    border-left-color: rgba(165, 180, 252, 0.45);
}

html[data-theme="dark"] .profile-page .profile-kv {
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .profile-page .profile-k {
    color: #9ca3af;
}

html[data-theme="dark"] .profile-page .profile-v {
    color: #e2e6ed;
}

html[data-theme="dark"] .profile-page-tabs-card {
    border-left-color: rgba(165, 180, 252, 0.45);
}

/* Профиль: вкладки — как в светлой теме; неактивные подписи светлее для контраста */
html[data-theme="dark"] .profile-page .profile-page-nav .nav-link:not(.active) {
    color: #b8c0cc !important;
    background: transparent !important;
}

html[data-theme="dark"] .profile-page .profile-page-nav .nav-link:not(.active):hover,
html[data-theme="dark"] .profile-page .profile-page-nav .nav-link:not(.active):focus {
    color: #a5b4fc !important;
    background: rgba(102, 126, 234, 0.15) !important;
    border-color: transparent !important;
}

html[data-theme="dark"] .profile-page .profile-page-nav .nav-link.active,
html[data-theme="dark"] .profile-page .profile-page-nav .nav-link.active:hover,
html[data-theme="dark"] .profile-page .profile-page-nav .nav-link.active:focus {
    color: #fff !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

html[data-theme="dark"] .profile-page .profile-page-nav .nav-link.active i {
    color: #fff !important;
}

html[data-theme="dark"] .profile-page-deletion-card {
    border-color: rgba(248, 113, 113, 0.45) !important;
    background: rgba(248, 113, 113, 0.06);
}

html[data-theme="dark"] .card.border-0,
html[data-theme="dark"] .card.shadow-sm {
    border-radius: 12px;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

html[data-theme="dark"] .modern-card-header,
html[data-theme="dark"] .card-header {
    background: #2d323c !important;
    border-color: rgba(255, 255, 255, 0.06);
    color: #e2e6ed;
}

html[data-theme="dark"] .card-body {
    background: #252932;
    color: #e2e6ed;
}

html[data-theme="dark"] .required-dictionary-test-overlay {
    background: rgba(0, 0, 0, 0.65);
    backdrop-filter: blur(6px);
}

html[data-theme="dark"] .required-dictionary-test-modal {
    background: #252932;
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
}

html[data-theme="dark"] .required-dictionary-test-modal .text-warning {
    color: #fbbf24 !important;
}

html[data-theme="dark"] .required-dictionary-test-modal .btn-modern-success {
    box-shadow: 0 2px 8px rgba(34, 197, 94, 0.3);
}

html[data-theme="dark"] .btn-modern-success-calm {
    background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
    color: #fff;
}

html[data-theme="dark"] .btn-modern-success-calm:hover {
    box-shadow: 0 4px 12px rgba(34, 197, 94, 0.3);
    color: #fff;
}

html[data-theme="dark"] .btn-modern-warning-calm {
    background: linear-gradient(135deg, #eab308 0%, #ca8a04 100%);
    color: #fff;
}

html[data-theme="dark"] .btn-modern-warning-calm:hover {
    box-shadow: 0 4px 12px rgba(234, 179, 8, 0.35);
    color: #fff;
}

html[data-theme="dark"] .btn-modern-danger-calm {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
    color: #fff;
}

html[data-theme="dark"] .btn-modern-danger-calm:hover {
    box-shadow: 0 4px 12px rgba(220, 38, 38, 0.35);
    color: #fff;
}

html[data-theme="dark"] .modern-card-title,
html[data-theme="dark"] .card-title,
html[data-theme="dark"] .nav-title,
html[data-theme="dark"] .welcome-title,
html[data-theme="dark"] .page-header-title,
html[data-theme="dark"] .text-dark-modern {
    color: #e2e6ed !important;
}

html[data-theme="dark"] .breadcrumb,
html[data-theme="dark"] .breadcrumb-item,
html[data-theme="dark"] .breadcrumb-item.active {
    color: #e2e6ed !important;
}
html[data-theme="dark"] .breadcrumb-item a {
    color: #a5b4fc !important;
}
html[data-theme="dark"] .breadcrumb-item a:hover {
    color: #c7d2fe !important;
}
html[data-theme="dark"] .breadcrumb-item + .breadcrumb-item::before {
    color: #9ca3af !important;
}

html[data-theme="dark"] .welcome-subtitle,
html[data-theme="dark"] .text-muted-modern,
html[data-theme="dark"] .text-muted,
html[data-theme="dark"] .stat-card-label,
html[data-theme="dark"] .empty-state-text,
html[data-theme="dark"] .modern-list-item-text,
html[data-theme="dark"] .footer-column-text,
html[data-theme="dark"] .footer-mobile-name-modern {
    color: #9ca3af !important;
}

html[data-theme="dark"] .stat-card-value,
html[data-theme="dark"] .stat-card-value-small,
html[data-theme="dark"] .stat-card-value-small-line {
    color: #e2e6ed;
}

html[data-theme="dark"] .stat-card {
    background: linear-gradient(135deg, rgba(165, 180, 252, 0.12) 0%, rgba(196, 181, 253, 0.12) 100%);
    border-left-color: #818cf8;
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .stat-card:hover {
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35);
}

html[data-theme="dark"] .stat-card .card-body {
    border-radius: 12px;
}

html[data-theme="dark"] .stat-card.stat-card-pink {
    background: linear-gradient(135deg, rgba(244, 114, 182, 0.12) 0%, rgba(251, 113, 133, 0.12) 100%);
    border-left-color: #f472b6;
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .stat-card.stat-card-blue {
    background: linear-gradient(135deg, rgba(96, 165, 250, 0.12) 0%, rgba(34, 211, 238, 0.12) 100%);
    border-left-color: #60a5fa;
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .stat-card.stat-card-green {
    background: linear-gradient(135deg, rgba(74, 222, 128, 0.12) 0%, rgba(52, 211, 153, 0.12) 100%);
    border-left-color: #4ade80;
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .stat-card.stat-card-yellow {
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .stat-card-compact {
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .stat-card-compact:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
}

html[data-theme="dark"] {
    --modern-elev-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35), 0 1px 3px rgba(0, 0, 0, 0.2);
    --modern-elev-shadow-md: 0 4px 14px rgba(0, 0, 0, 0.4), 0 2px 6px rgba(0, 0, 0, 0.25);
    --modern-elev-shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.45), 0 4px 12px rgba(0, 0, 0, 0.3);
    --modern-elev-border: 1px solid rgba(255, 255, 255, 0.08);
    --modern-elev-surface: #1e293b;
    --modern-elev-surface-muted: #172033;
    --modern-elev-accent: #818cf8;
}

html[data-theme="dark"] .table,
html[data-theme="dark"] .modern-table {
    color: #e2e6ed;
    border-color: rgba(255, 255, 255, 0.08);
    background-color: var(--modern-elev-surface);
}

html[data-theme="dark"] .modern-card:has(.modern-table) {
    background: var(--modern-elev-surface);
    box-shadow: var(--modern-elev-shadow-lg);
}

html[data-theme="dark"] .modern-card:has(.modern-table):hover {
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5), 0 6px 16px rgba(0, 0, 0, 0.35);
}

html[data-theme="dark"] .modern-table thead tr {
    background: linear-gradient(180deg, #334155 0%, #1e293b 100%);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);
}

html[data-theme="dark"] .table thead tr {
    background: #2d323c !important;
}

html[data-theme="dark"] .modern-table thead th {
    color: #cbd5e1;
    border-color: transparent;
    background-color: transparent !important;
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .table thead th {
    color: #e2e6ed;
    border-color: rgba(255, 255, 255, 0.1);
    background-color: #2d323c !important;
}

html[data-theme="dark"] .modern-table tbody tr {
    background-color: var(--modern-elev-surface) !important;
}

html[data-theme="dark"] .table tbody tr {
    background-color: #252932 !important;
}

html[data-theme="dark"] .modern-table:not(.table-bordered) tbody tr:not(:last-child) td {
    border-bottom-color: rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .modern-table tbody td,
html[data-theme="dark"] .table tbody td {
    border-color: rgba(255, 255, 255, 0.06);
    color: #d1d5dc;
    background-color: transparent !important;
}

html[data-theme="dark"] .modern-table tbody tr:hover {
    background: #273549 !important;
    box-shadow: inset 3px 0 0 var(--modern-elev-accent), 0 4px 16px rgba(0, 0, 0, 0.35);
}

html[data-theme="dark"] .modern-table tbody tr.table-secondary {
    background: var(--modern-elev-surface-muted) !important;
}

html[data-theme="dark"] .modern-table tbody tr.table-secondary:hover {
    background: #1e293b !important;
    box-shadow: inset 3px 0 0 #94a3b8, 0 4px 14px rgba(0, 0, 0, 0.3);
}

html[data-theme="dark"] .table tbody tr:hover,
html[data-theme="dark"] .test-row:hover {
    background: rgba(165, 180, 252, 0.08) !important;
}

html[data-theme="dark"] .modern-table tbody tr:hover td,
html[data-theme="dark"] .table tbody tr:hover td {
    background-color: transparent !important;
}

html[data-theme="dark"] .modern-table td .btn-modern-outline-primary,
html[data-theme="dark"] .modern-table td .btn-modern-outline-info,
html[data-theme="dark"] .modern-table td .btn-modern-outline-success,
html[data-theme="dark"] .modern-table td .btn-modern-outline-warning,
html[data-theme="dark"] .modern-table td .btn-modern-outline-danger,
html[data-theme="dark"] .modern-table td .btn-modern-outline-secondary,
html[data-theme="dark"] .modern-table td .btn-modern-outline-warning-calm {
    background: linear-gradient(180deg, #334155 0%, #1e293b 100%);
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}

html[data-theme="dark"] .table-striped > tbody > tr {
    background-color: #252932 !important;
}

html[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #252932 !important;
}

html[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(even) {
    background-color: #2d323c !important;
}

html[data-theme="dark"] .table-striped > tbody > tr:hover {
    background: rgba(165, 180, 252, 0.08) !important;
}

html[data-theme="dark"] .table-light,
html[data-theme="dark"] .table-light thead th,
html[data-theme="dark"] .table-light tbody tr {
    background-color: #2d323c !important;
    color: #e2e6ed;
}

html[data-theme="dark"] .table-warning,
html[data-theme="dark"] tr.table-warning {
    background-color: rgba(251, 191, 36, 0.15) !important;
    color: #e2e6ed;
}

html[data-theme="dark"] .table-responsive .table tbody tr,
html[data-theme="dark"] .table-responsive .table-modern tbody tr {
    background-color: #252932 !important;
}

html[data-theme="dark"] .table-responsive .modern-table tbody tr {
    background-color: var(--modern-elev-surface) !important;
}

html[data-theme="dark"] .table-modern {
    background-color: #252932;
}

html[data-theme="dark"] .table-modern tbody tr {
    background-color: #252932 !important;
}

html[data-theme="dark"] .table-modern thead tr,
html[data-theme="dark"] .table-modern thead th,
html[data-theme="dark"] .table-header-modern,
html[data-theme="dark"] .table-header-modern th {
    background: #2d323c !important;
    color: #e2e6ed;
}

html[data-theme="dark"] .table-modern tbody td {
    border-color: rgba(255, 255, 255, 0.06);
    color: #d1d5dc;
}

html[data-theme="dark"] .test-title-compact {
    color: #e2e6ed !important;
}

html[data-theme="dark"] .btn-modern-primary {
    background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
    color: #fff;
}

html[data-theme="dark"] .btn-modern-primary:hover {
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.5);
    color: #fff;
}

html[data-theme="dark"] .modern-btn-outline {
    background: rgba(165, 180, 252, 0.1);
    border-color: rgba(165, 180, 252, 0.35);
    color: #a5b4fc;
}

html[data-theme="dark"] .modern-btn-outline:hover {
    background: rgba(165, 180, 252, 0.2);
    border-color: rgba(165, 180, 252, 0.5);
    color: #c7d2fe;
}

html[data-theme="dark"] .btn-outline-primary {
    border-color: #818cf8;
    color: #a5b4fc;
}

html[data-theme="dark"] .btn-outline-primary:hover {
    background: rgba(129, 140, 248, 0.2);
    border-color: #a5b4fc;
    color: #c7d2fe;
}

html[data-theme="dark"] .btn-outline-success {
    border-color: #4ade80;
    color: #4ade80;
}

html[data-theme="dark"] .btn-outline-success:hover {
    background: rgba(74, 222, 128, 0.2);
    color: #86efac;
}

html[data-theme="dark"] .btn-modern-outline-primary,
html[data-theme="dark"] .btn-modern-outline-info,
html[data-theme="dark"] .btn-modern-outline-success,
html[data-theme="dark"] .btn-modern-outline-warning,
html[data-theme="dark"] .btn-modern-outline-danger,
html[data-theme="dark"] .btn-modern-outline-secondary {
    background: rgba(255, 255, 255, 0.05);
    border-color: rgba(255, 255, 255, 0.15);
    color: #e2e6ed;
}

html[data-theme="dark"] .btn-modern-outline-primary:hover,
html[data-theme="dark"] .btn-modern-outline-info:hover,
html[data-theme="dark"] .btn-modern-outline-success:hover,
html[data-theme="dark"] .btn-modern-outline-warning:hover,
html[data-theme="dark"] .btn-modern-outline-danger:hover,
html[data-theme="dark"] .btn-modern-outline-secondary:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.2);
    color: #e2e6ed;
}

html[data-theme="dark"] .btn-modern-outline-primary i,
html[data-theme="dark"] .btn-modern-outline-info i,
html[data-theme="dark"] .btn-modern-outline-success i,
html[data-theme="dark"] .btn-modern-outline-warning i,
html[data-theme="dark"] .btn-modern-outline-danger i,
html[data-theme="dark"] .btn-modern-outline-secondary i {
    color: #e2e6ed;
}

html[data-theme="dark"] .btn-modern-outline-warning-calm {
    background: rgba(234, 179, 8, 0.08);
    border-color: #ca8a04;
    color: #eab308;
}
html[data-theme="dark"] .btn-modern-outline-warning-calm:hover {
    background: rgba(234, 179, 8, 0.15);
    border-color: #eab308;
    color: #facc15;
}
html[data-theme="dark"] .btn-modern-outline-warning-calm i {
    color: inherit;
}

html[data-theme="dark"] .btn-modern-outline-danger,
html[data-theme="dark"] .btn-modern-outline-danger:hover {
    border-color: #e57373;
    color: #e57373;
    background: rgba(229, 115, 115, 0.08);
}
html[data-theme="dark"] .btn-modern-outline-danger:hover {
    background: rgba(229, 115, 115, 0.15);
}
html[data-theme="dark"] .btn-modern-outline-danger i,
html[data-theme="dark"] .btn-modern-outline-danger:hover i {
    color: #e57373;
}

html[data-theme="dark"] .btn-modern-danger {
    background: linear-gradient(135deg, #d57373 0%, #c75050 100%);
    border: 0;
    color: #fff;
}
html[data-theme="dark"] .btn-modern-danger:hover {
    color: #fff;
}

html[data-theme="dark"] .btn-light,
html[data-theme="dark"] .btn-secondary {
    background: #3d4452;
    border-color: #4b5563;
    color: #e2e6ed;
}

html[data-theme="dark"] .btn-light:hover,
html[data-theme="dark"] .btn-secondary:hover {
    background: #4b5563;
    border-color: #6b7280;
    color: #fff;
}

html[data-theme="dark"] .btn-demo-teacher:hover,
html[data-theme="dark"] .btn-demo-student:hover {
    filter: brightness(1.15);
}

html[data-theme="dark"] .btn-primary {
    background: #6366f1;
    border-color: #6366f1;
    color: #fff;
}

html[data-theme="dark"] .btn-primary:hover {
    background: #4f46e5;
    border-color: #4f46e5;
    color: #fff;
}

html[data-theme="dark"] .btn-success {
    background: #22c55e;
    border-color: #22c55e;
}

html[data-theme="dark"] .btn-info {
    background: #3b82f6;
    border-color: #3b82f6;
}

html[data-theme="dark"] .btn-warning {
    background: #eab308;
    border-color: #eab308;
    color: #1a1d23;
}

html[data-theme="dark"] .btn-danger {
    background: #c75050;
    border-color: #c75050;
    color: #fff;
}

html[data-theme="dark"] .dropdown-item.text-danger,
html[data-theme="dark"] .dropdown-item.text-danger i {
    color: #e57373 !important;
}
html[data-theme="dark"] .dropdown-item.text-danger:hover {
    background: rgba(229, 115, 115, 0.15);
    color: #e57373;
}

html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-control-modern:not(.form-select) {
    background: #2d323c;
    border-color: rgba(255, 255, 255, 0.12);
    color: #e2e6ed;
}

html[data-theme="dark"] .form-select {
    background-color: #2d323c;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23e2e6ed' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-position: right 0.75rem center;
    background-size: 16px 12px;
    background-repeat: no-repeat;
    border-color: rgba(255, 255, 255, 0.12);
    color: #e2e6ed;
}

html[data-theme="dark"] .form-control::placeholder {
    color: #6b7280;
}

html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-control-modern:focus:not(.form-select) {
    background: #2d323c;
    border-color: #818cf8;
    box-shadow: 0 0 0 0.2rem rgba(129, 140, 248, 0.25);
    color: #e2e6ed;
}

html[data-theme="dark"] .form-select:focus,
html[data-theme="dark"] .form-select.form-control-modern:focus {
    background-color: #2d323c;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23e2e6ed' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    border-color: #818cf8;
    box-shadow: 0 0 0 0.2rem rgba(129, 140, 248, 0.25);
    color: #e2e6ed;
}

html[data-theme="dark"] .form-label,
html[data-theme="dark"] .form-label-modern {
    color: #d1d5dc;
}

html[data-theme="dark"] .form-check-label {
    color: #e2e6ed;
}

html[data-theme="dark"] .form-check-input {
    background-color: #2d323c;
    border-color: rgba(255, 255, 255, 0.2);
}

html[data-theme="dark"] .form-check-input:checked {
    background-color: #6366f1;
    border-color: #6366f1;
}

html[data-theme="dark"] .badge,
html[data-theme="dark"] .modern-badge {
    background: rgba(255, 255, 255, 0.12);
    color: #d1d5dc;
    border-color: rgba(255, 255, 255, 0.15);
}

html[data-theme="dark"] .badge-modern-primary { background: rgba(129, 140, 248, 0.25); color: #a5b4fc; border-color: rgba(129, 140, 248, 0.4); }
html[data-theme="dark"] .badge-modern-success { background: rgba(74, 222, 128, 0.2); color: #4ade80; border-color: rgba(74, 222, 128, 0.35); }
html[data-theme="dark"] .badge-modern-info { background: rgba(96, 165, 250, 0.2); color: #60a5fa; border-color: rgba(96, 165, 250, 0.35); }
html[data-theme="dark"] .badge-modern-warning { background: rgba(251, 191, 36, 0.2); color: #fbbf24; border-color: rgba(251, 191, 36, 0.35); }
html[data-theme="dark"] .badge-modern-success-calm { background: rgba(34, 197, 94, 0.18); color: #4ade80; border-color: rgba(34, 197, 94, 0.3); }
html[data-theme="dark"] .badge-modern-warning-calm { background: rgba(234, 179, 8, 0.18); color: #fbbf24; border-color: rgba(234, 179, 8, 0.3); }
html[data-theme="dark"] .badge-modern-danger { background: rgba(248, 113, 113, 0.2); color: #f87171; border-color: rgba(248, 113, 113, 0.35); }
html[data-theme="dark"] .badge-modern-secondary { background: rgba(107, 114, 128, 0.25); color: #9ca3af; border-color: rgba(107, 114, 128, 0.4); }
html[data-theme="dark"] .badge.bg-primary { background: #6366f1 !important; }
html[data-theme="dark"] .badge.bg-success { background: #22c55e !important; }
html[data-theme="dark"] .badge.bg-warning { background: #eab308 !important; }
html[data-theme="dark"] .badge.bg-danger { background: #ef4444 !important; }
html[data-theme="dark"] .badge.bg-secondary { background: #4b5563 !important; }
html[data-theme="dark"] .badge.bg-info { background: #3b82f6 !important; }

html[data-theme="dark"] .badge.bg-light.text-dark {
    color: #e2e6ed !important;
}

html[data-theme="dark"] .alert {
    border-color: rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] .alert-info,
html[data-theme="dark"] .modern-alert-info {
    background: rgba(96, 165, 250, 0.15);
    border-left-color: #60a5fa;
    color: #e2e6ed;
}

html[data-theme="dark"] .alert-success {
    background: rgba(74, 222, 128, 0.15);
    border-color: rgba(74, 222, 128, 0.3);
    color: #e2e6ed;
}

html[data-theme="dark"] .alert-warning {
    background: rgba(251, 191, 36, 0.15);
    border-color: rgba(251, 191, 36, 0.3);
    color: #e2e6ed;
}

html[data-theme="dark"] .alert-danger {
    background: rgba(248, 113, 113, 0.15);
    border-color: rgba(248, 113, 113, 0.3);
    color: #e2e6ed;
}

html[data-theme="dark"] .alert-secondary,
html[data-theme="dark"] .alert-light {
    background: rgba(255, 255, 255, 0.06);
    border-color: rgba(255, 255, 255, 0.1);
    color: #d1d5dc;
}

html[data-theme="dark"] .accordion-modern .accordion-item,
html[data-theme="dark"] .accordion-item {
    background: #252932;
    border-color: rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .accordion-modern .accordion-button,
html[data-theme="dark"] .accordion-button {
    background: #252932;
    color: #e2e6ed;
    border-color: rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .accordion-modern .accordion-button:not(.collapsed),
html[data-theme="dark"] .accordion-button:not(.collapsed) {
    background: rgba(165, 180, 252, 0.12);
    color: #a5b4fc;
}

html[data-theme="dark"] .accordion-modern .accordion-body,
html[data-theme="dark"] .accordion-body {
    background: #2d323c;
    color: #e2e6ed;
    border-color: rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .accordion-button::after {
    filter: invert(1) brightness(1.3);
}

html[data-theme="dark"] .accordion-button:not(.collapsed)::after {
    filter: invert(1) brightness(1.3);
}

html[data-theme="dark"] .collapse-header .fa-chevron-down,
html[data-theme="dark"] .collapse-header .fa-chevron-up,
html[data-theme="dark"] .btn-link .fa-chevron-down,
html[data-theme="dark"] .btn-link .fa-chevron-up,
html[data-theme="dark"] [data-bs-toggle="collapse"] .fa-chevron-down,
html[data-theme="dark"] [data-bs-toggle="collapse"] .fa-chevron-up {
    color: #a5b4fc;
}

html[data-theme="dark"] .collapse-header:hover {
    background: rgba(165, 180, 252, 0.08);
}

html[data-theme="dark"] .test-container .question-result,
html[data-theme="dark"] .test-container .question-result .accordion-button {
    color: #e2e6ed;
}

html[data-theme="dark"] .test-container .question-result .small,
html[data-theme="dark"] .test-container .question-result .text-truncate,
html[data-theme="dark"] .test-container .question-result .accordion-button span {
    color: #e2e6ed;
}

html[data-theme="dark"] .test-container .word-with-gap,
html[data-theme="dark"] .test-container .text-with-gap,
html[data-theme="dark"] .test-container .question-text-block {
    background: #2d323c !important;
    background-image: none !important;
    color: #e2e6ed !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

html[data-theme="dark"] .test-container .question-result .nav-link-icon-green,
html[data-theme="dark"] .test-container .question-result .fa-check-circle.nav-link-icon-green {
    color: #4ade80 !important;
}

html[data-theme="dark"] .test-container .question-result .nav-link-icon-danger,
html[data-theme="dark"] .test-container .question-result .fa-times-circle.nav-link-icon-danger {
    color: #f87171 !important;
}

html[data-theme="dark"] .test-container .question-result .fw-bold.nav-link-icon-green,
html[data-theme="dark"] .test-container .question-result .fw-bold.nav-link-icon-danger {
    color: #e2e6ed;
}

html[data-theme="dark"] .test-container .question-result .fw-bold.nav-link-icon-green {
    color: #4ade80 !important;
}

html[data-theme="dark"] .test-container .question-result .fw-bold.nav-link-icon-danger {
    color: #f87171 !important;
}

html[data-theme="dark"] .test-container .question-result .modern-alert-info .text-dark-modern {
    color: #e2e6ed !important;
}

html[data-theme="dark"] .test-container .question-result .modern-alert-info .nav-link-icon-blue {
    color: #60a5fa !important;
}

html[data-theme="dark"] .test-container .question-result .text-info {
    color: #60a5fa !important;
}

html[data-theme="dark"] .test-container .question-result .accordion-body,
html[data-theme="dark"] .test-container .question-result .accordion-body .card-body {
    background: #2d323c;
    color: #e2e6ed;
}

html[data-theme="dark"] .test-container .question-result .accordion-body .card small {
    color: #e2e6ed;
}

html[data-theme="dark"] .test-container .question-result .accordion-body .bg-success.bg-opacity-10 {
    background: rgba(74, 222, 128, 0.15) !important;
}

html[data-theme="dark"] .test-container .question-result .accordion-body .bg-danger.bg-opacity-10 {
    background: rgba(248, 113, 113, 0.15) !important;
}

html[data-theme="dark"] .modern-list-item {
    border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .modern-list-item:hover {
    background: rgba(165, 180, 252, 0.06) !important;
}

html[data-theme="dark"] .modern-list-item-title {
    color: #e2e6ed;
}

html[data-theme="dark"] .empty-state-icon,
html[data-theme="dark"] .empty-state-large-icon {
    color: #4b5563;
}

html[data-theme="dark"] .empty-state-large-title,
html[data-theme="dark"] .empty-state-large-text {
    color: #9ca3af;
}

html[data-theme="dark"] .auth-card {
    background: #252932;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}

html[data-theme="dark"] .auth-card-header {
    border-radius: 12px 12px 0 0;
}

html[data-theme="dark"] .auth-card-footer {
    background: #2d323c;
    border-color: rgba(255, 255, 255, 0.08);
    border-radius: 0 0 12px 12px;
}

html[data-theme="dark"] .footer-modern,
html[data-theme="dark"] .footer-fixed {
    background: linear-gradient(135deg, rgba(36, 40, 48, 0.98) 0%, rgba(26, 29, 35, 0.98) 100%);
    border-top-color: rgba(165, 180, 252, 0.12);
    box-shadow: 0 -2px 15px rgba(0, 0, 0, 0.3);
}

html[data-theme="dark"] .footer-column h6,
html[data-theme="dark"] .footer-column-title,
html[data-theme="dark"] .footer-mobile-title-modern {
    color: #e2e6ed;
}

html[data-theme="dark"] .footer-column-link,
html[data-theme="dark"] .footer-column a {
    color: #9ca3af;
}

html[data-theme="dark"] .footer-column-link:hover,
html[data-theme="dark"] .footer-column a:hover {
    color: #a5b4fc;
}

html[data-theme="dark"] .footer-documents-toggle {
    color: #9ca3af;
}

html[data-theme="dark"] .footer-documents-toggle:hover,
html[data-theme="dark"] .footer-documents-toggle:focus,
html[data-theme="dark"] .footer-documents-toggle.show {
    color: #a5b4fc;
}

html[data-theme="dark"] .footer-documents-menu {
    --bs-dropdown-bg: #2d323c;
    --bs-dropdown-border-color: rgba(255, 255, 255, 0.08);
    --bs-dropdown-link-color: #e2e6ed;
    --bs-dropdown-link-hover-color: #a5b4fc;
    --bs-dropdown-link-hover-bg: rgba(165, 180, 252, 0.12);
    --bs-dropdown-divider-bg: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .footer-documents-menu .dropdown-item {
    color: #e2e6ed;
}

html[data-theme="dark"] .footer-social-link-email {
    background: rgba(165, 180, 252, 0.15);
    border-color: rgba(165, 180, 252, 0.3);
    color: #a5b4fc;
}

html[data-theme="dark"] .footer-social-link-tech-email {
    background: rgba(96, 165, 250, 0.15);
    border-color: rgba(96, 165, 250, 0.3);
    color: #60a5fa;
}

html[data-theme="dark"] .footer-social-link-telegram {
    background: rgba(34, 211, 238, 0.12);
    border-color: rgba(34, 211, 238, 0.25);
    color: #22d3ee;
}

html[data-theme="dark"] .footer-mobile-name-modern {
    color: #9ca3af;
}

html[data-theme="dark"] .footer .text-muted,
html[data-theme="dark"] footer small.text-muted {
    color: #6b7280 !important;
}

html[data-theme="dark"] footer a[href].text-decoration-none {
    color: #9ca3af !important;
}

html[data-theme="dark"] footer a[href].text-decoration-none:hover {
    color: #a5b4fc !important;
}

html[data-theme="dark"] .page-header-icon {
    color: #a5b4fc;
}

html[data-theme="dark"] .text-link-modern {
    color: #a5b4fc;
}

html[data-theme="dark"] .text-link-modern:hover {
    color: #c7d2fe;
}

html[data-theme="dark"] hr {
    border-color: rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] .welcome-card-home hr {
    border-color: rgba(165, 180, 252, 0.2);
}

html[data-theme="dark"] .lead {
    color: #d1d5dc;
}

html[data-theme="dark"] .bg-light {
    background-color: #2d323c !important;
}

html[data-theme="dark"] .mistake-item-compact {
    background-color: #2d323c !important;
    border-left-color: #dc3545 !important;
}

html[data-theme="dark"] .student-name-compact {
    background-color: rgba(255, 255, 255, 0.08) !important;
    color: #d1d5dc !important;
}

html[data-theme="dark"] .student-name-compact.text-muted {
    color: #9ca3af !important;
}

html[data-theme="dark"] .bg-white {
    background-color: #252932 !important;
}

html[data-theme="dark"] .border,
html[data-theme="dark"] .border-top,
html[data-theme="dark"] .border-bottom {
    border-color: rgba(255, 255, 255, 0.08) !important;
}

html[data-theme="dark"] .modal-content {
    background: #252932;
    border-color: rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] .modal-header {
    border-color: rgba(255, 255, 255, 0.08);
    color: #e2e6ed;
}

html[data-theme="dark"] .modal-body {
    color: #e2e6ed;
}

html[data-theme="dark"] .modal-footer {
    border-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .modal .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
}

body.rule-of-day-backdrop-blur .modal-backdrop {
    background: rgba(0, 0, 0, 0.5) !important;
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
}

html[data-theme="dark"] body.rule-of-day-backdrop-blur .modal-backdrop {
    background: rgba(0, 0, 0, 0.65) !important;
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
}

html[data-theme="dark"] .rule-of-day-modal .rule-of-day-modal-content {
    background: #252932;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}
html[data-theme="dark"] .rule-of-day-modal .rule-of-day-modal-header {
    background: linear-gradient(135deg, #4a3d72 0%, #5c4d8a 100%);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    color: #fff;
}
html[data-theme="dark"] .rule-of-day-modal .rule-of-day-modal-title {
    color: #fff;
}
html[data-theme="dark"] .rule-of-day-modal .rule-of-day-modal-header .btn-close {
    filter: brightness(0) invert(1);
    opacity: 0.85;
}
html[data-theme="dark"] .rule-of-day-modal .rule-of-day-modal-header .btn-close:not(:disabled):hover {
    opacity: 1;
}
html[data-theme="dark"] .rule-of-day-modal .rule-of-day-modal-body {
    background: #1e2128;
    color: #e2e6ed;
}
html[data-theme="dark"] .rule-of-day-modal .rule-of-day-text {
    color: #e2e6ed;
}
html[data-theme="dark"] .rule-of-day-modal .rule-of-day-text .rule-of-day-capital {
    color: #f87171;
}
html[data-theme="dark"] .rule-of-day-modal .rule-of-day-progress-label {
    color: #9ca3af;
}
html[data-theme="dark"] .rule-of-day-modal .rule-of-day-show-counter {
    color: #9ca3af !important;
}
html[data-theme="dark"] .rule-of-day-modal .rule-of-day-progress {
    background-color: rgba(255, 255, 255, 0.12);
}
html[data-theme="dark"] .rule-of-day-modal .rule-of-day-progress-bar {
    background: linear-gradient(90deg, #7b6ba8, #9b8bc4);
}

html[data-theme="dark"] .demo-hint {
    background: #252932;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
}

html[data-theme="dark"] .demo-hint-body {
    color: #e2e6ed;
}

html[data-theme="dark"] .demo-hint-footer {
    border-color: rgba(255, 255, 255, 0.08);
}

.deadline-toast,
.deadline-toast strong,
.deadline-toast .text-muted {
    color: #1a1a1a !important;
}
.deadline-toast .btn-outline-dark {
    border-color: #1a1a1a;
    color: #1a1a1a;
}
.deadline-toast .btn-outline-dark:hover {
    background-color: rgba(0, 0, 0, 0.1);
    border-color: #1a1a1a;
    color: #1a1a1a;
}
.deadline-toast .btn-close {
    filter: none;
    opacity: 0.75;
}
.deadline-reminder-modal .modal-title.text-warning {
    color: #856404 !important;
}
.deadline-reminder-modal .modal-body,
.deadline-reminder-modal .modal-body strong {
    color: #212529 !important;
}
.deadline-reminder-modal .modal-body .text-muted {
    color: #6c757d !important;
}

html[data-theme="dark"] .notification-alert {
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}

html[data-theme="dark"] .notification-alert.alert-success {
    background-color: rgba(34, 197, 94, 0.95) !important;
    color: #fff !important;
    border-color: rgba(22, 163, 74, 0.9) !important;
}
html[data-theme="dark"] .notification-alert.alert-success .btn-close {
    filter: brightness(0) invert(1);
}
html[data-theme="dark"] .notification-alert.alert-info {
    background-color: rgba(59, 130, 246, 0.95) !important;
    color: #fff !important;
    border-color: rgba(37, 99, 235, 0.9) !important;
}
html[data-theme="dark"] .notification-alert.alert-info .btn-close {
    filter: brightness(0) invert(1);
}
html[data-theme="dark"] .notification-alert.alert-warning {
    background-color: rgba(251, 191, 36, 0.95) !important;
    color: #1a1a1a !important;
    border-color: rgba(245, 158, 11, 0.9) !important;
}
html[data-theme="dark"] .notification-alert.alert-danger {
    background-color: rgba(239, 68, 68, 0.95) !important;
    color: #fff !important;
    border-color: rgba(220, 38, 38, 0.9) !important;
}
html[data-theme="dark"] .notification-alert.alert-danger .btn-close {
    filter: brightness(0) invert(1);
}
html[data-theme="dark"] .notification-alert.notification-achievement {
    background: linear-gradient(135deg, rgba(251, 191, 36, 0.95) 0%, rgba(245, 158, 11, 0.95) 100%) !important;
    color: #1a1a1a !important;
    border-color: rgba(230, 170, 0, 0.9) !important;
}
html[data-theme="dark"] .notification-alert.notification-achievement .btn-close {
    filter: invert(1);
}

html[data-theme="dark"] .deadline-toast,
html[data-theme="dark"] .deadline-toast strong,
html[data-theme="dark"] .deadline-toast .text-muted,
html[data-theme="dark"] .deadline-toast .small {
    color: #1a1a1a !important;
}
html[data-theme="dark"] .deadline-toast .btn-outline-dark {
    border-color: #1a1a1a;
    color: #1a1a1a;
    background: rgba(0, 0, 0, 0.08);
}
html[data-theme="dark"] .deadline-toast .btn-outline-dark:hover {
    background: rgba(0, 0, 0, 0.15);
    border-color: #1a1a1a;
    color: #1a1a1a;
}
html[data-theme="dark"] .deadline-toast .btn-close {
    filter: none;
    opacity: 0.7;
}

html[data-theme="dark"] .deadline-reminder-modal .modal-content {
    background: #252932;
    border-color: rgba(255, 255, 255, 0.1);
}
html[data-theme="dark"] .deadline-reminder-modal .modal-title.text-warning {
    color: #fbbf24 !important;
}
html[data-theme="dark"] .deadline-reminder-modal .modal-body,
html[data-theme="dark"] .deadline-reminder-modal .modal-body strong {
    color: #e2e6ed !important;
}
html[data-theme="dark"] .deadline-reminder-modal .modal-body .text-muted {
    color: #9ca3af !important;
}
html[data-theme="dark"] .deadline-reminder-modal .btn-warning {
    background: #eab308;
    border-color: #eab308;
    color: #1a1d23;
}

html[data-theme="dark"] .toast,
html[data-theme="dark"] .toast.show {
    background-color: #252932;
    border-color: rgba(255, 255, 255, 0.12);
    color: #e2e6ed;
}

html[data-theme="dark"] .toast .toast-body {
    background-color: #252932;
    color: #e2e6ed;
}

html[data-theme="dark"] .role-card {
    border-color: rgba(255, 255, 255, 0.12);
    background: #252932;
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .role-card:hover {
    border-color: #818cf8;
    box-shadow: 0 4px 12px rgba(99, 102, 241, 0.25);
}

html[data-theme="dark"] .role-card.selected-student {
    border-color: #60a5fa;
    background: rgba(96, 165, 250, 0.12);
    border-radius: 12px;
}

html[data-theme="dark"] .role-card.selected-teacher {
    border-color: #4ade80;
    background: rgba(74, 222, 128, 0.12);
    border-radius: 12px;
}

html[data-theme="dark"] .role-specific-fields {
    background: #2d323c;
    border-left-color: #818cf8;
}

html[data-theme="dark"] .alert-role-info.student-alert {
    background-color: rgba(96, 165, 250, 0.15);
    color: #93c5fd;
    border-left-color: #60a5fa;
}

html[data-theme="dark"] .alert-role-info.student-alert i {
    color: #93c5fd;
}

html[data-theme="dark"] .alert-role-info.teacher-alert {
    background-color: rgba(74, 222, 128, 0.15);
    color: #86efac;
    border-left-color: #22c55e;
}

html[data-theme="dark"] .alert-role-info.teacher-alert i {
    color: #86efac;
}

html[data-theme="dark"] .registration-card {
    background: #252932;
    border-radius: 12px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4);
}

html[data-theme="dark"] .password-toggle-btn {
    color: #9ca3af;
}

html[data-theme="dark"] .password-toggle-btn:hover {
    color: #a5b4fc;
}

html[data-theme="dark"] .theme-toggle-track {
    background: rgba(0, 0, 0, 0.25);
}

html[data-theme="dark"] .theme-toggle:hover .theme-toggle-track {
    background: rgba(165, 180, 252, 0.2);
}

html[data-theme="dark"] .dropdown-menu-end {
    background: #252932;
    border-color: rgba(255, 255, 255, 0.1);
}

html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5,
html[data-theme="dark"] h6 {
    color: #e2e6ed;
}

html[data-theme="dark"] small {
    color: #9ca3af;
}

html[data-theme="dark"] .list-group-item {
    background: #252932;
    border-color: rgba(255, 255, 255, 0.08);
    color: #e2e6ed;
}

html[data-theme="dark"] .list-group-item:hover {
    background: rgba(165, 180, 252, 0.08);
}

html[data-theme="dark"] .pagination .page-link {
    background: #252932;
    border-color: rgba(255, 255, 255, 0.1);
    color: #e2e6ed;
}

html[data-theme="dark"] .pagination .page-link:hover {
    background: rgba(165, 180, 252, 0.15);
    border-color: rgba(165, 180, 252, 0.3);
    color: #e2e6ed;
}

html[data-theme="dark"] .pagination .page-item.active .page-link {
    background: #6366f1;
    border-color: #6366f1;
}

html[data-theme="dark"] .input-group-text {
    background: #2d323c;
    border-color: rgba(255, 255, 255, 0.12);
    color: #d1d5dc;
}

.goal-circles {
    flex-wrap: wrap;
}
.goal-circle {
    width: 2rem;
    height: 2rem;
    min-width: 2rem;
    min-height: 2rem;
    flex-shrink: 0;
}

@media (max-width: 768px) {
    .goal-circles .goal-circle {
        flex-shrink: 0 !important;
        min-width: 2rem !important;
        min-height: 2rem !important;
        width: 2rem !important;
        height: 2rem !important;
    }
}

/* LAYOUT FULLSCREEN */
html.layout-fullscreen-html {
    overflow-x: hidden !important;
}
body.layout-fullscreen {
    display: block !important;
    grid-template-rows: none !important;
    min-height: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
    overflow-x: hidden !important;
}
.layout-fullscreen-main {
    width: 100% !important;
    max-width: 100vw !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: 100% !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}
.layout-fullscreen-main .container-fluid {
    max-width: 100% !important;
    min-width: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    box-sizing: border-box !important;
}

/* ===== WHITEBOARD ===== */
.whiteboard-page {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding-left: 0.25rem !important;
    padding-right: 0.25rem !important;
    padding-bottom: 0.25rem !important;
    box-sizing: border-box !important;
}
@media (min-width: 576px) {
    .whiteboard-page {
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
        padding-bottom: 0.5rem !important;
    }
}
.whiteboard-page .whiteboard-toolbar {
    flex-shrink: 0;
    min-width: 0;
    max-width: 100%;
}
.whiteboard-page .wb-toolbar-header {
    min-width: 0;
    max-width: 100%;
    gap: 0.35rem;
}
.whiteboard-page .wb-toolbar-drawing {
    min-width: 0;
    max-width: 100%;
    gap: 0.35rem;
    margin-top: 0.5rem;
    padding: 0.25rem 0;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    background-color: rgba(0, 0, 0, 0.04);
    border-radius: 0.375rem;
    padding-left: 0.35rem;
    padding-right: 0.35rem;
}
@media (min-width: 576px) {
    .whiteboard-page .wb-toolbar-drawing {
        gap: 0.5rem;
        padding: 0.35rem 0.5rem;
    }
}
@media (max-width: 575.98px) {
    .whiteboard-page .wb-toolbar-drawing .wb-tool-btn {
        padding: 0.25rem 0.4rem;
        min-width: 2rem;
    }
    .whiteboard-page .wb-toolbar-drawing .wb-tool-label-text {
        display: none;
    }
    .whiteboard-page .wb-toolbar-drawing .wb-color-input {
        width: 1.75rem !important;
        height: 1.5rem !important;
    }
    .whiteboard-page .wb-toolbar-drawing .wb-width-input {
        width: 3.25rem !important;
        min-width: 3.25rem;
    }
    .whiteboard-page .wb-toolbar-drawing .wb-color-presets .wb-color-swatch {
        width: 1rem;
        height: 1rem;
    }
    .whiteboard-page .wb-toolbar-actions .wb-tool-save .fa-save,
    .whiteboard-page .wb-toolbar-actions .wb-tool-viewers .fa-users {
        margin-right: 0.25rem;
    }
}
@media (max-width: 991.98px) {
    .whiteboard-page .whiteboard-toolbar .wb-toolbar-btn-text {
        display: none;
    }
    .whiteboard-page .wb-status-badge .wb-status-text {
        display: none;
    }
    .whiteboard-page .wb-toolbar-actions .btn,
    .whiteboard-page .whiteboard-toolbar .wb-tool-exit {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    .whiteboard-page .wb-toolbar-actions .btn i,
    .whiteboard-page .whiteboard-toolbar .wb-tool-exit i {
        margin: 0;
    }
    .whiteboard-page .whiteboard-toolbar .wb-tool-exit {
        min-width: 2.25rem;
    }
}
.whiteboard-page .wb-status-badge .wb-status-icon {
    margin-right: 0.35em;
}
@media (max-width: 991.98px) {
    .whiteboard-page .wb-status-badge .wb-status-icon {
        margin-right: 0;
    }
}
.whiteboard-page #wb-place-hint {
    flex-shrink: 0;
    padding: 0.35rem 0.5rem;
    font-size: 0.875rem;
}
.whiteboard-page .whiteboard-canvas-wrapper {
    flex: 1 1 0;
    min-height: 0;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    background-color: #f8f9fa;
    position: relative;
    border: 1px solid #dee2e6 !important;
    border-radius: 0.375rem !important;
    box-sizing: border-box;
}
.whiteboard-page .whiteboard-canvas-wrapper canvas {
    display: block;
    width: 100%;
    height: 100%;
    touch-action: none;
}
.whiteboard-toolbar .wb-toolbar-title {
    color: #212529;
}
.whiteboard-toolbar .wb-tool-btn {
    border: 1px solid #dee2e6;
    background-color: #fff;
    color: #212529;
}
.whiteboard-toolbar .wb-tool-btn:hover {
    background-color: #e9ecef;
    border-color: #adb5bd;
    color: #212529;
}
.whiteboard-toolbar .wb-tool-btn.active {
    background-color: #0d6efd;
    border-color: #0d6efd;
    color: #fff;
}
.whiteboard-toolbar .wb-tool-clear:hover {
    background-color: #f8d7da;
    border-color: #dc3545;
    color: #dc3545;
}
.whiteboard-toolbar .wb-tool-save:hover {
    background-color: #d1e7dd;
    border-color: #198754;
    color: #198754;
}
.whiteboard-toolbar .wb-tool-viewers {
    background-color: #0d6efd;
    border-color: #0d6efd;
    color: #fff;
}
.whiteboard-toolbar .wb-tool-viewers:hover {
    background-color: #0b5ed7;
    border-color: #0a58ca;
    color: #fff;
}
.whiteboard-toolbar .wb-tool-exit:hover,
.whiteboard-toolbar .wb-tool-exit:focus-visible {
    background-color: rgba(184, 84, 80, 0.12);
    border-color: #b85450;
    color: #a94442;
}
.whiteboard-toolbar .wb-tool-label-text {
    color: #212529;
}
.whiteboard-toolbar .wb-width-input {
    background-color: #fff;
    border-color: #dee2e6;
    color: #212529;
    min-width: 3rem;
}
.whiteboard-page .wb-toolbar-drawing .wb-width-input {
    flex-shrink: 0;
}
.whiteboard-toolbar .wb-color-presets .wb-color-swatch {
    border-color: #dee2e6;
}
.whiteboard-toolbar .wb-color-presets .wb-color-swatch:hover {
    box-shadow: 0 0 0 2px #0d6efd;
}
.whiteboard-toolbar .wb-status-badge {
    color: #fff;
}

/* WHITEBOARD dark */
html[data-theme="dark"] .whiteboard-page .whiteboard-canvas-wrapper {
    background-color: #1a1d23;
    border: 1px solid rgba(165, 180, 252, 0.3) !important;
    border-radius: 0.375rem !important;
}
html[data-theme="dark"] .whiteboard-toolbar .wb-toolbar-title {
    color: #e2e6ed;
}
html[data-theme="dark"] .whiteboard-toolbar .wb-tool-btn {
    border: 1px solid rgba(165, 180, 252, 0.3);
    background-color: rgba(36, 40, 48, 0.8);
    color: #d1d5dc;
}
html[data-theme="dark"] .whiteboard-toolbar .wb-tool-btn:hover {
    background-color: rgba(165, 180, 252, 0.15);
    border-color: rgba(165, 180, 252, 0.5);
    color: #e2e6ed;
}
html[data-theme="dark"] .whiteboard-toolbar .wb-tool-btn.active {
    background-color: rgba(99, 102, 241, 0.6);
    border-color: #6366f1;
    color: #fff;
}
html[data-theme="dark"] .whiteboard-toolbar .wb-tool-clear:hover {
    background-color: rgba(239, 68, 68, 0.2);
    border-color: #ef4444;
    color: #f87171;
}
html[data-theme="dark"] .whiteboard-toolbar .wb-tool-save:hover {
    background-color: rgba(34, 197, 94, 0.2);
    border-color: #22c55e;
    color: #4ade80;
}
html[data-theme="dark"] .whiteboard-toolbar .wb-tool-viewers {
    background-color: rgba(99, 102, 241, 0.7);
    border-color: #6366f1;
    color: #fff;
}
html[data-theme="dark"] .whiteboard-toolbar .wb-tool-viewers:hover {
    background-color: #6366f1;
    border-color: #818cf8;
    color: #fff;
}
html[data-theme="dark"] .whiteboard-toolbar .wb-tool-exit:hover,
html[data-theme="dark"] .whiteboard-toolbar .wb-tool-exit:focus-visible {
    background-color: rgba(239, 68, 68, 0.2);
    border-color: #f87171;
    color: #fca5a5;
}
html[data-theme="dark"] .whiteboard-toolbar .wb-tool-label-text {
    color: #d1d5dc;
}
html[data-theme="dark"] .whiteboard-toolbar .wb-width-input {
    background-color: #242830;
    border-color: rgba(165, 180, 252, 0.3);
    color: #e2e6ed;
}
html[data-theme="dark"] .whiteboard-toolbar .wb-color-presets .wb-color-swatch {
    border-color: rgba(165, 180, 252, 0.3);
}
html[data-theme="dark"] .whiteboard-toolbar .wb-color-presets .wb-color-swatch:hover {
    box-shadow: 0 0 0 2px #818cf8;
}
html[data-theme="dark"] .whiteboard-toolbar .wb-status-badge {
    color: #e2e6ed;
}
html[data-theme="dark"] .whiteboard-toolbar .wb-toolbar-drawing {
    background-color: rgba(165, 180, 252, 0.08);
}
html[data-theme="dark"] .whiteboard-toolbar .wb-status-badge.bg-success {
    background-color: #22c55e !important;
    color: #fff !important;
}
html[data-theme="dark"] .whiteboard-toolbar .wb-status-badge.bg-danger {
    background-color: #ef4444 !important;
    color: #fff !important;
}
html[data-theme="dark"] .whiteboard-toolbar .wb-status-badge.bg-secondary {
    background-color: #4b5563 !important;
    color: #e2e6ed !important;
}
