/**
 * Dark Mode Overrides for K-Sys4
 * 
 * Bootstrap 5.3.0 handles most components via data-bs-theme="dark".
 * This file overrides hardcoded colors in custom CSS (style.css, admin.css,
 * sidebar.css, etc.) that Bootstrap can't auto-fix.
 *
 * Scoped to [data-bs-theme="dark"] so it only applies in dark mode.
 */

/* ===== ROOT VARIABLES OVERRIDE ===== */
[data-bs-theme="dark"] {
    --primary-color: #6d8cff;
    --secondary-color: #9b59b6;
    --success-color: #34d058;
    --info-color: #56c5d6;
    --warning-color: #f0ad4e;
    --danger-color: #e74c3c;
    --light-color: #1e1e2e;
    --text-color: #e0e0e0;
    --background-color: #121218;
    --link-color: #6d8cff;
    --link-hover-color: #93abff;
    --header-bg: #1a1a2e;
    --footer-bg: #111118;
    --card-bg: #1e1e2e;
    --border-color: #2d2d3d;
    --muted-color: #9e9eb0;
    --hover-bg: #252535;
    --input-bg: #1e1e2e;
    --input-border: #3a3a4e;
    --sidebar-bg: #1a1a28;
    --table-stripe: rgba(255,255,255,0.03);
    
    /* Zone-specific variable overrides */
    --sidebar-bg-color: #1a1a28;
    --sidebar-text-color: #b0b0c0;
    --sidebar-border-color: #2d2d3d;
    --sidebar-link-color: #6d8cff;
    --sidebar-heading-bg-color: #6d8cff;
    --pagination-bg-color: #1e1e2e;
    --pagination-text-color: #b0b0c0;
    --pagination-active-bg-color: #6d8cff;
    --pagination-active-text-color: #ffffff;
    --pagination-border-color: #2d2d3d;
    --breadcrumb-link-color: #6d8cff;
    --breadcrumb-text-color: #9e9eb0;
    --form-bg-color: #1e1e2e;
    --form-border-color: #3a3a4e;
    --form-focus-color: #6d8cff;
    --card-border-color: #2d2d3d;
    --card-header-bg-color: rgba(255,255,255,0.03);
    --footer-link-color: #9e9ebf;
    --footer-link-hover-color: #6d8cff;
    --share-box-border-color: #2d2d3d;
}

/* ===== BODY ===== */
[data-bs-theme="dark"] body {
    color: #e0e0e0;
    background-color: #121218;
}

/* ===== NAVBAR ===== */
[data-bs-theme="dark"] .navbar {
    background-color: #1a1a2e !important;
    border-bottom: 1px solid #2d2d3d;
}

[data-bs-theme="dark"] .navbar .nav-link,
[data-bs-theme="dark"] .navbar-dark .navbar-nav .nav-link {
    color: rgba(255,255,255,0.88) !important;
}

[data-bs-theme="dark"] .navbar .nav-link:hover,
[data-bs-theme="dark"] .navbar .nav-link:focus {
    color: #fff !important;
    background: rgba(255,255,255,0.10);
}

/* Dark-mode desktop dropdown: dark panel with light text */
[data-bs-theme="dark"] .navbar .dropdown-menu {
    background-color: #1e1e2e !important;
    border: 1px solid #2d2d3d !important;
    box-shadow: 0 6px 24px rgba(0,0,0,0.5) !important;
}

[data-bs-theme="dark"] .navbar .dropdown-item {
    color: #d0d0e0 !important;
}

[data-bs-theme="dark"] .navbar .dropdown-item:hover,
[data-bs-theme="dark"] .navbar .dropdown-item:focus {
    background-color: rgba(109,140,255,0.12) !important;
    color: #fff !important;
}

/* Dark-mode mobile collapse */
@media (max-width: 991.98px) {
    [data-bs-theme="dark"] .navbar-collapse {
        background-color: rgba(0, 0, 0, 0.35);
    }

    [data-bs-theme="dark"] .navbar .dropdown-menu {
        background-color: rgba(255,255,255,0.06) !important;
        border: none !important;
        box-shadow: none !important;
    }

    [data-bs-theme="dark"] .navbar .dropdown-item {
        color: rgba(255,255,255,0.85) !important;
    }

    [data-bs-theme="dark"] .navbar .dropdown-item:hover,
    [data-bs-theme="dark"] .navbar .dropdown-item:focus {
        background-color: rgba(255,255,255,0.10) !important;
        color: #fff !important;
    }
}

/* ===== CARDS ===== */
[data-bs-theme="dark"] .card {
    background-color: #1e1e2e;
    border-color: #2d2d3d;
    color: #e0e0e0;
}

[data-bs-theme="dark"] .card:hover {
    box-shadow: 0 8px 25px rgba(0,0,0,0.4);
}

[data-bs-theme="dark"] .card-header {
    background-color: rgba(255,255,255,0.03);
    border-bottom-color: #2d2d3d;
}

[data-bs-theme="dark"] .card-footer {
    background-color: rgba(255,255,255,0.02);
    border-top-color: #2d2d3d;
}

/* ===== DROPDOWNS ===== */
[data-bs-theme="dark"] .dropdown-menu {
    background-color: #1e1e2e;
    border-color: #2d2d3d;
}

[data-bs-theme="dark"] .dropdown-item {
    color: #d0d0e0;
}

[data-bs-theme="dark"] .dropdown-item:hover,
[data-bs-theme="dark"] .dropdown-item:focus {
    background-color: #252535;
    color: #fff;
}

[data-bs-theme="dark"] .dropdown-divider {
    border-top-color: #2d2d3d;
}

/* ===== FORMS ===== */
[data-bs-theme="dark"] .form-control,
[data-bs-theme="dark"] .form-select {
    background-color: #1e1e2e;
    border-color: #3a3a4e;
    color: #e0e0e0;
}

[data-bs-theme="dark"] .form-control:focus,
[data-bs-theme="dark"] .form-select:focus {
    background-color: #252535;
    border-color: var(--primary-color);
    color: #e0e0e0;
    box-shadow: 0 0 0 0.2rem rgba(109, 140, 255, 0.25);
}

[data-bs-theme="dark"] .form-control::placeholder {
    color: #6e6e80;
}

[data-bs-theme="dark"] .input-group-text {
    background-color: #252535;
    border-color: #3a3a4e;
    color: #b0b0c0;
}

/* ===== TABLES ===== */
[data-bs-theme="dark"] .table {
    color: var(--table-text-color, #e0e0e0);
    border-color: var(--table-border-color, #2d2d3d);
}

[data-bs-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) {
    background-color: var(--table-stripe-bg, rgba(255,255,255,0.03));
}

[data-bs-theme="dark"] .table-hover > tbody > tr:hover {
    background-color: rgba(255,255,255,0.06);
}

[data-bs-theme="dark"] .table thead th {
    background-color: var(--table-header-bg, transparent);
    border-bottom-color: var(--table-border-color, #3a3a4e);
}

/* ===== FOOTER (Public) ===== */
[data-bs-theme="dark"] .footer,
[data-bs-theme="dark"] footer {
    background: #111118 !important;
    color: #c0c0d0;
}

[data-bs-theme="dark"] .footer a,
[data-bs-theme="dark"] footer a {
    color: #9e9ebf !important;
}

[data-bs-theme="dark"] .footer a:hover,
[data-bs-theme="dark"] footer a:hover {
    color: #6d8cff !important;
}

/* ===== SIDEBAR (Public Components) ===== */
[data-bs-theme="dark"] .component-sidebar {
    background: #1a1a28;
    box-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

[data-bs-theme="dark"] .component-sidebar .component-title {
    color: #e0e0e0;
    border-bottom-color: var(--primary-color);
}

[data-bs-theme="dark"] .widget-title {
    color: #c0c0d0;
}

[data-bs-theme="dark"] .sidebar-widget {
    border-bottom-color: #2d2d3d;
}

[data-bs-theme="dark"] .sidebar-content a {
    color: #9e9eb0;
}

[data-bs-theme="dark"] .sidebar-content a:hover {
    color: #6d8cff;
}

[data-bs-theme="dark"] .sidebar-content a::before {
    color: #6d8cff;
}

[data-bs-theme="dark"] .recent-post-item {
    border-bottom-color: #2d2d3d;
}

[data-bs-theme="dark"] .recent-post-item a {
    color: #c0c0d0 !important;
}

[data-bs-theme="dark"] .recent-post-item a:hover {
    color: #6d8cff !important;
}

[data-bs-theme="dark"] .categories-list .badge {
    background: rgba(109, 140, 255, 0.15) !important;
    color: #6d8cff !important;
    border-color: rgba(109, 140, 255, 0.3);
}

[data-bs-theme="dark"] .categories-list .badge:hover {
    background: var(--primary-color) !important;
    color: #fff !important;
}

/* ===== ADMIN SIDEBAR ===== */
[data-bs-theme="dark"] .sidebar {
    background-color: #1a1a28;
    box-shadow: inset -1px 0 0 rgba(255,255,255,0.05);
}

[data-bs-theme="dark"] .sidebar .nav-link {
    color: #b0b0c0;
}

[data-bs-theme="dark"] .sidebar .nav-link:hover {
    color: #6d8cff;
}

[data-bs-theme="dark"] .sidebar .nav-link.active {
    color: #6d8cff;
}

/* ===== ADMIN FOOTER ===== */
[data-bs-theme="dark"] .bg-light {
    background-color: #1e1e2e !important;
}

/* ===== ALERTS ===== */
[data-bs-theme="dark"] .alert-info {
    background-color: var(--alert-bg-color, rgba(86, 197, 214, 0.12));
    border-color: var(--alert-border-color, rgba(86, 197, 214, 0.25));
    color: var(--alert-text-color, #56c5d6);
}

[data-bs-theme="dark"] .alert-success {
    background-color: var(--alert-bg-color, rgba(52, 208, 88, 0.12));
    border-color: var(--alert-border-color, rgba(52, 208, 88, 0.25));
    color: var(--alert-text-color, #34d058);
}

[data-bs-theme="dark"] .alert-warning {
    background-color: var(--alert-bg-color, rgba(240, 173, 78, 0.12));
    border-color: var(--alert-border-color, rgba(240, 173, 78, 0.25));
    color: var(--alert-text-color, #f0ad4e);
}

[data-bs-theme="dark"] .alert-danger {
    background-color: var(--alert-bg-color, rgba(231, 76, 60, 0.12));
    border-color: var(--alert-border-color, rgba(231, 76, 60, 0.25));
    color: var(--alert-text-color, #e74c3c);
}

/* ===== MODALS ===== */
[data-bs-theme="dark"] .modal-content {
    background-color: var(--modal-bg-color, #1e1e2e);
    border-color: var(--modal-border-color, #2d2d3d);
    color: var(--modal-text-color, #e0e0e0);
}

[data-bs-theme="dark"] .modal-header {
    background-color: var(--modal-header-bg, transparent);
    border-bottom-color: var(--modal-border-color, #2d2d3d);
}

[data-bs-theme="dark"] .modal-footer {
    border-top-color: var(--modal-border-color, #2d2d3d);
}

/* ===== BREADCRUMBS ===== */
[data-bs-theme="dark"] .breadcrumb {
    background-color: #1a1a28;
}

[data-bs-theme="dark"] .breadcrumb-item a {
    color: #6d8cff;
}

[data-bs-theme="dark"] .breadcrumb-item.active {
    color: #9e9eb0;
}

/* ===== PAGINATION ===== */
[data-bs-theme="dark"] .page-link {
    background-color: #1e1e2e;
    border-color: #2d2d3d;
    color: #b0b0c0;
}

[data-bs-theme="dark"] .page-link:hover {
    background-color: #252535;
    border-color: #3a3a4e;
    color: #6d8cff;
}

[data-bs-theme="dark"] .page-item.active .page-link {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

/* ===== MISC ELEMENTS ===== */
[data-bs-theme="dark"] .text-muted {
    color: #9e9eb0 !important;
}

[data-bs-theme="dark"] .text-dark {
    color: #e0e0e0 !important;
}

[data-bs-theme="dark"] .border {
    border-color: #2d2d3d !important;
}

[data-bs-theme="dark"] hr {
    border-color: #2d2d3d;
    opacity: 0.5;
}

[data-bs-theme="dark"] .shadow-sm {
    box-shadow: 0 .125rem .25rem rgba(0,0,0,0.3) !important;
}

[data-bs-theme="dark"] .shadow {
    box-shadow: 0 .5rem 1rem rgba(0,0,0,0.4) !important;
}

/* ===== SEARCH ===== */
[data-bs-theme="dark"] .search-results-dropdown {
    background-color: #1e1e2e;
    border-color: #2d2d3d;
}

/* ===== BREAKING NEWS ===== */
[data-bs-theme="dark"] .breaking-news-container {
    background-color: var(--breaking-news-bg-color, #1e1e2e);
    border-color: var(--breaking-news-border-color, #2d2d3d);
}
[data-bs-theme="dark"] .breaking-news {
    background: var(--breaking-news-bg-color, #1e1e2e);
    border-color: var(--breaking-news-border-color, #2d2d3d);
}
[data-bs-theme="dark"] .breaking-news-header {
    background: var(--breaking-news-header-bg, #dc3545);
}

/* ===== STATISTICS SECTION (Public Footer) ===== */
[data-bs-theme="dark"] .stat-item {
    background: #1e1e2e;
    color: #e0e0e0;
}

/* ===== HERO / FEATURED ===== */
[data-bs-theme="dark"] .hero-section {
    background-color: #121218;
}
[data-bs-theme="dark"] .ks-hero {
    background-color: var(--hero-bg-color, #0d1117);
}
[data-bs-theme="dark"] .ks-text,
[data-bs-theme="dark"] .ks-text h2 {
    color: var(--hero-text-color, #e6edf3);
}
[data-bs-theme="dark"] .ks-text p {
    color: var(--hero-subtitle-color, #c9d1d9);
}
[data-bs-theme="dark"] .ks-counter {
    color: var(--hero-text-color, #e6edf3);
}

/* ===== BACK TO TOP ===== */
[data-bs-theme="dark"] #backToTop {
    box-shadow: 0 4px 15px rgba(0,0,0,0.5);
}

/* ===== MEDIA MANAGER (Admin) ===== */
[data-bs-theme="dark"] .media-preview {
    background-color: #252535 !important;
}

[data-bs-theme="dark"] .border-dashed {
    border-color: var(--primary-color) !important;
}

[data-bs-theme="dark"] #dropArea {
    background-color: #1a1a28 !important;
}

[data-bs-theme="dark"] #dropArea.drag-over {
    background-color: rgba(109, 140, 255, 0.1) !important;
}

/* ===== LIST GROUPS ===== */
[data-bs-theme="dark"] .list-group-item {
    background-color: #1e1e2e;
    border-color: #2d2d3d;
    color: #e0e0e0;
}

[data-bs-theme="dark"] .list-group-item:hover {
    background-color: #252535;
}

/* ===== BADGES ===== */
[data-bs-theme="dark"] .badge.bg-light {
    background-color: #252535 !important;
    color: #e0e0e0 !important;
}

/* ===== PROGRESS BARS ===== */
[data-bs-theme="dark"] .progress {
    background-color: #252535;
}

/* ===== TABS ===== */
[data-bs-theme="dark"] .nav-tabs .nav-link {
    color: var(--tab-text-color, #9e9eb0);
}

[data-bs-theme="dark"] .nav-tabs .nav-link:hover {
    border-color: var(--tab-border-color, #3a3a4e);
}

[data-bs-theme="dark"] .nav-tabs .nav-link.active {
    background-color: var(--tab-active-bg, #1e1e2e);
    border-color: var(--tab-border-color, #3a3a4e) var(--tab-border-color, #3a3a4e) var(--tab-active-bg, #1e1e2e);
    color: var(--tab-active-color, #e0e0e0);
}

/* ===== CODE / PRE ===== */
[data-bs-theme="dark"] code {
    color: #e06c75;
    background-color: rgba(255,255,255,0.05);
}

[data-bs-theme="dark"] pre {
    background-color: #0d0d12;
    color: #abb2bf;
    border-color: #2d2d3d;
}

/* ===== THEME TOGGLE BUTTON ===== */
.theme-toggle {
    background: none;
    border: 1px solid rgba(255,255,255,0.25);
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    color: rgba(255,255,255,0.85);
    padding: 0;
}

.theme-toggle:hover {
    background-color: rgba(255,255,255,0.1);
    border-color: rgba(255,255,255,0.5);
    color: #fff;
}

[data-bs-theme="dark"] .theme-toggle {
    border-color: rgba(255,255,255,0.2);
    color: #ffd43b;
}

[data-bs-theme="dark"] .theme-toggle:hover {
    background-color: rgba(255,255,255,0.08);
    border-color: #ffd43b;
}

/* ===== SMOOTH TRANSITION ===== */
html.theme-transitioning,
html.theme-transitioning *,
html.theme-transitioning *::before,
html.theme-transitioning *::after {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease !important;
}
