/* ==============================
   DARK MODE — Civil Portal
   Trigger: html[data-theme="dark"]
   ============================== */

/* ── TOGGLE BUTTON (her iki layout) ── */
.dark-mode-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px 10px;
    border-radius: 8px;
    color: inherit;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s, color 0.2s;
    line-height: 1;
    vertical-align: middle;
}
.dark-mode-btn:focus { outline: none; box-shadow: none; }
.dark-mode-btn:hover { background: rgba(238,93,36,0.10); color: #ee5d24; }
html[data-theme="dark"] .dark-mode-btn:hover { background: rgba(238,93,36,0.15); color: #ee5d24; }

/* ── BASE ── */
html[data-theme="dark"] body {
    background-color: #0d0f1a !important;
    color: #c9d1e0 !important;
}

/* ── NAVBAR ── */
html[data-theme="dark"] .navbar.default-layout {
    background: linear-gradient(to right, #161927, #1c1f30) !important;
    box-shadow: 0 2px 16px rgba(0,0,0,0.5) !important;
}
html[data-theme="dark"] .navbar.default-layout .navbar-menu-wrapper {
    background: #161927 !important;
    border-left: 1px solid #252840 !important;
}
html[data-theme="dark"] .navbar .nav-link { color: #b0bad0 !important; }
html[data-theme="dark"] .navbar .nav-link:hover { color: #ee5d24 !important; }
html[data-theme="dark"] .navbar .page-title { color: #c9d1e0 !important; }
html[data-theme="dark"] .navbar .count-indicator .mdi { color: #b0bad0 !important; }
html[data-theme="dark"] .navbar .count-indicator .count { background: #ee5d24 !important; }
html[data-theme="dark"] .navbar #search-menu {
    background: #1e2130 !important;
    border: 1px solid #252840 !important;
    color: #c9d1e0 !important;
}
html[data-theme="dark"] .navbar #search-menu::placeholder { color: #5a6080 !important; }
html[data-theme="dark"] .navbar .dark-mode-btn { color: #b0bad0; }

/* ── SIDEBAR ── */
html[data-theme="dark"] .sidebar {
    background: #111320 !important;
    border-right: 1px solid #252840 !important;
}
html[data-theme="dark"] .sidebar .sidebar-brand-wrapper {
    background: #0e1020 !important;
    border-bottom: 1px solid #252840 !important;
}
html[data-theme="dark"] .sidebar .nav .nav-item .nav-link { color: #7a86a8 !important; }
html[data-theme="dark"] .sidebar .nav .nav-item:hover .nav-link,
html[data-theme="dark"] .sidebar .nav .nav-item.active .nav-link {
    color: #ee5d24 !important;
    background: rgba(238,93,36,0.08) !important;
}
html[data-theme="dark"] .sidebar .nav .nav-item .nav-link i,
html[data-theme="dark"] .sidebar .nav .nav-item .nav-link .menu-icon { color: inherit !important; }
html[data-theme="dark"] .sidebar-offcanvas { background: #111320 !important; }

/* ── MAIN PANEL + CONTENT ── */
html[data-theme="dark"] .main-panel,
html[data-theme="dark"] .content-wrapper,
html[data-theme="dark"] .container-fluid.page-body-wrapper { background: #0d0f1a !important; }

/* ── CARDS ── */
html[data-theme="dark"] .card {
    background: #161927 !important;
    border: 1px solid #252840 !important;
    color: #c9d1e0 !important;
}
html[data-theme="dark"] .card-header {
    background: #1c1f30 !important;
    border-bottom: 1px solid #252840 !important;
    color: #e2e8f0 !important;
}
html[data-theme="dark"] .card-footer {
    background: #161927 !important;
    border-top: 1px solid #252840 !important;
}
html[data-theme="dark"] .card-title,
html[data-theme="dark"] .card-subtitle { color: #e2e8f0 !important; }

/* ── TYPOGRAPHY ── */
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: #e2e8f0 !important; }
html[data-theme="dark"] p { color: #b0bad0; }
html[data-theme="dark"] .text-dark   { color: #c9d1e0 !important; }
html[data-theme="dark"] .text-muted  { color: #5a6480 !important; }
html[data-theme="dark"] .text-secondary { color: #7a84a0 !important; }

/* ── FORMS ── */
html[data-theme="dark"] .form-control,
html[data-theme="dark"] textarea {
    background: #1c1f30 !important;
    border-color: #252840 !important;
    color: #c9d1e0 !important;
}
html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] textarea:focus {
    background: #22253a !important;
    border-color: #ee5d24 !important;
    color: #e2e8f0 !important;
    box-shadow: 0 0 0 3px rgba(238,93,36,0.15) !important;
}
html[data-theme="dark"] .form-control::placeholder,
html[data-theme="dark"] textarea::placeholder { color: #4a5070 !important; }
html[data-theme="dark"] .form-control:disabled,
html[data-theme="dark"] .form-control[readonly],
html[data-theme="dark"] textarea:disabled,
html[data-theme="dark"] textarea[readonly] {
    background: #181a28 !important;
    color: #5a6480 !important;
}
html[data-theme="dark"] .input-group-text {
    background: #22253a !important;
    border-color: #252840 !important;
    color: #7a84a0 !important;
}
html[data-theme="dark"] label { color: #8a94b2 !important; }
html[data-theme="dark"] .form-check-label { color: #94a3b8 !important; }
html[data-theme="dark"] select.form-control option { background: #1c1f30; color: #c9d1e0; }

/* ── TABLES ── */
html[data-theme="dark"] .table { color: #c9d1e0 !important; }
html[data-theme="dark"] .table th,
html[data-theme="dark"] .table td { border-color: #252840 !important; }
html[data-theme="dark"] .table thead th {
    background: #1c1f30 !important;
    color: #e2e8f0 !important;
    border-color: #252840 !important;
}
html[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255,255,255,0.03) !important;
}
html[data-theme="dark"] .table-hover tbody tr:hover {
    background-color: rgba(238,93,36,0.07) !important;
    color: #e2e8f0 !important;
}
html[data-theme="dark"] .table-bordered,
html[data-theme="dark"] .table-bordered th,
html[data-theme="dark"] .table-bordered td { border-color: #252840 !important; }

/* ── DROPDOWNS ── */
html[data-theme="dark"] .dropdown-menu {
    background: #1c1f30 !important;
    border: 1px solid #252840 !important;
    box-shadow: 0 8px 28px rgba(0,0,0,0.55) !important;
}
html[data-theme="dark"] .dropdown-item { color: #c9d1e0 !important; }
html[data-theme="dark"] .dropdown-item:hover,
html[data-theme="dark"] .dropdown-item:focus {
    background: #252840 !important;
    color: #e2e8f0 !important;
}
html[data-theme="dark"] .dropdown-divider { border-color: #252840 !important; }
html[data-theme="dark"] .dropdown-header {
    color: #7a84a0 !important;
    background: #1c1f30 !important;
}

/* ── MODALS ── */
html[data-theme="dark"] .modal-content {
    background: #161927 !important;
    border: 1px solid #252840 !important;
    color: #c9d1e0 !important;
}
html[data-theme="dark"] .modal-header {
    background: #1c1f30 !important;
    border-bottom: 1px solid #252840 !important;
}
html[data-theme="dark"] .modal-header .modal-title { color: #e2e8f0 !important; }
html[data-theme="dark"] .modal-footer {
    background: #161927 !important;
    border-top: 1px solid #252840 !important;
}
html[data-theme="dark"] .close { color: #7a84a0 !important; text-shadow: none !important; }
html[data-theme="dark"] .close:hover { color: #e2e8f0 !important; }

/* ── BUTTONS ── */
html[data-theme="dark"] .btn-secondary {
    background: #252840 !important;
    border-color: #303558 !important;
    color: #c9d1e0 !important;
}
html[data-theme="dark"] .btn-secondary:hover { background: #2d3050 !important; color: #e2e8f0 !important; }
html[data-theme="dark"] .btn-light {
    background: #1c1f30 !important;
    border-color: #252840 !important;
    color: #c9d1e0 !important;
}
html[data-theme="dark"] .btn-light:hover { background: #22253a !important; }
html[data-theme="dark"] .btn-outline-secondary {
    border-color: #303558 !important;
    color: #8a94b2 !important;
}
html[data-theme="dark"] .btn-outline-secondary:hover {
    background: #252840 !important;
    color: #e2e8f0 !important;
}

/* ── ALERTS ── */
html[data-theme="dark"] .alert-warning  { background: rgba(255,175,0,0.10) !important; border-color: rgba(255,175,0,0.25) !important; color: #ffd060 !important; }
html[data-theme="dark"] .alert-info     { background: rgba(33,150,243,0.10) !important; border-color: rgba(33,150,243,0.25) !important; color: #64b5f6 !important; }
html[data-theme="dark"] .alert-danger   { background: rgba(255,98,88,0.10) !important; border-color: rgba(255,98,88,0.25) !important; color: #ff8a82 !important; }
html[data-theme="dark"] .alert-success  { background: rgba(25,216,149,0.10) !important; border-color: rgba(25,216,149,0.25) !important; color: #4ceaad !important; }

/* ── BADGES ── */
html[data-theme="dark"] .badge-light    { background: #252840 !important; color: #c9d1e0 !important; }
html[data-theme="dark"] .badge-secondary { background: #252840 !important; color: #94a3b8 !important; }

/* ── BORDERS + DIVIDERS ── */
html[data-theme="dark"] .border,
html[data-theme="dark"] .border-bottom,
html[data-theme="dark"] .border-top,
html[data-theme="dark"] hr { border-color: #252840 !important; }

/* ── BACKGROUND HELPERS ── */
html[data-theme="dark"] .bg-white     { background-color: #161927 !important; }
html[data-theme="dark"] .bg-light     { background-color: #1c1f30 !important; }
html[data-theme="dark"] .bg-secondary { background-color: #252840 !important; }

/* ── NAV TABS ── */
html[data-theme="dark"] .nav-tabs { border-color: #252840 !important; }
html[data-theme="dark"] .nav-tabs .nav-link { color: #7a84a0 !important; }
html[data-theme="dark"] .nav-tabs .nav-link:hover { color: #c9d1e0 !important; border-color: #252840 !important; }
html[data-theme="dark"] .nav-tabs .nav-link.active {
    background: #161927 !important;
    border-color: #252840 #252840 #161927 !important;
    color: #ee5d24 !important;
}
html[data-theme="dark"] .tab-content { background: #161927 !important; }

/* ── PAGINATION ── */
html[data-theme="dark"] .page-item .page-link { background: #1c1f30 !important; border-color: #252840 !important; color: #c9d1e0 !important; }
html[data-theme="dark"] .page-item.active .page-link { background: #ee5d24 !important; border-color: #ee5d24 !important; color: #fff !important; }
html[data-theme="dark"] .page-item.disabled .page-link { color: #4a5070 !important; }

/* ── PROGRESS ── */
html[data-theme="dark"] .progress { background: #252840 !important; }

/* ── LIST GROUP ── */
html[data-theme="dark"] .list-group-item { background: #161927 !important; border-color: #252840 !important; color: #c9d1e0 !important; }
html[data-theme="dark"] .list-group-item:hover { background: #1c1f30 !important; }
html[data-theme="dark"] .list-group-item.active { background: #ee5d24 !important; border-color: #ee5d24 !important; }

/* ── BREADCRUMB ── */
html[data-theme="dark"] .breadcrumb { background: transparent !important; }
html[data-theme="dark"] .breadcrumb-item a { color: #ee5d24 !important; }
html[data-theme="dark"] .breadcrumb-item.active { color: #7a84a0 !important; }
html[data-theme="dark"] .breadcrumb-item + .breadcrumb-item::before { color: #4a5070 !important; }

/* ── TOOLTIP / POPOVER ── */
html[data-theme="dark"] .tooltip-inner { background: #22253a !important; color: #e2e8f0 !important; }
html[data-theme="dark"] .popover { background: #1c1f30 !important; border-color: #252840 !important; color: #c9d1e0 !important; }
html[data-theme="dark"] .popover-header { background: #22253a !important; border-color: #252840 !important; color: #e2e8f0 !important; }
html[data-theme="dark"] .popover-body { color: #c9d1e0 !important; }

/* ── SCROLLBAR ── */
html[data-theme="dark"] ::-webkit-scrollbar-track { background: #161927; }
html[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #2a2e48; border-radius: 4px; }
html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #363b5c; }

/* ── KENDO GRID ── */
html[data-theme="dark"] .k-grid { background: #161927 !important; color: #c9d1e0 !important; border-color: #252840 !important; }
html[data-theme="dark"] .k-grid-header,
html[data-theme="dark"] .k-grid-header-wrap { background: #1c1f30 !important; border-color: #252840 !important; }
html[data-theme="dark"] .k-grid-header th.k-header { background: #1c1f30 !important; color: #e2e8f0 !important; border-color: #252840 !important; }
html[data-theme="dark"] .k-grid-content,
html[data-theme="dark"] .k-grid-content.k-auto-scrollable { background: #161927 !important; border-color: #252840 !important; }
html[data-theme="dark"] .k-grid-content table,
html[data-theme="dark"] .k-grid-content tbody { background: #161927 !important; }
html[data-theme="dark"] .k-dropzone { background: #1c1f30 !important; border-color: #252840 !important; color: #c9d1e0 !important; }
html[data-theme="dark"] .k-grid tr { background: #161927 !important; color: #c9d1e0 !important; border-color: #252840 !important; }
html[data-theme="dark"] .k-grid tr.k-alt { background: #131522 !important; }
html[data-theme="dark"] .k-grid td { border-color: #252840 !important; }
html[data-theme="dark"] .k-grid tr:hover td { background: rgba(238,93,36,0.07) !important; }
html[data-theme="dark"] .k-grid tr.k-state-selected td { background: rgba(238,93,36,0.14) !important; color: #e2e8f0 !important; }
html[data-theme="dark"] .k-toolbar,
html[data-theme="dark"] .k-grid-toolbar { background: #1c1f30 !important; border-color: #252840 !important; color: #c9d1e0 !important; }
html[data-theme="dark"] .k-pager-wrap,
html[data-theme="dark"] .k-grid-pager { background: #1c1f30 !important; border-color: #252840 !important; color: #c9d1e0 !important; }

/* ── KENDO LISTVIEW ── */
html[data-theme="dark"] .k-listview,
html[data-theme="dark"] .k-listview-content { background: #161927 !important; border-color: #252840 !important; }
html[data-theme="dark"] .k-block,
html[data-theme="dark"] .octopodListCardItem,
html[data-theme="dark"] .k-listview-item { background: #1c1f30 !important; border-color: #252840 !important; color: #c9d1e0 !important; }
html[data-theme="dark"] .octopodListCardItem .k-header { background: #22253a !important; color: #e2e8f0 !important; border-color: #252840 !important; }
html[data-theme="dark"] .octopodListCardItem a { color: #7aa2f7 !important; }

/* ── KENDO BUTTONS ── */
html[data-theme="dark"] .k-button { background: #22253a !important; border-color: #252840 !important; color: #c9d1e0 !important; box-shadow: none !important; }
html[data-theme="dark"] .k-button:hover { background: #2a2e48 !important; color: #e2e8f0 !important; }
html[data-theme="dark"] .k-button.k-primary,
html[data-theme="dark"] .k-button.k-state-selected { background: #ee5d24 !important; border-color: #d44f1c !important; color: #fff !important; }
html[data-theme="dark"] .k-button.k-primary:hover { background: #d44f1c !important; }

/* ── KENDO INPUTS ── */
html[data-theme="dark"] .k-textbox,
html[data-theme="dark"] .k-input,
html[data-theme="dark"] .k-numerictextbox .k-input,
html[data-theme="dark"] .k-datepicker .k-input,
html[data-theme="dark"] .k-timepicker .k-input,
html[data-theme="dark"] .k-combobox .k-input,
html[data-theme="dark"] .k-autocomplete .k-input,
html[data-theme="dark"] .k-dropdownlist {
    background: #1c1f30 !important;
    border-color: #252840 !important;
    color: #c9d1e0 !important;
}
html[data-theme="dark"] .k-select { background: #22253a !important; border-color: #252840 !important; color: #c9d1e0 !important; }
html[data-theme="dark"] .k-icon { color: #7a84a0 !important; }

/* ── KENDO POPUP / LIST ── */
html[data-theme="dark"] .k-popup,
html[data-theme="dark"] .k-list-container,
html[data-theme="dark"] .k-animation-container .k-popup {
    background: #1c1f30 !important;
    border-color: #252840 !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.5) !important;
}
html[data-theme="dark"] .k-list .k-item,
html[data-theme="dark"] .k-list li { color: #c9d1e0 !important; }
html[data-theme="dark"] .k-list .k-item:hover,
html[data-theme="dark"] .k-list li:hover,
html[data-theme="dark"] .k-list .k-item.k-hover { background: #252840 !important; color: #e2e8f0 !important; }
html[data-theme="dark"] .k-list .k-item.k-state-selected,
html[data-theme="dark"] .k-list li.k-state-selected { background: rgba(238,93,36,0.15) !important; color: #ee5d24 !important; }

/* ── KENDO TABS ── */
html[data-theme="dark"] .k-tabstrip { border-color: #252840 !important; }
html[data-theme="dark"] .k-tabstrip .k-tabstrip-items .k-item { background: #1c1f30 !important; border-color: #252840 !important; color: #7a84a0 !important; }
html[data-theme="dark"] .k-tabstrip .k-tabstrip-items .k-item.k-state-active,
html[data-theme="dark"] .k-tabstrip .k-tabstrip-items .k-item.k-active { background: #161927 !important; border-bottom-color: #161927 !important; color: #ee5d24 !important; }
html[data-theme="dark"] .k-tabstrip .k-content { background: #161927 !important; border-color: #252840 !important; color: #c9d1e0 !important; }

/* ── KENDO PANELBAR ── */
html[data-theme="dark"] .k-panelbar,
html[data-theme="dark"] .k-panelbar .k-item { background: #161927 !important; color: #c9d1e0 !important; border-color: #252840 !important; }
html[data-theme="dark"] .k-panelbar .k-link { color: #c9d1e0 !important; }
html[data-theme="dark"] .k-panelbar .k-link:hover,
html[data-theme="dark"] .k-panelbar .k-link.k-selected { background: rgba(238,93,36,0.1) !important; color: #ee5d24 !important; }

/* ── KENDO SPLITTER ── */
html[data-theme="dark"] .k-splitter { background: #0d0f1a !important; border-color: #252840 !important; }
html[data-theme="dark"] .k-splitbar { background: #22253a !important; }

/* ── KENDO TREEVIEW ── */
html[data-theme="dark"] .k-treeview .k-in { color: #c9d1e0 !important; }
html[data-theme="dark"] .k-treeview .k-in:hover { background: #22253a !important; color: #e2e8f0 !important; }
html[data-theme="dark"] .k-treeview .k-state-selected .k-in { background: rgba(238,93,36,0.12) !important; color: #ee5d24 !important; border-color: transparent !important; }
html[data-theme="dark"] .k-treeview .k-state-focused .k-in { box-shadow: none !important; border-color: transparent !important; }

/* ── KENDO WINDOW / DIALOG ── */
html[data-theme="dark"] .k-dialog,
html[data-theme="dark"] .k-window { background: #161927 !important; border-color: #252840 !important; }
html[data-theme="dark"] .k-window-titlebar { background: #1c1f30 !important; border-color: #252840 !important; color: #e2e8f0 !important; }
html[data-theme="dark"] .k-window-content { background: #161927 !important; color: #c9d1e0 !important; }
html[data-theme="dark"] .k-window-actions .k-button { background: transparent !important; border-color: transparent !important; color: #7a84a0 !important; }
html[data-theme="dark"] .k-window-actions .k-button:hover { color: #ee5d24 !important; }

/* ── KENDO SCHEDULER ── */
html[data-theme="dark"] .k-scheduler { background: #161927 !important; color: #c9d1e0 !important; border-color: #252840 !important; }
html[data-theme="dark"] .k-scheduler-header,
html[data-theme="dark"] .k-scheduler-header-wrap { background: #1c1f30 !important; border-color: #252840 !important; }
html[data-theme="dark"] .k-scheduler-table td,
html[data-theme="dark"] .k-scheduler-table th { border-color: #252840 !important; color: #c9d1e0 !important; }

/* ── SWEET ALERT ── */
html[data-theme="dark"] .swal2-popup { background: #1c1f30 !important; color: #c9d1e0 !important; }
html[data-theme="dark"] .swal2-title { color: #e2e8f0 !important; }
html[data-theme="dark"] .swal2-content { color: #c9d1e0 !important; }

/* ── MISC ── */
html[data-theme="dark"] .notification-body { background: #1c1f30 !important; }
html[data-theme="dark"] pre,
html[data-theme="dark"] code { background: #1c1f30 !important; color: #c9d1e0 !important; border-color: #252840 !important; }

/* ── LOGIN PAGE ── */
html[data-theme="dark"] .page-account header {
    background: rgba(22,25,39,0.94) !important;
    border-bottom: 1px solid #252840 !important;
}
html[data-theme="dark"] .page-account .page-body.loginbody { background-color: #0a0c15; }
html[data-theme="dark"] .page-account .page-body .section-account {
    background: rgba(22,25,39,0.96) !important;
    box-shadow: 0 28px 80px rgba(0,0,0,0.65) !important;
    color: #c9d1e0 !important;
}
html[data-theme="dark"] .page-account .login-card-top h2 { color: #e2e8f0 !important; }
html[data-theme="dark"] .page-account .login-card-top p { color: #6a7490 !important; }
html[data-theme="dark"] .page-account .form-control { background: #1c1f30 !important; border-color: #252840 !important; color: #c9d1e0 !important; }
html[data-theme="dark"] .page-account label { color: #8094b2 !important; }
html[data-theme="dark"] .page-account .login-card-icon { background: rgba(238,93,36,0.18) !important; }
html[data-theme="dark"] .page-account .seperator { border-color: #252840 !important; color: #3a3f5c !important; }
html[data-theme="dark"] .page-account .seperator .text { background: transparent !important; color: #5a6480 !important; }
html[data-theme="dark"] #act-environment { color: #8094b2 !important; }
html[data-theme="dark"] .page-account header .dark-mode-btn { color: #c9d1e0 !important; }
html[data-theme="dark"] .language-list a { color: #c9d1e0 !important; }
html[data-theme="dark"] .language-list ul { background: #1c1f30 !important; box-shadow: -2px 6px 14px rgba(0,0,0,0.5) !important; }
html[data-theme="dark"] body.page-account { background-image: url('/Content/_v2/dashboard-fullscreen-dark.svg') !important; }