:root {
    --bg-primary: #ffffff;
    --bg-secondary: #f8f9fa;
    --bg-tertiary: #ecf0f7;
    --bg-accent: #whitesmoke;
    --text-primary: #2c3e50;
    --text-secondary: #34495e;
    --text-muted: #505f79;
    --text-inverse: #ffffff;
    --border-light: #e4e9f0;
    --border-medium: #d1d9e6;
    --border-dark: rgba(0, 0, 0, 0.1);
    --info-bg: #e3f2fd;
    --info-border: #2196f3;
    --info-text: #0b3c5d;
    --info-text-muted: #4a6572;
}

[data-theme="dark"] {
    --bg-primary: #1e1e1e;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #3d3d3d;
    --bg-accent: #404040;
    --text-primary: #e0e0e0;
    --text-secondary: #c0c0c0;
    --text-muted: #a0a0a0;
    --text-inverse: #1e1e1e;
    --border-light: #404040;
    --border-medium: #505050;
    --border-dark: rgba(255, 255, 255, 0.1);
    --info-bg: rgba(33, 150, 243, 0.15);
    --info-border: #42a5f5;
    --info-text: #90caf9;
    --info-text-muted: #c0c0c0;
    --background: #1e1e1e;
    --backgroundInactive: #252525;
    --primary: #2d2d2d;
    --primaryComp: #e0e0e0;
    --primaryHalf: #2d2d2d80;
    --secondary: #729617;
    --secondaryComp: #ffffff;
    --secondaryHover: #94c11e;
    --secondaryMarked: #aad10a;
    --tertiary: #3d3d3d;
    --tertiaryComp: #e0e0e0;
    --tertiaryHover: #4d4d4d;
    --font: #e0e0e0;
    --fontActive: #94c11e;
    --fontActiveHover: #aad10a;
    --fontInactive: #808080;
    --table-background: #1e1e1e;
    --widget-table-background: #1e1e1e;
    --directory-background: #1e1e1e;
    --widget-content-background: #1e1e1e;
    --card-background: #2d2d2d;
    --cc_banner-background: #2d2d2d;
    --avatar-background: #2d2d2d;
    --modal-dialog-background: #1e1e1e;
    --tooltip-background: #2d2d2d;
    --noise-color: radial-gradient(circle, rgba(30,30,30,1) 0%, rgba(64, 64, 64, 0.05) 50%, rgba(30,30,30,1) 100%);
    --noise-img: url("/img/noise-black.png");
    --shadow: rgba(0, 0, 0, 0.5);
    --warn-deleted: rgba(255, 255, 255, 1);
    --warn-deleted-background: rgba(200, 50, 50, 1);
    --warn-disabled: rgba(200, 200, 200, 1);
    --warn-disabled-background: rgba(80, 80, 80, 1);
    --warn-ignored: rgba(200, 200, 200, 1);
    --warn-ignored-background: rgba(60, 60, 80, 1);
    --info-bg: #1f2b3a;
    --info-border: #64b5f6;
    --info-text: #e3f2fd;
    --info-text-muted: #c9d6e3;
    --warn-green: rgba(255, 255, 255, 1);
    --warn-green-background: rgba(60, 120, 60, 1);
    --warn-caution: rgba(30, 30, 30, 1);
    --warn-caution-background: rgba(200, 180, 60, 1);
    --warn-highlight: rgba(30, 30, 30, 1);
    --warn-highlight-background: rgba(80, 120, 180, 1);
    --warn-warning: rgba(30, 30, 30, 1);
    --warn-warning-background: rgba(200, 180, 60, 1);
    --warn-orange: rgba(255, 255, 255, 1);
    --warn-orange-background: rgba(200, 120, 40, 1);
    --warn-error: rgba(255, 255, 255, 1);
    --warn-error-background: rgba(200, 80, 80, 1);
    --warn-critical: rgba(255, 255, 255, 1);
    --warn-critical-background: rgba(180, 60, 60, 1);
    --warn-alert: rgba(255, 255, 255, 1);
    --warn-alert-background: rgba(150, 40, 40, 1);
    --warn-unknown: rgba(200, 200, 200, 1);
    --warn-unknown-background: rgba(60, 60, 60, 1);
    --warn-done: rgba(255, 255, 255, 1);
    --warn-done-background: rgba(60, 120, 60, 1);
    --warn-cancelled: rgba(200, 200, 200, 1);
    --warn-cancelled-background: rgba(80, 80, 120, 1);
    --warn-info: rgba(200, 200, 200, 1);
    --warn-info-background: rgba(60, 60, 80, 1);
    --chart-text-color: #e0e0e0;
    --chart-grid-color: rgba(255, 255, 255, 0.1);
    --chart-border-color: rgba(255, 255, 255, 0.2);
    --chart-background-color: #1e1e1e;
    --chart-legend-color: #e0e0e0;
    --chart-tooltip-bg: #2d2d2d;
    --chart-tooltip-border: #505050;
    --chart-color-primary: #729617;
    --chart-color-secondary: #4A90E2;
    --chart-color-success: #5CB85C;
    --chart-color-warning: #F0AD4E;
    --chart-color-danger: #D9534F;
    --chart-color-info: #5BC0DE;
    --chart-color-purple: #9B59B6;
    --chart-color-orange: #FF8C00;
    --chart-color-pink: #E91E63;
    --chart-color-cyan: #17A2B8;
    --shadow-light: rgba(0, 0, 0, 0.3);
    --shadow-medium: rgba(0, 0, 0, 0.5);
    --shadow-dark: rgba(0, 0, 0, 0.7);
    --accent-blue: #42a5f5;
    --accent-orange: #ff9800;
    --accent-green: #4caf50;
    --faq-answer-bg: #2a2a3a;
}

    .dark-mode-toggle {
        background: none;
        border: 2px solid var(--text-primary);
        color: var(--text-primary);
        border-radius: 20px;
        cursor: pointer;
        font-size: 14px;
        font-weight: 500;
        transition: all 0.3s ease;
        display: flex;
        align-items: center;
        gap: 6px;
        margin-left: 10px;
        white-space: nowrap;
        padding: .35rem .75rem;
        min-width: 83px;
        justify-content: space-evenly;
    }

        .dark-mode-toggle:hover {
            background: var(--text-primary);
            color: var(--bg-primary);
            transform: translateY(-1px);
        }

    [data-theme="dark"] .logo-light {
        display: none;
    }

    [data-theme="dark"] .logo-dark {
        display: inline;
    }

    [data-theme="dark"] #header,
    [data-theme="dark"] .header {
        background: var(--primary);
        color: var(--primaryComp);
        border-bottom-color: var(--border-medium);
        box-shadow: inset 0px -5px 5px 0px rgba(0, 0, 0, 0.3);
    }

    [data-theme="dark"] .header-inner {
        background: transparent;
    }

    [data-theme="dark"] .header.accent {
        background: var(--primary);
        color: var(--primaryComp);
    }

    [data-theme="dark"] #header a,
    [data-theme="dark"] #header a:hover {
        color: var(--text-primary);
    }

    [data-theme="dark"] #header .main-menu li.active > a {
        box-shadow: 0px -3px 5px 2px rgba(0, 0, 0, 0.3);
        background-color: var(--bg-accent);
    }

    [data-theme="dark"] #header .main-menu li .spacer {
        border-top-color: rgba(255, 255, 255, 0.1);
    }

    [data-theme="dark"] #header .main-menu .nav-level-2,
    [data-theme="dark"] #header .main-menu .nav-level-3 {
        background: var(--bg-secondary);
        border: 1px solid var(--border-medium);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
    }

    [data-theme="dark"] #footer,
    [data-theme="dark"] .footer {
        background: var(--primary);
        color: var(--primaryComp);
        box-shadow: inset 0px 5px 5px 0px rgba(0, 0, 0, 0.3);
    }

    [data-theme="dark"] .footer.accent {
        background: var(--primary);
        color: var(--primaryComp);
    }

    [data-theme="dark"] .footer-logo {
        filter: brightness(0.9) contrast(1.1);
    }

    [data-theme="dark"] #footer p {
        color: var(--primaryComp);
    }

    [data-theme="dark"] .widget {
        background: var(--bg-primary);
        border: 1px solid var(--border-light);
    }

    [data-theme="dark"] .widget-header,
    [data-theme="dark"] .widget-footer,
    [data-theme="dark"] .widget-toolbar {
        background: var(--primary);
        color: var(--primaryComp);
    }

    [data-theme="dark"].widget-toolbar .buttons button { 
        color: var(--fontActive);

    }

    [data-theme="dark"] .widget-content {
        background: var(--widget-content-background);
        color: var(--text-primary);
        border-top-color: var(--border-medium);
    }

    [data-theme="dark"] .widget-footer {
        border-top-color: var(--border-medium);
    }

    [data-theme="dark"] .widget-footer.accent {
        background: var(--primary);
        color: var(--primaryComp);
    }

    [data-theme="dark"] .widget-form div.buttons {
        background: var(--primary);
    }

    [data-theme="dark"] .widget.statistics {
        background: var(--bg-primary);
        border: 1px solid var(--border-medium);
    }

    [data-theme="dark"] .widget.statistics .widget-header {
        background: var(--primary);
        color: var(--primaryComp);
    }

    [data-theme="dark"] .widget.statistics .widget-content {
        background: var(--bg-primary);
        color: var(--text-primary);
    }

    [data-theme="dark"] .widget-table {
        background: var(--widget-table-background);
    }

    [data-theme="dark"] .column-settings {
	    background-color: var(--bg-accent);
    }

    [data-theme="dark"] .widget-table th {
        background: var(--bg-secondary);
        color: var(--text-primary);
    }

    [data-theme="dark"] .widget-table td {
        border-color: var(--border-light);
    }

    [data-theme="dark"] .search input {
        border-color: var(--border-medium);
        color: var(--text-primary);
    }

    [data-theme="dark"] .search input::placeholder {
        color: var(--text-muted);
    }

    [data-theme="dark"] .search button {
        color: var(--text-secondary);
    }

    [data-theme="dark"] .search button:hover {
        color: var(--fontActiveHover);
    }

    [data-theme="dark"] .search:focus-within {
        box-shadow: 0 0 10px 1px var(--shadow);
    }

    [data-theme="dark"] #search-form {
        background: var(--bg-accent);
    }

    [data-theme="dark"] #search-form div.inner-search {
        background: var(--bg-primary);
    }

    [data-theme="dark"] #search-form input {
        background: var(--bg-primary);
        color: var(--text-primary);
        border-color: var(--border-medium);
    }

    [data-theme="dark"] .accent,
    [data-theme="dark"] .titlebar,
    [data-theme="dark"] .toolbar {
        background: var(--primary);
        color: var(--primaryComp);
    }

    [data-theme="dark"] .accent p,
    [data-theme="dark"] .accent a {
        color: var(--primaryComp);
    }

    [data-theme="dark"] .logo,
    [data-theme="dark"] .logo img {
        filter: brightness(0.9) contrast(1.1);
        opacity: 0.95;
    }

    [data-theme="dark"] .card {
        background: var(--card-background);
        border-color: var(--border-medium);
    }

    [data-theme="dark"] .modal,
    [data-theme="dark"] .modal-dialog,
    [data-theme="dark"] .modal-content {
        color: var(--text-primary);
    }

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

    [data-theme="dark"] .modal-footer {
        border-top-color: var(--border-medium);
    }

    [data-theme="dark"] .modal iframe {
        background-color: var(--bg-primary);
    }

    [data-theme="dark"] .activity-content {
        background-color: lightgray;
    }

    [data-theme="dark"] .table,
    [data-theme="dark"] table {
        background: var(--table-background);
        color: var(--text-primary);
    }

    [data-theme="dark"] .table th,
    [data-theme="dark"] table th,
    [data-theme="dark"] th {
        background: var(--bg-secondary);
        color: var(--text-primary);
        border-color: var(--border-medium);
    }

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

    [data-theme="dark"] .table tr:hover,
    [data-theme="dark"] table tr:hover,
    [data-theme="dark"] tr:hover {
        background: var(--bg-secondary);
    }

    [data-theme="dark"] .tickets-table td:has(> input:checked) {
        background: #2a5f2a !important;
    }

    [data-theme="dark"] input,
    [data-theme="dark"] textarea,
    [data-theme="dark"] select,
    [data-theme="dark"] input[type="text"],
    [data-theme="dark"] input[type="email"],
    [data-theme="dark"] input[type="password"],
    [data-theme="dark"] input[type="search"] {
        background: var(--bg-secondary);
        border-color: var(--border-medium);
        color: var(--text-primary);
    }

    [data-theme="dark"] input::placeholder,
    [data-theme="dark"] textarea::placeholder {
        color: var(--text-muted);
    }

    [data-theme="dark"] div.sceditor-toolbar div.sceditor-group {
        background-color:var(--bg-primary) !important
    }

    [data-theme="dark"] input:focus,
    [data-theme="dark"] textarea:focus,
    [data-theme="dark"] select:focus,
    [data-theme="dark"] input[type="text"]:focus,
    [data-theme="dark"] input[type="email"]:focus,
    [data-theme="dark"] input[type="password"]:focus,
    [data-theme="dark"] input[type="search"]:focus {
        background: var(--bg-primary);
        color: var(--text-primary);
        border-color: var(--secondary);
        box-shadow: 0 0 0 2px rgba(114, 150, 23, 0.2);
    }

    [data-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__rendered {
        color: var(--text-primary) !important;
    }

    [data-theme="dark"] button,
    [data-theme="dark"] .button {
        color: var(--text-primary);
        border-color: var(--border-medium);
        background-color: var(--bg-secondary) !important;
    }

    [data-theme="dark"] button:hover,
    [data-theme="dark"] .button:hover {
        background: var(--bg-accent);
        color: var(--text-primary);
    }

    [data-theme="dark"] button:disabled {
        color: var(--text-muted);
        border-color: var(--border-light);
    }

    [data-theme="dark"] button.active {
        color: var(--text-inverse);
        background: var(--secondary);
    }

    [data-theme="dark"] .alert {
        background: var(--bg-tertiary);
        border-color: var(--border-medium);
        color: var(--text-primary);
    }

    [data-theme="dark"] .alert-success {
        background-color: rgba(76, 175, 80, 0.2);
        color: var(--accent-green);
        border-color: var(--accent-green);
    }

    [data-theme="dark"] .alert-warning {
        background-color: rgba(255, 152, 0, 0.2);
        color: var(--accent-orange);
        border-color: var(--accent-orange);
    }

    [data-theme="dark"] .alert-danger {
        background-color: rgba(244, 67, 54, 0.2);
        color: #f44336;
        border-color: #f44336;
    }

    [data-theme="dark"] .alert-info {
        background-color: rgba(66, 165, 245, 0.2);
        color: var(--accent-blue);
        border-color: var(--accent-blue);
    }

    [data-theme="dark"] .badge {
        background: var(--secondary);
        color: var(--secondaryComp);
    }

    [data-theme="dark"] div.mailbox .inbox-navigation .menu-messages {
        background: var(--bg-primary);
    }

    [data-theme="dark"] div.mailbox .inbox-navigation .menu-messages a.button {
        color: var(--text-primary);
    }

    [data-theme="dark"] div.mailbox .inbox-navigation .menu-messages a.active {
        background: var(--secondary);
        color: var(--text-inverse);
    }

    [data-theme="dark"] div.edit-page .messages {
        background: var(--bg-primary);
    }

        [data-theme="dark"] div.edit-page .messages div.preview .preview-inner {
            border-bottom-color: var(--border-dark);
        }

        [data-theme="dark"] div.edit-page .messages div.marked,
        [data-theme="dark"] div.edit-page .messages div.selected-message {
            background: var(--secondary);
            color: var(--text-inverse);
        }

    [data-theme="dark"] #message .actions,
    [data-theme="dark"] #message .message-title,
    [data-theme="dark"] #message .content,
    [data-theme="dark"] #message .message-multi {
        background: var(--bg-primary);
        color: var(--text-primary);
    }

    [data-theme="dark"] div.edit-page .messages div.preview .preview-inner {
        border-bottom: 1px solid var(--border-dark);
    }

    [data-theme="dark"] div.edit-page .messages div.preview.unread {
        border-left: 5px solid var(--font, var(--text-primary));
    }

    [data-theme="dark"] div.edit-page .messages div.marked,
    [data-theme="dark"] div.edit-page .messages div.selected-message {
        background: var(--secondary);
        color: var(--text-inverse);
    }

    [data-theme="dark"] .select2-container--default .select2-selection--single,
    [data-theme="dark"] .select2-container--default .select2-selection--multiple {
        background: var(--bg-primary);
        border-color: var(--border-medium);
        color: var(--text-primary);
    }

    [data-theme="dark"] .select2-dropdown {
        background: var(--bg-secondary);
        border-color: var(--border-medium);
    }

    [data-theme="dark"] .select2-results__option,
    [data-theme="dark"] .select2-container--default .select2-results__option {
        background: var(--bg-primary);
        color: var(--text-primary);
    }

    [data-theme="dark"] .select2-results__option--highlighted {
        background: var(--secondary);
        color: var(--secondaryComp);
    }

    [data-theme="dark"] ul.select2-results__options li:hover {
        background: var(--secondary);
        color: var(--text-inverse);
    }

    [data-theme="dark"] .input ul.enumeration li.email-receiver {
        background: var(--bg-primary);
        color: var(--text-primary);
        box-shadow: 0 3px 1px -2px var(--shadow-light), 0 2px 2px var(--shadow-light), 0 1px 5px var(--shadow-light);
    }

    [data-theme="dark"] .faq-main h1 {
        color: var(--text-secondary);
    }

    [data-theme="dark"] .faq-main .faq-container {
        background: var(--bg-primary);
        box-shadow: 0 8px 20px var(--shadow-light);
    }

    [data-theme="dark"] .faq-main h2.faq-category {
        color: var(--text-secondary);
        border-bottom: 2px solid var(--border-medium);
    }

    [data-theme="dark"] .faq-main .faq-item {
        border-bottom: 1px solid var(--border-light);
    }

    [data-theme="dark"] .faq-main .faq-question {
        color: var(--text-secondary);
        background: var(--bg-tertiary);
    }

        [data-theme="dark"] .faq-main .faq-question:hover,
        [data-theme="dark"] .faq-main .faq-item.open .faq-question {
            background: var(--secondary);
            box-shadow: inset 0 0 0 2px var(--text-primary);
        }

        [data-theme="dark"] .faq-main .faq-question::after {
            color: var(--text-primary);
        }

    [data-theme="dark"] .faq-main .faq-item.open .faq-question::after {
        color: var(--text-inverse);
    }

    [data-theme="dark"] .faq-main .faq-answer {
        color: var(--text-muted);
        border-left: 3px solid var(--secondary);
    }

    [data-theme="dark"] .faq-main .faq-item.open .faq-answer {
        background: var(--faq-answer-bg);
    }

    [data-theme="dark"] .faq-main .faq-container {
        background: var(--bg-primary);
        box-shadow: 0 8px 20px var(--shadow-light);
    }

    [data-theme="dark"] .faq-main .faq-item.open .faq-answer {
        background: var(--bg-tertiary);
        border-left-color: var(--secondary);
    }


    [data-theme="dark"] .modal-dialog,
    [data-theme="dark"] #add-users-dialog .modal-dialog,
    [data-theme="dark"] .get-message-dialog,
    [data-theme="dark"] .pick-user-dialog {
        color: var(--text-primary);
    }

    [data-theme="dark"] #add-users-dialog .modal-dialog .add-users-dialog-form div.add-users-buttons,
    [data-theme="dark"] .add-users-dialog-form div.add-users-buttons {
        background: var(--primary);
    }

    [data-theme="dark"] canvas {
        background: var(--bg-primary) !important;
        border-radius: 8px;
    }

    [data-theme="dark"] .widget canvas {
        background: var(--bg-primary) !important;
    }

    [data-theme="dark"] div.mainPanel {
        min-height: var(--footer-min-height);
        background: var(--noise-img);
    }

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

    [data-theme="dark"] .chart-container {
        background: var(--bg-primary);
        padding: 1rem;
        border-radius: 8px;
        border: 1px solid var(--border-light);
    }

    [data-theme="dark"] .chart-legend {
        color: var(--text-primary);
    }

    [data-theme="dark"] .chart-legend-item {
        color: var(--text-primary);
    }

    [data-theme="dark"] .chartjs-tooltip {
        background: var(--chart-tooltip-bg);
        border: 1px solid var(--chart-tooltip-border);
        color: var(--text-primary);
    }

    [data-theme="dark"] .widget:hover canvas {
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
        transition: box-shadow 0.3s ease;
    }

    [data-theme="dark"] body {
        color: var(--text-primary);
        transition: background-color 0.3s ease, color 0.3s ease;
    }

    [data-theme="dark"] div.mailbox .inbox-navigation .menu-messages,
    [data-theme="dark"] div.edit-page .messages,
    [data-theme="dark"] #message .actions,
    [data-theme="dark"] #message .message-title,
    [data-theme="dark"] #message .content,
    [data-theme="dark"] #message .message-multi {
        background: var(--bg-primary) !important;
        color: var(--text-primary);
    }

    [data-theme="dark"] .tooltip {
        background: var(--tooltip-background);
        color: var(--text-primary);
        border-color: var(--border-medium);
    }

    [data-theme="dark"] .tooltip-arrow {
        border-color: var(--border-medium) transparent;
    }

    [data-theme="dark"] .dropdown,
    [data-theme="dark"] .dropdown-menu {
        background-color: var(--bg-primary);
        color: var(--text-primary);
        border-color: var(--border-medium);
    }

    [data-theme="dark"] .dropdown-item:hover {
        background-color: var(--bg-tertiary);
    }

    [data-theme="dark"] a {
        color: var(--accent-blue);
    }

        [data-theme="dark"] a:hover {
            color: var(--accent-blue);
        }

    [data-theme="dark"] .sceditor-container {
        background: var(--bg-primary);
        border-color: var(--border-medium);
    }

    [data-theme="dark"] .directory {
        background: var(--directory-background);
    }

    [data-theme="dark"] .cc_banner-wrapper {
        background: var(--cc_banner-background);
        color: var(--text-primary);
    }

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

    [data-theme="dark"] .avatar {
        border-color: var(--border-medium);
    }

    [data-theme="dark"] .nav-menu-icon a {
        color: var(--text-primary);
    }

        [data-theme="dark"] .nav-menu-icon a:hover {
            color: var(--fontActiveHover);
        }

    [data-theme="dark"] .breadcrumb {
        background: var(--bg-secondary);
        color: var(--text-primary);
    }

    [data-theme="dark"] .breadcrumb-item a {
        color: var(--fontActive);
    }

    [data-theme="dark"] .breadcrumb-item.active {
        color: var(--text-muted);
    }

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

    [data-theme="dark"] .progress-bar {
        background: var(--secondary);
    }

    [data-theme="dark"] .pagination {
        background: var(--bg-primary);
    }

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

        [data-theme="dark"] .page-link:hover {
            background: var(--secondary);
            color: var(--secondaryComp);
        }

    [data-theme="dark"] .page-item.active .page-link {
        background: var(--secondary);
        border-color: var(--secondary);
    }

    [data-theme="dark"] code,
    [data-theme="dark"] pre {
        background: var(--bg-tertiary);
        color: var(--text-primary);
        border-color: var(--border-medium);
    }

    [data-theme="dark"] ::selection {
        background: var(--secondary);
        color: var(--secondaryComp);
    }

    [data-theme="dark"] ::-moz-selection {
        background: var(--secondary);
        color: var(--secondaryComp);
    }


    [data-theme="dark"] div.sortable div.widget.ui-sortable-helper {
        background: var(--bg-primary);
        box-shadow: 0 0 0.875rem 0 rgba(255, 255, 255, 0.2);
        border: 1px solid var(--border-medium);
    }

    [data-theme="dark"] .widget-form div.buttons {
        background: var(--primary);
    }

    [data-theme="dark"] ::-webkit-scrollbar {
        width: 8px;
        height: 8px;
        background: var(--bg-secondary);
    }

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

    [data-theme="dark"] ::-webkit-scrollbar-thumb {
        background: var(--bg-accent);
        border-radius: 4px;
    }

    [data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
        background: var(--border-medium);
    }

    [data-theme="dark"] * {
        transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
    }




@media (max-width: 768px) {
    .dark-mode-toggle {
        padding: 6px 10px;
        font-size: 12px;
        margin-left: 5px;
    }

        .dark-mode-toggle span {
            display: none;
        }
}


@media (max-width: 768px) {
    [data-theme="dark"] .dark-mode-toggle {
        padding: 6px 10px;
        font-size: 12px;
        margin-left: 5px;
    }

    [data-theme="dark"] .dark-mode-toggle span {
        display: none;
    }

    [data-theme="dark"] .mobile-menu {
        background-color: var(--bg-primary);
    }

    [data-theme="dark"] .mobile-header {
        background-color: var(--bg-primary);
        border-bottom-color: var(--border-medium);
    }
}

@media (max-width: 420px) {
    [data-theme="dark"] .faq-main .faq-container {
        padding: 2rem 1.5rem 2.5rem;
    }

    [data-theme="dark"] .faq-main .faq-question {
        font-size: 1rem;
        padding: 0.6rem 1rem;
    }

    [data-theme="dark"] .faq-main h2.faq-category {
        font-size: 1.4rem;
    }
}

@media print {
    [data-theme="dark"] * {
        background: white !important;
        color: black !important;
    }
}

[data-theme="dark"] .textblock-dialog {
    background: var(--bg-primary, #1e1e1e);
    color: var(--text-primary, #e0e0e0);
    border: 1px solid var(--border-light, #404040);
}

[data-theme="dark"] .textblock-dialog h3 {
    color: var(--text-primary, #e0e0e0);
}

[data-theme="dark"] .textblock-list li {
    border-color: var(--border-light, #404040);
    background-color: var(--bg-secondary, #2d2d2d);
}

[data-theme="dark"] .textblock-list li:hover {
    background-color: var(--bg-tertiary, #3d3d3d);
}

[data-theme="dark"] .textblock-list li.selected {
    background-color: var(--bg-accent, #404040);
    border-color: var(--secondary, #729617);
}

[data-theme="dark"] .textblock-list li strong {
    color: var(--text-primary, #e0e0e0);
}

[data-theme="dark"] .textblock-list li small {
    color: var(--text-muted, #a0a0a0);
}

[data-theme="dark"] .textblock-error {
    color: var(--warn-error, #ff6b6b);
}