/* =========================================================
   ISNJ THEME SYSTEM
   =========================================================

   IMPORTANT

   1. Existing class names are NOT changed.
   2. --color-1 ... --color-6 are NOT changed.
   3. Existing .bg-* / .text-* / .bor-* / .shadow-* remain.
   4. Only generic theme surfaces are changed.
   5. This file MUST load AFTER Bootstrap/MDB/site CSS.
   ========================================================= */


/* =========================================================
   LIGHT THEME VARIABLES
   ========================================================= */

:root {

    color-scheme: light;

    --theme-bg: #f8fafc;

    --theme-surface: #ffffff;
    --theme-surface-1: #f8fafc;
    --theme-surface-2: #f1f5f9;
    --theme-surface-3: #e9eef5;

    --theme-text: #172033;
    --theme-text-secondary: #64748b;
    --theme-text-muted: #94a3b8;

    --theme-border: #e2e8f0;
    --theme-border-strong: #cbd5e1;

    --theme-input-bg: #ffffff;
    --theme-input-border: #d7dde6;

    --theme-header-bg: #ffffff;
    --theme-sidebar-bg: #ffffff;

    --theme-overlay: rgba(15, 23, 42, .45);

    --theme-shadow:
        0 8px 30px rgba(15, 23, 42, .08);

    --theme-glass:
        rgba(255, 255, 255, .72);
}


/* =========================================================
   DARK THEME VARIABLES
   ========================================================= */

html[data-theme="dark"] {

    color-scheme: dark;

    --theme-bg: #0b1120;

    --theme-surface: #111827;
    --theme-surface-1: #141d2e;
    --theme-surface-2: #1a2538;
    --theme-surface-3: #202c40;

    --theme-text: #f1f5f9;
    --theme-text-secondary: #cbd5e1;
    --theme-text-muted: #94a3b8;

    --theme-border: #29364b;
    --theme-border-strong: #3a4a62;

    --theme-input-bg: #111827;
    --theme-input-border: #334155;

    --theme-header-bg: #0f172a;
    --theme-sidebar-bg: #0f172a;

    --theme-overlay:
        rgba(0, 0, 0, .70);

    --theme-shadow:
        0 8px 30px rgba(0, 0, 0, .30);

    --theme-glass:
        rgba(15, 23, 42, .72);
}


/* =========================================================
   ROOT / BODY
   ========================================================= */

html {
    background-color: var(--theme-bg);
}

html[data-theme="dark"] {
    background-color: var(--theme-bg) !important;
}

body {
    background: #f8fafc !important;
    color: #172033;
}

html[data-theme="dark"] body {
    background: var(--theme-bg) !important;
    background-color: var(--theme-bg) !important;
    color: var(--theme-text) !important;
}


/* =========================================================
   MAIN
   ========================================================= */

html[data-theme="dark"] main {
    background-color: transparent;
    color: var(--theme-text);
}


/* =========================================================
   GENERIC TEXT
   ========================================================= */

html[data-theme="dark"] p,
html[data-theme="dark"] li,
html[data-theme="dark"] label,
html[data-theme="dark"] small {
    color: inherit;
}


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: var(--theme-text);
}


/* =========================================================
   GENERIC LINKS
   ---------------------------------------------------------
   Do NOT touch the site's .text-* system.
   ========================================================= */

html[data-theme="dark"] a {
    color: inherit;
}


/* =========================================================
   BOOTSTRAP GENERIC BACKGROUNDS
   ========================================================= */

html[data-theme="dark"] .bg-white {
    background-color: var(--theme-surface) !important;
    color: var(--theme-text);
}


html[data-theme="dark"] .bg-light {
    background-color: var(--theme-surface-1) !important;
    color: var(--theme-text);
}


html[data-theme="dark"] .bg-body {
    background-color: var(--theme-bg) !important;
    color: var(--theme-text);
}


html[data-theme="dark"] .bg-body-secondary {
    background-color: var(--theme-surface-2) !important;
    color: var(--theme-text);
}


/* =========================================================
   IMPORTANT
   ---------------------------------------------------------
   Site color classes remain untouched.

   .bg-1
   .bg-2
   .bg-3
   .bg-4
   .bg-5
   .bg-6

   are NOT overridden.
   ========================================================= */


/* =========================================================
   GENERIC CARDS
   ========================================================= */

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


/*
 * Only cards that do NOT have one of the site's
 * explicit color classes receive a generic surface.
 */

html[data-theme="dark"] .card:not(.bg-1):not(.bg-2):not(.bg-3):not(.bg-4):not(.bg-5):not(.bg-6) {
    background-color: var(--theme-surface);
}


/* =========================================================
   CARD BODY / HEADER / FOOTER
   ========================================================= */

html[data-theme="dark"] .card-header,
html[data-theme="dark"] .card-footer {
    background-color: transparent;
    color: var(--theme-text);
    border-color: var(--theme-border);
}


html[data-theme="dark"] .card-body {
    color: var(--theme-text);
}


/* =========================================================
   GENERIC BORDERS
   ========================================================= */

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


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


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


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


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


/* =========================================================
   SITE BORDER CLASSES
   ---------------------------------------------------------
   Keep class names unchanged.
   In Dark Mode these generic borders become theme-aware.

   Explicit color identity is still preserved by color.
   ========================================================= */

html[data-theme="dark"] .bor-1,
html[data-theme="dark"] .bor-2,
html[data-theme="dark"] .bor-3,
html[data-theme="dark"] .bor-4,
html[data-theme="dark"] .bor-5,
html[data-theme="dark"] .bor-6 {
    border-color: var(--theme-border) !important;
}


/*
 * IMPORTANT:
 *
 * If a component specifically needs its original
 * organizational color, use a more specific selector
 * in that component stylesheet.
 *
 * We are intentionally making .bor-* theme-aware here
 * because you specifically requested borders to change
 * in Dark Mode.
 */


/* =========================================================
   HOVER BORDERS
   ========================================================= */

html[data-theme="dark"] .bor-hover-1:hover,
html[data-theme="dark"] .bor-hover-2:hover,
html[data-theme="dark"] .bor-hover-3:hover,
html[data-theme="dark"] .bor-hover-4:hover,
html[data-theme="dark"] .bor-hover-5:hover,
html[data-theme="dark"] .bor-hover-6:hover {
    border-color: var(--theme-border-strong) !important;
}


/* =========================================================
   BOOTSTRAP TEXT
   ========================================================= */

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


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


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


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


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


/* =========================================================
   BOOTSTRAP WHITE
   ========================================================= */

html[data-theme="dark"] .text-white {
    color: #fff !important;
}


/* =========================================================
   HEADER
   ========================================================= */

html[data-theme="dark"] header,
html[data-theme="dark"] .header,
html[data-theme="dark"] #header,
html[data-theme="dark"] #block-header {
    background-color: var(--theme-header-bg);
    color: var(--theme-text);
    border-color: var(--theme-border);
}


/* Header children */

html[data-theme="dark"] header a,
html[data-theme="dark"] .header a,
html[data-theme="dark"] #header a,
html[data-theme="dark"] #block-header a {
    color: inherit;
}


/* =========================================================
   SIDEBAR
   ========================================================= */

html[data-theme="dark"] #block-1,
html[data-theme="dark"] .sidebar,
html[data-theme="dark"] .offcanvas,
html[data-theme="dark"] .menu,
html[data-theme="dark"] .mobile-menu {
    background-color: var(--theme-sidebar-bg) !important;
    color: var(--theme-text);
    border-color: var(--theme-border);
}


/* Sidebar links */

html[data-theme="dark"] #block-1 a,
html[data-theme="dark"] .sidebar a,
html[data-theme="dark"] .menu a {
    color: var(--theme-text);
}


/* Sidebar secondary */

html[data-theme="dark"] #block-1 small,
html[data-theme="dark"] #block-1 .small,
html[data-theme="dark"] .sidebar small,
html[data-theme="dark"] .sidebar .small {
    color: var(--theme-text-secondary);
}


/* =========================================================
   MOBILE OVERLAY
   ========================================================= */

html[data-theme="dark"] #corpMobileOverlay {
    background-color: var(--theme-overlay) !important;
}


/* =========================================================
   SEARCH
   ========================================================= */

html[data-theme="dark"] #corpSearchButton {
    color: var(--theme-text);
}


/* =========================================================
   DROPDOWN
   ========================================================= */

html[data-theme="dark"] .dropdown-menu {
    background-color: var(--theme-surface) !important;
    color: var(--theme-text);
    border-color: var(--theme-border);
    box-shadow: var(--theme-shadow);
}


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


html[data-theme="dark"] .dropdown-item:hover,
html[data-theme="dark"] .dropdown-item:focus,
html[data-theme="dark"] .dropdown-item.active {
    background-color: var(--theme-surface-2) !important;
    color: var(--theme-text) !important;
}


/* =========================================================
   NAV / NAVBAR
   ========================================================= */

html[data-theme="dark"] .navbar {
    background-color: var(--theme-header-bg);
    color: var(--theme-text);
}


html[data-theme="dark"] .navbar-light .navbar-nav .nav-link {
    color: var(--theme-text-secondary);
}


html[data-theme="dark"] .navbar-light .navbar-nav .nav-link:hover {
    color: var(--theme-text);
}


/* =========================================================
   FORM
   ========================================================= */

html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select,
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select {
    background-color: var(--theme-input-bg) !important;
    color: var(--theme-text) !important;
    border-color: var(--theme-input-border) !important;
}


html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder,
html[data-theme="dark"] .form-control::placeholder {
    color: var(--theme-text-muted) !important;
    opacity: 1;
}


html[data-theme="dark"] input:focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] select:focus,
html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-select:focus {
    background-color: var(--theme-input-bg) !important;
    color: var(--theme-text) !important;
    border-color: rgb(var(--color-2)) !important;
    box-shadow: 0 0 0 .2rem rgba(var(--color-2), .15);
}


/* =========================================================
   FORM LABEL
   ========================================================= */

html[data-theme="dark"] .form-label,
html[data-theme="dark"] label {
    color: var(--theme-text);
}


/* =========================================================
   CHECKBOX / RADIO
   ========================================================= */

html[data-theme="dark"] .form-check-label {
    color: var(--theme-text);
}


html[data-theme="dark"] .form-check-input {
    background-color: var(--theme-input-bg);
    border-color: var(--theme-input-border);
}


/* =========================================================
   MODAL
   ========================================================= */

html[data-theme="dark"] .modal-content {
    background-color: var(--theme-surface) !important;
    color: var(--theme-text);
    border-color: var(--theme-border);
}


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


html[data-theme="dark"] .modal-title {
    color: var(--theme-text);
}


/* =========================================================
   CLOSE BUTTON
   ========================================================= */

html[data-theme="dark"] .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
}


/* =========================================================
   CONTENT POPUP
   ========================================================= */

html[data-theme="dark"] .content-popup,
html[data-theme="dark"] #contentPopup,
html[data-theme="dark"] .popup-content {
    background-color: var(--theme-surface) !important;
    color: var(--theme-text);
    border-color: var(--theme-border);
}


html[data-theme="dark"] .content-popup-header,
html[data-theme="dark"] .content-popup-footer {
    background-color: transparent;
    color: var(--theme-text);
    border-color: var(--theme-border);
}


/* =========================================================
   TABLE
   ========================================================= */

html[data-theme="dark"] table {
    color: var(--theme-text);
    border-color: var(--theme-border);
}


html[data-theme="dark"] th,
html[data-theme="dark"] td {
    border-color: var(--theme-border);
}


html[data-theme="dark"] .table {
    --bs-table-color: var(--theme-text);
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--theme-border);
    --bs-table-striped-color: var(--theme-text);
    --bs-table-striped-bg: rgba(255, 255, 255, .025);
    --bs-table-hover-color: var(--theme-text);
    --bs-table-hover-bg: rgba(255, 255, 255, .04);

    color: var(--theme-text);
    border-color: var(--theme-border);
}


/* =========================================================
   ACCORDION
   ========================================================= */

html[data-theme="dark"] .accordion-item {
    background-color: var(--theme-surface);
    color: var(--theme-text);
    border-color: var(--theme-border);
}


html[data-theme="dark"] .accordion-button {
    background-color: var(--theme-surface);
    color: var(--theme-text);
}


html[data-theme="dark"] .accordion-button:not(.collapsed) {
    background-color: var(--theme-surface-2);
    color: var(--theme-text);
}


html[data-theme="dark"] .accordion-button::after {
    filter: invert(1) grayscale(100%);
}


html[data-theme="dark"] .accordion-body {
    background-color: var(--theme-surface);
    color: var(--theme-text-secondary);
}


/* =========================================================
   LIST GROUP
   ========================================================= */

html[data-theme="dark"] .list-group-item {
    background-color: var(--theme-surface);
    color: var(--theme-text);
    border-color: var(--theme-border);
}


html[data-theme="dark"] .list-group-item-action:hover,
html[data-theme="dark"] .list-group-item-action:focus {
    background-color: var(--theme-surface-2);
    color: var(--theme-text);
}


/* =========================================================
   TABS
   ---------------------------------------------------------
   Active tab keeps existing site color.
   ========================================================= */

html[data-theme="dark"] .nav-tabs {
    border-color: var(--theme-border);
}


html[data-theme="dark"] .nav-tabs .nav-link:not(.active) {
    color: var(--theme-text-secondary);
}


html[data-theme="dark"] .nav-tabs .nav-link:not(.active):hover {
    color: var(--theme-text);
    border-color: var(--theme-border);
}


/*
 * Existing active tab:
 *
 * .nav-tabs .nav-link.active
 *
 * remains untouched.
 */


/* =========================================================
   PAGINATION
   ========================================================= */

html[data-theme="dark"] .page-link {
    background-color: var(--theme-surface);
    color: var(--theme-text);
    border-color: var(--theme-border);
}


html[data-theme="dark"] .page-link:hover {
    background-color: var(--theme-surface-2);
    color: var(--theme-text);
    border-color: var(--theme-border-strong);
}


html[data-theme="dark"] .page-item.disabled .page-link {
    background-color: var(--theme-surface-1);
    color: var(--theme-text-muted);
    border-color: var(--theme-border);
}


/* =========================================================
   BUTTONS
   ---------------------------------------------------------
   Colored site buttons remain untouched.
   ========================================================= */

html[data-theme="dark"] .btn-light {
    background-color: var(--theme-surface-2) !important;
    color: var(--theme-text) !important;
    border-color: var(--theme-border) !important;
}


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


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


/* =========================================================
   ALERTS
   ========================================================= */

html[data-theme="dark"] .alert-light {
    background-color: var(--theme-surface-1);
    color: var(--theme-text);
    border-color: var(--theme-border);
}


/* =========================================================
   BREADCRUMB
   ========================================================= */

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


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


/* =========================================================
   BADGE LIGHT
   ========================================================= */

html[data-theme="dark"] .bg-secondary {
    color: #fff;
}


/* =========================================================
   AUDIO
   ========================================================= */

html[data-theme="dark"] .audio-preview {
    color: var(--theme-text);
}


html[data-theme="dark"] .audio-player {
    color-scheme: dark;
}


/* =========================================================
   VIDEO
   ========================================================= */

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


/* =========================================================
   GLASS
   ========================================================= */

html[data-theme="dark"] .bg-blur {
    background: var(--theme-glass) !important;
    border-color: rgba(255, 255, 255, .08);
}


/* =========================================================
   HR
   ========================================================= */

html[data-theme="dark"] hr {
    color: var(--theme-border);
    border-color: var(--theme-border);
    opacity: 1;
}


/* =========================================================
   SLICK
   ========================================================= */

html[data-theme="dark"] .slick-dots li button:before {
    color: var(--theme-text);
}


html[data-theme="dark"] .slick-prev:before,
html[data-theme="dark"] .slick-next:before {
    color: var(--theme-text);
}


/* =========================================================
   FIGURE / FIGCAPTION
   ========================================================= */

html[data-theme="dark"] figcaption {
    color: var(--theme-text-secondary);
}


/* =========================================================
   GENERIC CODE / PRE
   ========================================================= */

html[data-theme="dark"] code,
html[data-theme="dark"] pre {
    background-color: var(--theme-surface-2);
    color: var(--theme-text);
}


/* =========================================================
   SELECTION
   ========================================================= */

html[data-theme="dark"] ::selection {
    background: rgba(var(--color-2), .35);
    color: #fff;
}


/* =========================================================
   SCROLLBAR
   ========================================================= */

html[data-theme="dark"] {
    scrollbar-color: #334155 #0b1120;
}


html[data-theme="dark"]::-webkit-scrollbar,
html[data-theme="dark"] ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}


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


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


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


/* =========================================================
   THEME TRANSITION
   ---------------------------------------------------------
   Do not override existing .transition classes.
   ========================================================= */

html,
body,
header,
#block-1,
.card,
.dropdown-menu,
.modal-content,
.form-control,
.form-select,
.list-group-item,
.accordion-item,
.accordion-button,
.table,
.bg-white,
.bg-light {
    transition:
        background-color .25s ease,
        color .25s ease,
        border-color .25s ease;
}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (prefers-reduced-motion: reduce) {

    html,
    body,
    header,
    #block-1,
    .card,
    .dropdown-menu,
    .modal-content,
    .form-control,
    .form-select,
    .list-group-item,
    .accordion-item,
    .accordion-button,
    .table,
    .bg-white,
    .bg-light {
        transition: none !important;
    }
}

/* =========================================================
   ISNJ THEME — GLOBAL DARK SURFACE OVERRIDE
   ---------------------------------------------------------
   هدف:
   - بدون تغییر هیچ class / id
   - تبدیل سطوح سفید سایت در Dark Mode
   - پوشش block ها، header، sidebar، card ها و component ها
   - حفظ رنگ‌های سازمانی --color-1 ... --color-6
   ========================================================= */


/* =========================================================
   DARK THEME — GLOBAL SURFACE
   ========================================================= */

html[data-theme="dark"] {

    /* -----------------------------------------------------
       GLOBAL THEME COLORS
       ----------------------------------------------------- */

    --theme-bg: #0f172a;
    --theme-surface: #111827;
    --theme-surface-1: #172033;
    --theme-surface-2: #1e293b;

    --theme-text: #e5e7eb;
    --theme-text-muted: #aeb8c7;

    --theme-border: #334155;
    --theme-border-soft: #273449;

    --theme-input: #111827;
    --theme-input-border: #475569;

    --theme-hover: #1e293b;
}


/* =========================================================
   BODY
   ========================================================= */

html[data-theme="dark"] body {
    background: var(--theme-bg) !important;
    background-color: var(--theme-bg) !important;
    color: var(--theme-text) !important;
}


/* =========================================================
   MAIN / PAGE WRAPPERS
   ========================================================= */

html[data-theme="dark"] main,
html[data-theme="dark"] section,
html[data-theme="dark"] article {
    color: var(--theme-text);
}


/* =========================================================
   BOOTSTRAP / MDB WHITE SURFACES
   ========================================================= */

html[data-theme="dark"] .bg-white,
html[data-theme="dark"] .bg-light,
html[data-theme="dark"] .bg-body,
html[data-theme="dark"] .bg-body-tertiary,
html[data-theme="dark"] .bg-body-secondary {
    background-color: var(--theme-surface) !important;
    color: var(--theme-text);
}


/* =========================================================
   GLOBAL WHITE BACKGROUNDS
   ---------------------------------------------------------
   این قسمت برای المان‌هایی است که در CSS سایت مستقیماً
   background:#fff یا background-color:#fff گرفته‌اند.
   ========================================================= */

html[data-theme="dark"] [style*="background:#fff"],
html[data-theme="dark"] [style*="background: #fff"],
html[data-theme="dark"] [style*="background:#ffffff"],
html[data-theme="dark"] [style*="background: #ffffff"],
html[data-theme="dark"] [style*="background-color:#fff"],
html[data-theme="dark"] [style*="background-color: #fff"],
html[data-theme="dark"] [style*="background-color:#ffffff"],
html[data-theme="dark"] [style*="background-color: #ffffff"] {
    background: var(--theme-surface) !important;
    background-color: var(--theme-surface) !important;
}


/* =========================================================
   COMMON SITE STRUCTURES
   ---------------------------------------------------------
   بدون تغییر نام کلاس‌ها
   ========================================================= */

html[data-theme="dark"] #block-1,
html[data-theme="dark"] #block-2,
html[data-theme="dark"] #block-3,
html[data-theme="dark"] #block-4,
html[data-theme="dark"] #block-5,
html[data-theme="dark"] #block-6,
html[data-theme="dark"] #block-7,
html[data-theme="dark"] #block-8,
html[data-theme="dark"] #block-9,
html[data-theme="dark"] #block-10,
html[data-theme="dark"] #block-11,
html[data-theme="dark"] #block-12,
html[data-theme="dark"] #block-13,
html[data-theme="dark"] #block-14,
html[data-theme="dark"] #block-15,
html[data-theme="dark"] #block-16,
html[data-theme="dark"] #block-17,
html[data-theme="dark"] #block-18,
html[data-theme="dark"] #block-19,
html[data-theme="dark"] #block-20,
html[data-theme="dark"] #block-21,
html[data-theme="dark"] #block-22,
html[data-theme="dark"] #block-23,
html[data-theme="dark"] #block-24,
html[data-theme="dark"] #block-25,
html[data-theme="dark"] #block-26,
html[data-theme="dark"] #block-27,
html[data-theme="dark"] #block-28,
html[data-theme="dark"] #block-29,
html[data-theme="dark"] #block-30 {
    color: var(--theme-text);
}


/* =========================================================
   HEADER
   ========================================================= */

html[data-theme="dark"] .corp-header,
html[data-theme="dark"] .corp-header-inner,
html[data-theme="dark"] .corp-header .container,
html[data-theme="dark"] .corp-header .container-fluid {
    background: var(--theme-surface) !important;
    background-color: var(--theme-surface) !important;
    color: var(--theme-text) !important;
}


/* =========================================================
   SIDEBAR
   ========================================================= */

html[data-theme="dark"] #block-1,
html[data-theme="dark"] .corp-sidebar,
html[data-theme="dark"] .corp-sidebar-top,
html[data-theme="dark"] .corp-sidebar-inner,
html[data-theme="dark"] .corp-sidebar-bottom {
    background: var(--theme-surface) !important;
    background-color: var(--theme-surface) !important;
    color: var(--theme-text) !important;
}


/* =========================================================
   CARDS / BOXES
   ========================================================= */

html[data-theme="dark"] .card,
html[data-theme="dark"] .card-body,
html[data-theme="dark"] .card-header,
html[data-theme="dark"] .card-footer,
html[data-theme="dark"] .list-group,
html[data-theme="dark"] .list-group-item {
    background-color: var(--theme-surface) !important;
    color: var(--theme-text);
}


/* =========================================================
   TABLE
   ========================================================= */

html[data-theme="dark"] table,
html[data-theme="dark"] .table {
    color: var(--theme-text) !important;
    --bs-table-bg: var(--theme-surface);
    --bs-table-color: var(--theme-text);
}

html[data-theme="dark"] .table > :not(caption) > * > * {
    background-color: var(--theme-surface) !important;
    color: var(--theme-text) !important;
    border-color: var(--theme-border) !important;
}


/* =========================================================
   FORM ELEMENTS
   ========================================================= */

html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select,
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select {
    background-color: var(--theme-input) !important;
    color: var(--theme-text) !important;
    border-color: var(--theme-input-border) !important;
}

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


/* =========================================================
   MODAL / DROPDOWN / POPOVER
   ========================================================= */

html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .popover,
html[data-theme="dark"] .toast,
html[data-theme="dark"] .offcanvas {
    background-color: var(--theme-surface) !important;
    color: var(--theme-text) !important;
    border-color: var(--theme-border) !important;
}


/* =========================================================
   ACCORDION
   ========================================================= */

html[data-theme="dark"] .accordion-item,
html[data-theme="dark"] .accordion-header,
html[data-theme="dark"] .accordion-button {
    background-color: var(--theme-surface) !important;
    color: var(--theme-text) !important;
    border-color: var(--theme-border) !important;
}

html[data-theme="dark"] .accordion-button:not(.collapsed) {
    background-color: var(--theme-surface-1) !important;
    color: var(--theme-text) !important;
}


/* =========================================================
   NAVIGATION
   ========================================================= */

html[data-theme="dark"] .nav-tabs,
html[data-theme="dark"] .nav-pills {
    border-color: var(--theme-border) !important;
}

html[data-theme="dark"] .nav-link:not(.active) {
    color: var(--theme-text-muted);
}


/* =========================================================
   GENERIC BORDER
   ========================================================= */

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


/* =========================================================
   EXISTING BOR-* UTILITIES
   ---------------------------------------------------------
   نام کلاس‌ها دست نخورده باقی می‌ماند.
   ========================================================= */

html[data-theme="dark"] .bor-1,
html[data-theme="dark"] .bor-2,
html[data-theme="dark"] .bor-3,
html[data-theme="dark"] .bor-4,
html[data-theme="dark"] .bor-5,
html[data-theme="dark"] .bor-6 {
    border-color: var(--theme-border) !important;
}


/* =========================================================
   HR
   ========================================================= */

html[data-theme="dark"] hr {
    color: var(--theme-border) !important;
    border-color: var(--theme-border) !important;
    opacity: 1;
}


/* =========================================================
   TEXT UTILITIES
   ---------------------------------------------------------
   رنگ‌های سازمانی text-1 ... text-6 تغییر نمی‌کنند.
   ========================================================= */

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

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

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


/* =========================================================
   LINKS
   ========================================================= */

html[data-theme="dark"] a:not(.btn):not(.nav-link) {
    color: inherit;
}


/* =========================================================
   BUTTONS — GENERIC
   ---------------------------------------------------------
   رنگ‌های سازمانی bg-1 ... bg-6 دست نمی‌خورند.
   ========================================================= */

html[data-theme="dark"] .btn-light,
html[data-theme="dark"] .btn-outline-dark {
    background-color: var(--theme-surface-1) !important;
    color: var(--theme-text) !important;
    border-color: var(--theme-border) !important;
}


/* =========================================================
   BG-BLUR
   ========================================================= */

html[data-theme="dark"] .bg-blur {
    background: rgba(17,24,39,.72) !important;
}


/* =========================================================
   SLICK
   ========================================================= */

html[data-theme="dark"] .slick-dots li button:before {
    color: var(--theme-text) !important;
}

html[data-theme="dark"] .slick-prev:before,
html[data-theme="dark"] .slick-next:before {
    color: var(--theme-text) !important;
}


/* =========================================================
   FIGURE / IMAGE WRAPPERS
   ========================================================= */

html[data-theme="dark"] figure {
    background-color: var(--theme-surface);
}


/* =========================================================
   SVG / ICON BACKGROUNDS
   ========================================================= */

html[data-theme="dark"] .bg-white svg,
html[data-theme="dark"] .bg-light svg {
    color: inherit;
}


/* =========================================================
   BOX-SHADOW
   ---------------------------------------------------------
   فقط سایه‌های عمومی؛ رنگ‌های سازمانی دست‌نخورده.
   ========================================================= */

html[data-theme="dark"] .shadow,
html[data-theme="dark"] .shadow-sm,
html[data-theme="dark"] .shadow-lg {
    box-shadow: 0 .25rem .75rem rgba(0,0,0,.35) !important;
}


/* =========================================================
   PLACEHOLDER / DISABLED
   ========================================================= */

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