/* =========================================================
   Late overrides for LK dark theme
   Loaded at the very end of the page to override per-page
   inline <style> blocks that hardcode light colors.
   ========================================================= */

/* Base */
html[data-theme="dark"],
html[data-layout-mode="dark"] {
    color-scheme: dark;
}

body[data-layout-mode="dark"] {
    background-color: var(--lk-bg, #0b0f14) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

/* Force Bootstrap variables to dark in LK */
body[data-layout-mode="dark"] {
    --bs-body-bg: var(--lk-bg, #0b0f14) !important;
    --bs-body-color: var(--lk-text, #e5e7eb) !important;
    --bs-border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    --bs-border-color-translucent: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;

    --bs-card-bg: var(--lk-surface, #121821) !important;
    --bs-modal-bg: var(--lk-surface, #121821) !important;
    --bs-offcanvas-bg: var(--lk-surface, #121821) !important;
    --bs-dropdown-bg: var(--lk-surface, #121821) !important;
    --bs-popover-bg: var(--lk-surface, #121821) !important;
    --bs-toast-background-color: var(--lk-surface, #121821) !important;

    --bs-secondary-color: var(--lk-muted, rgba(229, 231, 235, 0.72)) !important;
    --bs-tertiary-color: var(--lk-muted, rgba(229, 231, 235, 0.72)) !important;
}

/* Page wrappers often hardcode light backgrounds */
body[data-layout-mode="dark"] .page-content-wrapper,
body[data-layout-mode="dark"] .page-content,
body[data-layout-mode="dark"] .main-content,
body[data-layout-mode="dark"] .container-fluid {
    background-color: transparent !important;
}

/* Many pages set wrapper background via `background:` (gradients). Force dark. */
body[data-layout-mode="dark"] .page-content-wrapper {
    background: var(--lk-bg, #0b0f14) !important;
}

/* Bootstrap light utility classes frequently used in per-page styles */
body[data-layout-mode="dark"] .bg-white,
body[data-layout-mode="dark"] .bg-light {
    background-color: var(--lk-surface, #121821) !important;
}

body[data-layout-mode="dark"] .text-dark {
    color: var(--lk-text, #e5e7eb) !important;
}

/* Catch the most common hardcoded inline styles */
body[data-layout-mode="dark"] [style*="background: #fff"],
body[data-layout-mode="dark"] [style*="background:#fff"],
body[data-layout-mode="dark"] [style*="background: #ffffff"],
body[data-layout-mode="dark"] [style*="background:#ffffff"],
body[data-layout-mode="dark"] [style*="background-color: #fff"],
body[data-layout-mode="dark"] [style*="background-color:#fff"],
body[data-layout-mode="dark"] [style*="background-color: #ffffff"],
body[data-layout-mode="dark"] [style*="background-color:#ffffff"],
body[data-layout-mode="dark"] [style*="background: rgb(255, 255, 255)"],
body[data-layout-mode="dark"] [style*="background-color: rgb(255, 255, 255)"] {
    background-color: var(--lk-surface, #121821) !important;
}

/* Kill inline gradients (common source of "white islands") */
body[data-layout-mode="dark"] [style*="linear-gradient("],
body[data-layout-mode="dark"] [style*="radial-gradient("] {
    background-image: none !important;
    background: var(--lk-surface, #121821) !important;
    color: var(--lk-text, #e5e7eb) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

/* Same idea for common light grays used as surfaces */
body[data-layout-mode="dark"] [style*="background: #f8f9fa"],
body[data-layout-mode="dark"] [style*="background:#f8f9fa"],
body[data-layout-mode="dark"] [style*="background-color: #f8f9fa"],
body[data-layout-mode="dark"] [style*="background-color:#f8f9fa"],
body[data-layout-mode="dark"] [style*="background: #f4f5f9"],
body[data-layout-mode="dark"] [style*="background:#f4f5f9"],
body[data-layout-mode="dark"] [style*="background-color: #f4f5f9"],
body[data-layout-mode="dark"] [style*="background-color:#f4f5f9"],
body[data-layout-mode="dark"] [style*="background: #f5f7fa"],
body[data-layout-mode="dark"] [style*="background:#f5f7fa"],
body[data-layout-mode="dark"] [style*="background-color: #f5f7fa"],
body[data-layout-mode="dark"] [style*="background-color:#f5f7fa"],
body[data-layout-mode="dark"] [style*="background: #e8ecf1"],
body[data-layout-mode="dark"] [style*="background:#e8ecf1"],
body[data-layout-mode="dark"] [style*="background-color: #e8ecf1"],
body[data-layout-mode="dark"] [style*="background-color:#e8ecf1"],
body[data-layout-mode="dark"] [style*="background: #e9ecef"],
body[data-layout-mode="dark"] [style*="background:#e9ecef"],
body[data-layout-mode="dark"] [style*="background-color: #e9ecef"],
body[data-layout-mode="dark"] [style*="background-color:#e9ecef"],
body[data-layout-mode="dark"] [style*="background: #f1f3f5"],
body[data-layout-mode="dark"] [style*="background:#f1f3f5"],
body[data-layout-mode="dark"] [style*="background-color: #f1f3f5"],
body[data-layout-mode="dark"] [style*="background-color:#f1f3f5"] {
    background-color: rgba(148, 163, 184, 0.10) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] [style*="color: #000"],
body[data-layout-mode="dark"] [style*="color:#000"],
body[data-layout-mode="dark"] [style*="color: #111"],
body[data-layout-mode="dark"] [style*="color:#111"],
body[data-layout-mode="dark"] [style*="color: rgb(0, 0, 0)"] {
    color: var(--lk-text, #e5e7eb) !important;
}

/* Common hardcoded "light theme" text colors inside inline styles */
body[data-layout-mode="dark"] [style*="color: #1f2d3d"],
body[data-layout-mode="dark"] [style*="color:#1f2d3d"],
body[data-layout-mode="dark"] [style*="color: #111827"],
body[data-layout-mode="dark"] [style*="color:#111827"],
body[data-layout-mode="dark"] [style*="color: #2d3a4d"],
body[data-layout-mode="dark"] [style*="color:#2d3a4d"],
body[data-layout-mode="dark"] [style*="color: #495057"],
body[data-layout-mode="dark"] [style*="color:#495057"],
body[data-layout-mode="dark"] [style*="color: #2c3e50"],
body[data-layout-mode="dark"] [style*="color:#2c3e50"] {
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] [style*="color: #6c757d"],
body[data-layout-mode="dark"] [style*="color:#6c757d"],
body[data-layout-mode="dark"] [style*="color: #6b7280"],
body[data-layout-mode="dark"] [style*="color:#6b7280"],
body[data-layout-mode="dark"] [style*="color: #778296"],
body[data-layout-mode="dark"] [style*="color:#778296"] {
    color: var(--lk-muted, rgba(229, 231, 235, 0.72)) !important;
}

/* Inline borders frequently hardcoded in pages */
body[data-layout-mode="dark"] [style*="border: 1px solid #e9ecef"],
body[data-layout-mode="dark"] [style*="border:1px solid #e9ecef"],
body[data-layout-mode="dark"] [style*="border-color: #e9ecef"],
body[data-layout-mode="dark"] [style*="border-color:#e9ecef"],
body[data-layout-mode="dark"] [style*="border: 1px solid #dee2e6"],
body[data-layout-mode="dark"] [style*="border:1px solid #dee2e6"],
body[data-layout-mode="dark"] [style*="border-color: #dee2e6"],
body[data-layout-mode="dark"] [style*="border-color:#dee2e6"] {
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

/* Bootstrap-ish surfaces */
body[data-layout-mode="dark"] .card,
body[data-layout-mode="dark"] .modal-content,
body[data-layout-mode="dark"] .offcanvas,
body[data-layout-mode="dark"] .dropdown-menu,
body[data-layout-mode="dark"] .list-group-item,
body[data-layout-mode="dark"] .accordion-item,
body[data-layout-mode="dark"] .accordion-body,
body[data-layout-mode="dark"] .offcanvas-body {
    background-color: var(--lk-surface, #121821) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] .card-header,
body[data-layout-mode="dark"] .card-footer,
body[data-layout-mode="dark"] .modal-header,
body[data-layout-mode="dark"] .modal-footer,
body[data-layout-mode="dark"] .offcanvas-header {
    background-color: transparent !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

/* Tabs / pills */
body[data-layout-mode="dark"] .nav-tabs,
body[data-layout-mode="dark"] .nav-pills {
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

body[data-layout-mode="dark"] .nav-tabs .nav-link,
body[data-layout-mode="dark"] .nav-pills .nav-link {
    color: var(--lk-muted, rgba(229, 231, 235, 0.72)) !important;
    border-color: transparent !important;
}

body[data-layout-mode="dark"] .nav-tabs .nav-link.active,
body[data-layout-mode="dark"] .nav-pills .nav-link.active {
    color: var(--lk-text, #e5e7eb) !important;
    background-color: rgba(148, 163, 184, 0.10) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

body[data-layout-mode="dark"] .tab-content {
    background: transparent !important;
}

/* Tables */
body[data-layout-mode="dark"] .table {
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] .table thead th,
body[data-layout-mode="dark"] .table thead td {
    background-color: rgba(148, 163, 184, 0.08) !important;
    color: var(--lk-muted, rgba(229, 231, 235, 0.72)) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

/* Some pages set thead background gradient directly */
body[data-layout-mode="dark"] .table thead {
    background: rgba(148, 163, 184, 0.08) !important;
}

body[data-layout-mode="dark"] .table tbody td,
body[data-layout-mode="dark"] .table tbody th {
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

body[data-layout-mode="dark"] .table-hover tbody tr:hover {
    background-color: rgba(148, 163, 184, 0.08) !important;
}

/* Forms */
body[data-layout-mode="dark"] .form-control,
body[data-layout-mode="dark"] .form-select,
body[data-layout-mode="dark"] textarea.form-control {
    background-color: rgba(18, 24, 33, 0.85) !important;
    color: var(--lk-text, #e5e7eb) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

body[data-layout-mode="dark"] .form-control::placeholder,
body[data-layout-mode="dark"] textarea.form-control::placeholder {
    color: rgba(229, 231, 235, 0.45) !important;
}

body[data-layout-mode="dark"] .form-text,
body[data-layout-mode="dark"] .text-muted {
    color: var(--lk-muted, rgba(229, 231, 235, 0.72)) !important;
}

/* Alerts */
body[data-layout-mode="dark"] .alert {
    background-color: rgba(148, 163, 184, 0.10) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

/* License / Products pages often hardcode custom light cards */
body[data-layout-mode="dark"] .file-item-card,
body[data-layout-mode="dark"] .accordion-content,
body[data-layout-mode="dark"] .accordion-row,
body[data-layout-mode="dark"] .ratings-layout-shell,
body[data-layout-mode="dark"] .form-section,
body[data-layout-mode="dark"] .ratings-admin-shell,
body[data-layout-mode="dark"] .admin-form-section {
    background-color: var(--lk-surface, #121821) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] .file-name,
body[data-layout-mode="dark"] .page-title,
body[data-layout-mode="dark"] .form-section-title,
body[data-layout-mode="dark"] .ratings-hero-main h4,
body[data-layout-mode="dark"] .ratings-tabs-nav .nav-link.active {
    color: var(--lk-text, #e5e7eb) !important;
    -webkit-text-fill-color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] .page-subtitle,
body[data-layout-mode="dark"] .file-meta,
body[data-layout-mode="dark"] .ratings-hero-main p,
body[data-layout-mode="dark"] .ratings-tabs-nav .nav-link,
body[data-layout-mode="dark"] .ratings-admin-hero-main p,
body[data-layout-mode="dark"] .ratings-filters .form-label,
body[data-layout-mode="dark"] .admin-tabs-nav .nav-link {
    color: var(--lk-muted, rgba(229, 231, 235, 0.72)) !important;
}

body[data-layout-mode="dark"] .ratings-admin-hero,
body[data-layout-mode="dark"] .ratings-filters,
body[data-layout-mode="dark"] .admin-tabs-nav {
    background-color: var(--lk-surface, #121821) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] .admin-tabs-nav .nav-link.active {
    color: var(--lk-text, #e5e7eb) !important;
}

/* News / KB viewers: custom cards, skeletons, comments */
body[data-layout-mode="dark"] .news-card,
body[data-layout-mode="dark"] .comment-item,
body[data-layout-mode="dark"] .comments-section {
    background-color: var(--lk-surface, #121821) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] .skeleton-card {
    background: linear-gradient(90deg, rgba(148, 163, 184, 0.10) 25%, rgba(148, 163, 184, 0.18) 50%, rgba(148, 163, 184, 0.10) 75%) !important;
    background-size: 200% 100% !important;
}

/* Links */
body[data-layout-mode="dark"] a {
    color: var(--primary-color, #4A9BD4) !important;
}
body[data-layout-mode="dark"] a:hover {
    color: var(--primary-light, #6BB3E8) !important;
}

/* Buttons: keep readable text in dark */
body[data-layout-mode="dark"] .btn.btn-success,
body[data-layout-mode="dark"] .btn.btn-success.btn-lg,
body[data-layout-mode="dark"] a.btn.btn-success {
    color: #ffffff !important;
}

body[data-layout-mode="dark"] .btn.btn-success i,
body[data-layout-mode="dark"] a.btn.btn-success i {
    color: #ffffff !important;
}

body[data-layout-mode="dark"] .btn.btn-success:hover,
body[data-layout-mode="dark"] a.btn.btn-success:hover {
    color: #ffffff !important;
}

/* News admin: actions context menu */
body[data-layout-mode="dark"] .news-actions-menu {
    background: var(--lk-surface, #121821) !important;
    border: 1px solid var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    box-shadow: 0 18px 45px rgba(0,0,0,0.55) !important;
}

body[data-layout-mode="dark"] .news-actions-menu .news-menu-item {
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] .news-actions-menu .news-menu-item:hover,
body[data-layout-mode="dark"] .news-actions-menu .news-menu-item:focus {
    background-color: rgba(148, 163, 184, 0.10) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

/* Knowledge base: view-content blocks inside offcanvas */
body[data-layout-mode="dark"] .view-content,
body[data-layout-mode="dark"] #articleViewContent {
    background-color: transparent !important;
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] .view-content * {
    background-color: transparent !important;
}

/* Products / distributions: custom download button */
body[data-layout-mode="dark"] a.download-btn,
body[data-layout-mode="dark"] .download-btn {
    color: #ffffff !important;
}

body[data-layout-mode="dark"] a.download-btn:hover,
body[data-layout-mode="dark"] .download-btn:hover {
    color: #ffffff !important;
}

/* Ratings (client): hero block background */
body[data-layout-mode="dark"] .ratings-hero {
    background-color: var(--lk-surface, #121821) !important;
    border-bottom-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

/* FAQ cards: accordion items with mixed light utility badges */
body[data-layout-mode="dark"] .accordion-item.faq-card {
    background-color: var(--lk-surface, #121821) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

body[data-layout-mode="dark"] .accordion-item.faq-card .accordion-body {
    background-color: var(--lk-surface, #121821) !important;
}

body[data-layout-mode="dark"] .accordion-item.faq-card .badge.bg-light {
    background-color: rgba(148, 163, 184, 0.12) !important;
    color: var(--primary-color, #4A9BD4) !important;
}

/* ===============================
   Support (tickets) offcanvas
   =============================== */
body[data-layout-mode="dark"] #ticketDetailOffcanvas .offcanvas-body,
body[data-layout-mode="dark"] #ticketDetailOffcanvas .offcanvas-body#ticketDetailBody {
    background: var(--lk-bg, #0b0f14) !important;
}

body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-detail-info,
body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-detail-description,
body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-info-item {
    background: var(--lk-surface, #121821) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    color: var(--lk-text, #e5e7eb) !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.45) !important;
}

body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-detail-title,
body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-comments-section h6,
body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-info-item .info-value {
    color: var(--primary-color, #4A9BD4) !important;
}

body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-info-item strong {
    color: var(--lk-muted, rgba(229, 231, 235, 0.72)) !important;
}

body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-attachments-divider {
    background: linear-gradient(90deg, transparent 0%, var(--lk-border, rgba(148, 163, 184, 0.18)) 20%, var(--lk-border, rgba(148, 163, 184, 0.18)) 80%, transparent 100%) !important;
}

/* Conversation messages (were light gradients in page CSS) */
body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-message {
    background: var(--lk-surface, #121821) !important;
    border: 1px solid var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-message.client {
    border-left: 4px solid rgba(74, 155, 212, 0.85);
}

body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-message.support {
    border-left: 4px solid rgba(143, 164, 46, 0.85);
}

body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-message.private-comment {
    border-left: 4px solid rgba(209, 139, 58, 0.85);
}

/* Fix "white stripes" inside rich text (force transparent backgrounds) */
body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-message-content,
body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-message-content *,
body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-detail-description,
body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-detail-description * {
    background-color: transparent !important;
}

body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-message-content,
body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-detail-description {
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-message-content pre,
body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-message-content code,
body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-detail-description pre,
body[data-layout-mode="dark"] #ticketDetailOffcanvas .ticket-detail-description code {
    background-color: rgba(148, 163, 184, 0.10) !important;
    border: 1px solid var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

/* Add comment form block */
body[data-layout-mode="dark"] #ticketDetailOffcanvas .comment-form {
    background: rgba(18, 24, 33, 0.85) !important;
    border: 1px solid var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

/* Quill editor (support-lk) */
body[data-layout-mode="dark"] .ql-toolbar,
body[data-layout-mode="dark"] .ql-container {
    background-color: rgba(18, 24, 33, 0.85) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

body[data-layout-mode="dark"] .ql-editor {
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] .ql-editor.ql-blank::before {
    color: rgba(229, 231, 235, 0.55) !important;
}

body[data-layout-mode="dark"] .ql-snow .ql-stroke {
    stroke: rgba(229, 231, 235, 0.85) !important;
}

body[data-layout-mode="dark"] .ql-snow .ql-fill {
    fill: rgba(229, 231, 235, 0.85) !important;
}

body[data-layout-mode="dark"] .ql-snow .ql-picker,
body[data-layout-mode="dark"] .ql-snow .ql-picker-label,
body[data-layout-mode="dark"] .ql-snow .ql-picker-options {
    color: rgba(229, 231, 235, 0.85) !important;
    background-color: rgba(18, 24, 33, 0.95) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

body[data-layout-mode="dark"] .ql-snow .ql-picker-options .ql-picker-item:hover,
body[data-layout-mode="dark"] .ql-snow .ql-picker-options .ql-picker-item.ql-selected {
    background-color: rgba(148, 163, 184, 0.12) !important;
}

/* ===============================
   Ratings (client) tabs header
   =============================== */
body[data-layout-mode="dark"] .ratings-tabs-nav {
    background: var(--lk-surface, #121821) !important;
    border-bottom-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

body[data-layout-mode="dark"] .ratings-tabs-nav .nav-link.active {
    color: var(--lk-text, #e5e7eb) !important;
}

/* Dashboard "Создать обращение" button: force bright white text/icon in dark */
body[data-layout-mode="dark"] .hero-btn.primary,
body[data-layout-mode="dark"] .hero-btn.primary i {
    color: #ffffff !important;
}

/* Users info blocks (client + admin visual) */
body[data-layout-mode="dark"] .user-info-row {
    background-color: rgba(18, 24, 33, 0.70) !important;
    border: 1px solid var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

body[data-layout-mode="dark"] .user-info-label {
    color: var(--lk-muted, rgba(229, 231, 235, 0.72)) !important;
}

body[data-layout-mode="dark"] .user-info-value {
    color: var(--lk-text, #e5e7eb) !important;
}

/* ===============================
   Knowledge base offcanvas + FAQ
   =============================== */
body[data-layout-mode="dark"] .offcanvas-pretty {
    --bs-offcanvas-bg: var(--lk-surface, #121821) !important;
    --bs-offcanvas-border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

/* Interactive help / overlays (if enabled somewhere) */
body[data-layout-mode="dark"] .interactive-help,
body[data-layout-mode="dark"] .interactive-help * {
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

body[data-layout-mode="dark"] .interactive-help-tooltip,
body[data-layout-mode="dark"] .interactive-help-popover,
body[data-layout-mode="dark"] .interactive-help-card {
    background-color: var(--lk-surface, #121821) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

/* Auth pages (login / forgot / register): make authentication-bg dark when cookie theme is dark */
body[data-layout-mode="dark"] .authentication-bg,
html[data-layout-mode="dark"] body .authentication-bg {
    background: radial-gradient(1200px 600px at 20% 0%, rgba(74, 155, 212, 0.10), transparent 60%),
                radial-gradient(900px 500px at 90% 10%, rgba(209, 139, 58, 0.10), transparent 60%),
                linear-gradient(180deg, #0b0f14 0%, #0b0f14 100%) !important;
}

body[data-layout-mode="dark"] .authentication-bg .card,
body[data-layout-mode="dark"] .authentication-bg .card-body,
body[data-layout-mode="dark"] .authentication-bg .info-card {
    background-color: var(--lk-surface, #121821) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] .authentication-bg .form-check-label,
body[data-layout-mode="dark"] .authentication-bg label,
body[data-layout-mode="dark"] .authentication-bg p,
body[data-layout-mode="dark"] .authentication-bg .text-muted {
    color: var(--lk-muted, rgba(229, 231, 235, 0.72)) !important;
}

body[data-layout-mode="dark"] .authentication-bg h1,
body[data-layout-mode="dark"] .authentication-bg h2,
body[data-layout-mode="dark"] .authentication-bg h3,
body[data-layout-mode="dark"] .authentication-bg h4,
body[data-layout-mode="dark"] .authentication-bg h5,
body[data-layout-mode="dark"] .authentication-bg h6,
body[data-layout-mode="dark"] .authentication-bg .h5_login_avt {
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] .authentication-bg input.form-control,
body[data-layout-mode="dark"] .authentication-bg select.form-control,
body[data-layout-mode="dark"] .authentication-bg textarea.form-control {
    background-color: rgba(18, 24, 33, 0.85) !important;
    color: var(--lk-text, #e5e7eb) !important;
    border-color: rgba(74, 155, 212, 0.25) !important;
}

body[data-layout-mode="dark"] .authentication-bg .auth-grid,
body[data-layout-mode="dark"] .authentication-bg .auth-visio-block,
body[data-layout-mode="dark"] .authentication-bg .auth-connector-line,
body[data-layout-mode="dark"] .authentication-bg .auth-dashed-line,
body[data-layout-mode="dark"] .authentication-bg .auth-curved-line,
body[data-layout-mode="dark"] .authentication-bg .auth-connection-node,
body[data-layout-mode="dark"] .authentication-bg .auth-floating-element,
body[data-layout-mode="dark"] .authentication-bg .auth-miro-sticker,
body[data-layout-mode="dark"] .authentication-bg .auth-group-box {
    opacity: 0.28 !important;
    filter: saturate(0.9) brightness(0.9);
}

body[data-layout-mode="dark"] .offcanvas-pretty .offcanvas-header {
    background: transparent !important;
    border-bottom-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

body[data-layout-mode="dark"] .offcanvas-pretty .offcanvas-body {
    background: var(--lk-surface, #121821) !important;
}

body[data-layout-mode="dark"] .offcanvas-view {
    background: rgba(21, 30, 40, 0.75) !important;
    border: 1px solid var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

body[data-layout-mode="dark"] #articleViewIconWrap,
body[data-layout-mode="dark"] #faqViewBlock .bg-light,
body[data-layout-mode="dark"] .offcanvas-view .bg-light {
    background-color: rgba(148, 163, 184, 0.12) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

body[data-layout-mode="dark"] .accordion-button,
body[data-layout-mode="dark"] .accordion-button:not(.collapsed) {
    background-color: rgba(148, 163, 184, 0.08) !important;
    color: var(--lk-text, #e5e7eb) !important;
    box-shadow: none !important;
}

/* FAQ cards override (page CSS sets `background:` gradient) */
body[data-layout-mode="dark"] .faq-card .accordion-button,
body[data-layout-mode="dark"] .faq-card .accordion-button:not(.collapsed) {
    background: rgba(148, 163, 184, 0.08) !important;
}

body[data-layout-mode="dark"] .accordion-button::after {
    filter: brightness(0) invert(1);
    opacity: 0.85;
}

body[data-layout-mode="dark"] .accordion-collapse {
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

/* ===============================
   Licenses offcanvas details
   =============================== */
body[data-layout-mode="dark"] .license-offcanvas-summary,
body[data-layout-mode="dark"] #licenseOffcanvasBody .license-offcanvas-summary {
    background: var(--lk-surface, #121821) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

/* Licenses: detail sections (e.g. "Подписка на обновления", "Техническая поддержка") */
body[data-layout-mode="dark"] #licenseOffcanvasBody .license-section,
body[data-layout-mode="dark"] #licenseOffcanvasBody .license-section .section-content {
    background: rgba(18, 24, 33, 0.85) !important;
    border: 1px solid var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    color: var(--lk-text, #e5e7eb) !important;
    border-radius: 12px;
}

body[data-layout-mode="dark"] #licenseOffcanvasBody .license-section .section-title {
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] #licenseOffcanvasBody .license-section strong {
    color: var(--lk-muted, rgba(229, 231, 235, 0.72)) !important;
}

/* ===============================
   Products admin: tree + public links
   =============================== */
body[data-layout-mode="dark"] .products-tree {
    background: var(--lk-surface, #121821) !important;
}

body[data-layout-mode="dark"] .tree-item-name,
body[data-layout-mode="dark"] .tree-toggle,
body[data-layout-mode="dark"] .tree-item-icon {
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] .tree-item-row:hover,
body[data-layout-mode="dark"] .tree-item-actions .btn:hover {
    background-color: rgba(148, 163, 184, 0.10) !important;
}

body[data-layout-mode="dark"] .public-link-card,
body[data-layout-mode="dark"] .public-link-card__header,
body[data-layout-mode="dark"] .public-link-card__body {
    background: var(--lk-surface, #121821) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] .public-link-field__label,
body[data-layout-mode="dark"] .public-link-card__subtitle,
body[data-layout-mode="dark"] .public-link-card__meta {
    color: var(--lk-muted, rgba(229, 231, 235, 0.72)) !important;
}

/* Public links: field value (e.g. "Файл") */
body[data-layout-mode="dark"] .public-link-field__value,
body[data-layout-mode="dark"] .public-link-card code {
    background-color: rgba(148, 163, 184, 0.10) !important;
    border: 1px solid var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

/* ratings-lk-admin: rating blocks + comments */
body[data-layout-mode="dark"] .admin-rating-card,
body[data-layout-mode="dark"] .admin-comments-block,
body[data-layout-mode="dark"] .admin-comment-item,
body[data-layout-mode="dark"] .admin-rating-comment {
    background-color: var(--lk-surface, #121821) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] .admin-comment-meta,
body[data-layout-mode="dark"] .admin-rating-meta,
body[data-layout-mode="dark"] .admin-rating-product-details {
    color: var(--lk-muted, rgba(229, 231, 235, 0.72)) !important;
}

/* ratings-lk-admin: OS chips were white */
body[data-layout-mode="dark"] .os-chip {
    background-color: rgba(18, 24, 33, 0.85) !important;
    border-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] .os-chip.os-chip-selected {
    background-color: rgba(74, 155, 212, 0.35) !important;
    border-color: rgba(74, 155, 212, 0.55) !important;
    color: #ffffff !important;
}

/* KB admin: help blocks under fields should not be white */
body[data-layout-mode="dark"] .form-text {
    background: transparent !important;
}

/* ===============================
   Lifecycle admin: roadmap descriptions
   =============================== */
body[data-layout-mode="dark"] .roadmap-content {
    background-color: var(--lk-surface, #121821) !important;
    border-left-color: var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
}

body[data-layout-mode="dark"] .roadmap-content p,
body[data-layout-mode="dark"] .roadmap-description,
body[data-layout-mode="dark"] .roadmap-description p,
body[data-layout-mode="dark"] .roadmap-description li,
body[data-layout-mode="dark"] .roadmap-description blockquote {
    color: var(--lk-muted, rgba(229, 231, 235, 0.72)) !important;
}

body[data-layout-mode="dark"] .roadmap-description code,
body[data-layout-mode="dark"] .roadmap-description pre {
    background-color: rgba(148, 163, 184, 0.10) !important;
    border: 1px solid var(--lk-border, rgba(148, 163, 184, 0.18)) !important;
    color: var(--lk-text, #e5e7eb) !important;
}

body[data-layout-mode="dark"] .roadmap-description table th {
    background-color: rgba(148, 163, 184, 0.08) !important;
}

body[data-layout-mode="dark"] .roadmap-description-gradient::after {
    background: linear-gradient(to bottom, rgba(11,15,20,0), rgba(11,15,20,1)) !important;
}