/**

* MCP Certify — dark mode extensions for Minton / Bootstrap 5.
* FINAL — fully normalized multi-theme system (classic | blue | warm)
  */

html[data-bs-theme="dark"] {
    /* Core tokens */
    --mcp-border-subtle: rgba(255, 255, 255, 0.1);
    --mcp-surface-raised: #2f3844;
    --mcp-placeholder: rgba(206, 222, 238, 0.55);
    --mcp-shadow-elevated: 0 0.35rem 1.2rem rgba(0, 0, 0, 0.45);


    /* Surface system */
    --mcp-surface-base: var(--bs-secondary-bg);
    --mcp-surface-input: var(--bs-gray-200);
    --mcp-surface-muted: var(--bs-gray-300);

    /* Interaction system */
    --mcp-hover-bg: rgba(var(--bs-primary-rgb), 0.08);
    --mcp-active-bg: rgba(var(--bs-primary-rgb), 0.16);

}

/* ===================== THEMES ===================== */

html[data-bs-theme="dark"][data-theme-mode="classic"] {
    --bs-body-bg: #121212;
    --bs-secondary-bg: #1E1E1E;

    --bs-body-color: #E0E0E0;
    --bs-heading-color: #FFFFFF;
    --bs-secondary-color: #A0A0A0;

    --bs-border-color: rgba(255, 255, 255, 0.12);

    --bs-primary: #BB86FC;
    --bs-primary-rgb: 187, 134, 252;

    --bs-gray-200: #2A2A2A;
    --bs-gray-300: #333333;
    --bs-gray-400: #3D3D3D;

}

html[data-bs-theme="dark"][data-theme-mode="blue"] {
    --bs-body-bg: #0D1117;
    --bs-secondary-bg: #161B22;

    --bs-body-color: #C9D1D9;
    --bs-heading-color: #FFFFFF;
    --bs-secondary-color: #8B949E;

    --bs-border-color: #30363D;

    --bs-primary: #58A6FF;
    --bs-primary-rgb: 88, 166, 255;

    --bs-gray-200: #21262D;
    --bs-gray-300: #30363D;
    --bs-gray-400: #484F58;

}

html[data-bs-theme="dark"][data-theme-mode="warm"] {
    --bs-body-bg: #1A1A1A;
    --bs-secondary-bg: #242424;

    --bs-body-color: #F5F5F5;
    --bs-heading-color: #FFFFFF;
    --bs-secondary-color: #C2C2C2;

    --bs-border-color: rgba(255, 255, 255, 0.10);

    --bs-primary: #FFB86C;
    --bs-primary-rgb: 255, 184, 108;

    --bs-gray-200: #2C2C2C;
    --bs-gray-300: #363636;
    --bs-gray-400: #404040;

}

html[data-bs-theme="dark"][data-theme-mode="emerald"] {
    --bs-body-bg: #0F1412;
    --bs-secondary-bg: #151C18;

    --bs-body-color: #D1E7DD;
    --bs-heading-color: #FFFFFF;
    --bs-secondary-color: #9EC5B8;

    --bs-border-color: rgba(120, 200, 170, 0.15);

    --bs-primary: #34D399;
    --bs-primary-rgb: 52, 211, 153;

    --bs-gray-200: #1B2420;
    --bs-gray-300: #24312B;
    --bs-gray-400: #2E3D36;
}

/* ===================== LAYOUT ===================== */

html[data-bs-theme="dark"] #wrapper,
html[data-bs-theme="dark"] .content-page {
    background-color: var(--bs-body-bg);
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"][data-theme-mode="ocean"] {
    --bs-body-bg: #0A1622;
    --bs-secondary-bg: #0F2233;

    --bs-body-color: #D7E7FF;
    --bs-heading-color: #FFFFFF;
    --bs-secondary-color: #8FB3D9;

    --bs-border-color: rgba(120, 200, 255, 0.18);

    --bs-primary: #38BDF8;
    /* cyan */

    --bs-gray-200: #132A3D;
    --bs-gray-300: #1A3750;
    --bs-gray-400: #244764;
}

html[data-bs-theme="dark"][data-theme-mode="midnight"] {
    --bs-body-bg: #0B0B14;
    --bs-secondary-bg: #151528;

    --bs-body-color: #E6E6FF;
    --bs-heading-color: #FFFFFF;
    --bs-secondary-color: #A0A0C0;

    --bs-border-color: rgba(180, 160, 255, 0.15);

    --bs-primary: #A855F7;
    /* purple */

    --bs-gray-200: #1A1A2E;
    --bs-gray-300: #22223A;
    --bs-gray-400: #2E2E4A;
}

html[data-bs-theme="dark"][data-theme-mode="moon-clear"] {
    /* Base sky */
    --bs-body-bg: #070B1A;
    --bs-secondary-bg: #0C1226;

    /* Text */
    --bs-body-color: #E8ECFF;
    --bs-heading-color: #FFFFFF;
    --bs-secondary-color: #9AA6D6;

    /* Borders (moon haze) */
    --bs-border-color: rgba(180, 200, 255, 0.12);

    /* Primary = moon glow */
    --bs-primary: #B9D6FF;

    /* Surfaces */
    --bs-gray-200: #101A33;
    --bs-gray-300: #162044;
    --bs-gray-400: #1D2A55;

    /* MCP accents */
    --mcp-surface-raised: #111C38;
    --mcp-border-subtle: rgba(185, 214, 255, 0.14);
    --mcp-shadow-elevated: 0 0 35px rgba(180, 210, 255, 0.08);
}

html[data-bs-theme="dark"][data-theme-mode="cloud-night"] {
    /* Fog base */
    --bs-body-bg: #0B0E14;
    --bs-secondary-bg: #111722;

    /* Text */
    --bs-body-color: #D6DCE8;
    --bs-heading-color: #FFFFFF;
    --bs-secondary-color: #A3ADBF;

    /* Soft fog borders */
    --bs-border-color: rgba(255, 255, 255, 0.08);

    /* Primary = muted sky cyan */
    --bs-primary: #7FB7D9;

    /* Grays */
    --bs-gray-200: #151C29;
    --bs-gray-300: #1C2533;
    --bs-gray-400: #242F40;

    /* MCP tones */
    --mcp-surface-raised: #151D2B;
    --mcp-border-subtle: rgba(255, 255, 255, 0.08);
    --mcp-shadow-elevated: 0 10px 30px rgba(0, 0, 0, 0.5);
}

html[data-bs-theme="light"][data-theme-mode="soft"] {
    --bs-body-bg: #F8FAFC;
    --bs-secondary-bg: #FFFFFF;

    --bs-body-color: #1E293B;
    --bs-heading-color: #0F172A;
    --bs-secondary-color: #64748B;

    --bs-border-color: #E2E8F0;

    --bs-primary: #3B82F6;

    --bs-gray-200: #F1F5F9;
    --bs-gray-300: #E2E8F0;
    --bs-gray-400: #CBD5E1;

    --mcp-border-subtle: rgba(0, 0, 0, 0.05);
    --mcp-surface-raised: #FFFFFF;
    --mcp-shadow-elevated: 0 8px 20px rgba(0, 0, 0, 0.04);
}

html[data-bs-theme="light"][data-theme-mode="warm"] {
    --bs-body-bg: #FFF8F1;
    --bs-secondary-bg: #FFFFFF;

    --bs-body-color: #3A2E2A;
    --bs-heading-color: #1F1B16;
    --bs-secondary-color: #8B6F63;

    --bs-border-color: #F1E4D8;

    --bs-primary: #F59E0B;

    --bs-gray-200: #FAF1E8;
    --bs-gray-300: #F1E4D8;
    --bs-gray-400: #E5D3C5;

    --mcp-border-subtle: rgba(180, 120, 60, 0.12);
    --mcp-surface-raised: #FFFFFF;
    --mcp-shadow-elevated: 0 8px 25px rgba(180, 120, 60, 0.08);
}

html[data-bs-theme="light"][data-theme-mode="mint"] {
    --bs-body-bg: #F4FFFB;
    --bs-secondary-bg: #FFFFFF;

    --bs-body-color: #12332B;
    --bs-heading-color: #0B1F1A;
    --bs-secondary-color: #4B7C73;

    --bs-border-color: #D7F3EA;

    --bs-primary: #10B981;

    --bs-gray-200: #E6FBF5;
    --bs-gray-300: #D7F3EA;
    --bs-gray-400: #BEE7DC;

    --mcp-border-subtle: rgba(16, 185, 129, 0.12);
    --mcp-surface-raised: #FFFFFF;
    --mcp-shadow-elevated: 0 10px 25px rgba(16, 185, 129, 0.08);
}

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

/* -------------------------------------------------------------------------
   NAVBAR FIX (this is what you are missing)
   ------------------------------------------------------------------------- */

html[data-bs-theme="dark"] .navbar-custom {
    background-color: var(--bs-secondary-bg);
    color: var(--bs-body-color);
    border-bottom: 1px solid var(--mcp-border-subtle);
}

/* links inside navbar */
html[data-bs-theme="dark"] .navbar-custom .nav-link,
html[data-bs-theme="dark"] .navbar-custom .nav-user,
html[data-bs-theme="dark"] .navbar-custom .pro-user-name {
    color: var(--bs-body-color) !important;
}

/* hover states */
html[data-bs-theme="dark"] .navbar-custom .nav-link:hover {
    color: var(--bs-primary) !important;
}

/* dropdown icon */
html[data-bs-theme="dark"] .navbar-custom i {
    color: var(--bs-body-color);
}

/* logo box background consistency */
html[data-bs-theme="dark"] .navbar-custom .logo-box {
    background-color: transparent;
}

html[data-bs-theme="dark"] .navbar-custom .logo-box {
    background-color: var(--bs-secondary-bg) !important;
    border-right: 1px solid var(--mcp-border-subtle);
}

/* optional: make sure logo links don’t keep light theme styles */
html[data-bs-theme="dark"] .navbar-custom .logo-box .logo {
    background-color: transparent !important;
}

/* ensure images don't get weird inversion issues */
html[data-bs-theme="dark"] .navbar-custom .logo-box img {
    filter: none;
}

html[data-bs-theme="dark"][data-theme-mode="moon-clear"] .navbar-custom {
    background: radial-gradient(circle at top right,
            rgba(185, 214, 255, 0.08),
            var(--bs-secondary-bg));
    border-bottom: 1px solid rgba(185, 214, 255, 0.12);
}

html[data-bs-theme="dark"][data-theme-mode="cloud-night"] body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;

    background: radial-gradient(circle at 30% 20%,
            rgba(255, 255, 255, 0.04),
            transparent 60%);

    opacity: 0.6;
}

html[data-bs-theme="light"] .navbar-custom {
    background-color: var(--bs-secondary-bg);
    border-bottom: 1px solid var(--bs-border-color);
}

/* Sidebar */
html[data-bs-theme="light"] .left-side-menu {
    background-color: var(--bs-secondary-bg);
    border-right: 1px solid var(--bs-border-color);
}

/* -------------------------------------------------------------------------
   SIDEBAR FIX (left menu)
   ------------------------------------------------------------------------- */

html[data-bs-theme="dark"] .left-side-menu {
    background-color: var(--bs-secondary-bg);
    color: var(--bs-body-color);
    border-right: 1px solid var(--mcp-border-subtle);
}

/* sidebar links */
html[data-bs-theme="dark"] .left-side-menu a,
html[data-bs-theme="dark"] .left-side-menu .nav-link-item {
    color: var(--bs-body-color);
}

/* hover */
html[data-bs-theme="dark"] .left-side-menu a:hover {
    color: var(--bs-primary);
}

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

html[data-bs-theme="dark"] .card {
    background-color: var(--bs-secondary-bg);
    border-color: var(--mcp-border-subtle);
    box-shadow: var(--mcp-shadow-elevated);
}

html[data-bs-theme="dark"] .card-header,
html[data-bs-theme="dark"] .card-footer {
    background-color: rgba(0, 0, 0, 0.2);
    border-color: var(--mcp-border-subtle);
    color: var(--bs-heading-color);
}

/* ===================== FORMS ===================== */

html[data-bs-theme="dark"] .form-control,
html[data-bs-theme="dark"] .form-select,
html[data-bs-theme="dark"] textarea.form-control {
    background-color: var(--mcp-surface-input);
    border-color: var(--bs-border-color);
    color: var(--bs-body-color);
}

html[data-bs-theme="dark"] .form-control::placeholder {
    color: var(--mcp-placeholder);
}

html[data-bs-theme="dark"] .form-control:focus {
    box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.25);
}

html[data-bs-theme="dark"] .input-group-text {
    background-color: var(--mcp-surface-muted);
}

/* ===================== TABLES ===================== */

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

html[data-bs-theme="dark"] .table-hover>tbody>tr:hover>* {
    background-color: var(--mcp-hover-bg);
}

html[data-bs-theme="dark"] .table thead th {
    background-color: var(--mcp-surface-muted);
}

/* ===================== DATATABLES ===================== */

html[data-bs-theme="dark"] table.dataTable tbody tr:hover {
    background-color: var(--mcp-hover-bg) !important;
}

/* ===================== DROPDOWNS ===================== */

html[data-bs-theme="dark"] .dropdown-menu {
    background-color: var(--bs-secondary-bg);
}

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

/* ===================== BUTTONS ===================== */

html[data-bs-theme="dark"] .btn-light {
    background-color: var(--mcp-surface-muted);
}

html[data-bs-theme="dark"] .bg-soft-primary {
    background-color: rgba(var(--bs-primary-rgb), 0.18) !important;
}

/* ===================== NAV / LIST ===================== */

html[data-bs-theme="dark"] .list-group-item-action:hover {
    background-color: var(--mcp-hover-bg);
}

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

html[data-bs-theme="dark"] .accordion-button:not(.collapsed) {
    background-color: var(--mcp-active-bg);
}

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

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

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

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

html[data-bs-theme="dark"] .alert-light {
    background-color: var(--mcp-surface-muted);
}

/* ===================== UTILITIES ===================== */

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

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

/* ===================== MISC ===================== */

body[data-layout-mode="dark"] {
    color-scheme: dark;
}

html[data-bs-theme="light"] {
    color-scheme: light;
}