/* ============================================
   DARK MODE STYLES
   ============================================ */

/* Light Mode (Default) */
:root {
  --bg-primary: #ffffff;
  --bg-secondary: #f8f9fa;
  --bg-tertiary: #e9ecef;
  --text-primary: #212529;
  --text-secondary: #67757c;
  --text-tertiary: #455a64;
  --border-color: #dee2e6;
  --card-bg: #ffffff;
  --card-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
  --sidebar-bg: #ffffff;
  --header-bg: #ffffff;
  --input-bg: #ffffff;
  --input-border: #ced4da;
  --table-bg: #ffffff;
  --table-striped: #f8f9fa;
  --table-hover: #f1f3f5;
  --dropdown-bg: #ffffff;
  --dropdown-hover: #f8f9fa;
  --modal-bg: #ffffff;
  --modal-overlay: rgba(0, 0, 0, 0.5);
  --navbar-text: #212529;
  --link-color: #455a64;
  --link-hover: var(--primary-color);
  --code-bg: #f8f9fa;
  --badge-bg: #e9ecef;
  --alert-info-bg: #d1ecf1;
  --alert-info-text: #0c5460;
  --alert-success-bg: #d4edda;
  --alert-success-text: #155724;
  --alert-warning-bg: #fff3cd;
  --alert-warning-text: #856404;
  --alert-danger-bg: #f8d7da;
  --alert-danger-text: #721c24;
  --panel-bg: #ffffff;
  --panel-border: #e6e6e6;
  --btn-default-bg: #ffffff;
  --btn-default-text: #333333;
  --btn-default-border: #cccccc;
  --scrollbar-bg: #f1f1f1;
  --scrollbar-thumb: #888888;
}

/* Dark Mode */
[data-theme="dark"] {
  --bg-primary: #1a1a1a;
  --bg-secondary: #2d2d2d;
  --bg-tertiary: #3a3a3a;
  --text-primary: #e0e0e0;
  --text-secondary: #b0b0b0;
  --text-tertiary: #a0a0a0;
  --border-color: #404040;
  --card-bg: #2d2d2d;
  --card-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
  --sidebar-bg: #1e1e1e;
  --header-bg: #1e1e1e;
  --input-bg: #2d2d2d;
  --input-border: #404040;
  --table-bg: #2d2d2d;
  --table-striped: #3a3a3a;
  --table-hover: #404040;
  --dropdown-bg: #2d2d2d;
  --dropdown-hover: #3a3a3a;
  --modal-bg: #2d2d2d;
  --modal-overlay: rgba(0, 0, 0, 0.8);
  --navbar-text: #e0e0e0;
  --link-color: #b0b0b0;
  --link-hover: var(--primary-color);
  --code-bg: #1a1a1a;
  --badge-bg: #3a3a3a;
  --alert-info-bg: #1a3a4a;
  --alert-info-text: #7dd3fc;
  --alert-success-bg: #1a3a2a;
  --alert-success-text: #86efac;
  --alert-warning-bg: #3a3a1a;
  --alert-warning-text: #fde047;
  --alert-danger-bg: #3a1a1a;
  --alert-danger-text: #fca5a5;
  --panel-bg: #2d2d2d;
  --panel-border: #404040;
  --btn-default-bg: #3a3a3a;
  --btn-default-text: #e0e0e0;
  --btn-default-border: #404040;
  --scrollbar-bg: #2d2d2d;
  --scrollbar-thumb: #555555;
}

/* Apply dark mode styles */
[data-theme="dark"] body {
  background: var(--bg-primary) !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] html {
  background: var(--bg-primary) !important;
}

/* Text colors */
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] h5,
[data-theme="dark"] h6,
[data-theme="dark"] p,
[data-theme="dark"] span,
[data-theme="dark"] div,
[data-theme="dark"] label {
  color: var(--text-primary);
}

[data-theme="dark"] .text-muted {
  color: var(--text-secondary) !important;
}

/* Override Bootstrap text utility classes */
[data-theme="dark"] .text-dark {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .text-black-50 {
  color: var(--text-secondary) !important;
}

[data-theme="dark"] .text-body {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .text-black {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .text-secondary {
  color: var(--text-secondary) !important;
}

/* Links */
[data-theme="dark"] a {
  color: var(--link-color);
}

[data-theme="dark"] a:hover,
[data-theme="dark"] a:focus {
  color: var(--link-hover);
}

/* Cards */
[data-theme="dark"] .card,
[data-theme="dark"] .panel,
[data-theme="dark"] .white-box {
  background-color: var(--card-bg) !important;
  border-color: var(--border-color) !important;
  box-shadow: var(--card-shadow) !important;
}

[data-theme="dark"] .card-header,
[data-theme="dark"] .panel-heading {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .card-body,
[data-theme="dark"] .panel-body {
  background-color: var(--card-bg) !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .card-footer,
[data-theme="dark"] .panel-footer {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

/* Card text elements - ensure all text is visible */
[data-theme="dark"] .card h1,
[data-theme="dark"] .card h2,
[data-theme="dark"] .card h3,
[data-theme="dark"] .card h4,
[data-theme="dark"] .card h5,
[data-theme="dark"] .card h6,
[data-theme="dark"] .card p,
[data-theme="dark"] .card span,
[data-theme="dark"] .card div,
[data-theme="dark"] .card label,
[data-theme="dark"] .card strong,
[data-theme="dark"] .card b,
[data-theme="dark"] .card small,
[data-theme="dark"] .card li,
[data-theme="dark"] .panel h1,
[data-theme="dark"] .panel h2,
[data-theme="dark"] .panel h3,
[data-theme="dark"] .panel h4,
[data-theme="dark"] .panel h5,
[data-theme="dark"] .panel h6,
[data-theme="dark"] .panel p,
[data-theme="dark"] .panel span,
[data-theme="dark"] .panel div,
[data-theme="dark"] .panel label,
[data-theme="dark"] .panel strong,
[data-theme="dark"] .panel b,
[data-theme="dark"] .panel small,
[data-theme="dark"] .panel li,
[data-theme="dark"] .white-box h1,
[data-theme="dark"] .white-box h2,
[data-theme="dark"] .white-box h3,
[data-theme="dark"] .white-box h4,
[data-theme="dark"] .white-box h5,
[data-theme="dark"] .white-box h6,
[data-theme="dark"] .white-box p,
[data-theme="dark"] .white-box span,
[data-theme="dark"] .white-box div,
[data-theme="dark"] .white-box label,
[data-theme="dark"] .white-box strong,
[data-theme="dark"] .white-box b,
[data-theme="dark"] .white-box small,
[data-theme="dark"] .white-box li {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .card .text-dark,
[data-theme="dark"] .panel .text-dark,
[data-theme="dark"] .white-box .text-dark {
  color: var(--text-primary) !important;
}

/* Custom dashboard card classes - with high specificity */
[data-theme="dark"] .card .card-title,
[data-theme="dark"] div.card-title,
[data-theme="dark"] .card-title {
  color: #e0e0e0 !important;
}

[data-theme="dark"] .card .card-value,
[data-theme="dark"] div.card-value,
[data-theme="dark"] .card-value {
  color: #e0e0e0 !important;
  /* Override gradient text effect */
  background: none !important;
  -webkit-text-fill-color: #e0e0e0 !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
}

[data-theme="dark"] .card .card-subtitle,
[data-theme="dark"] div.card-subtitle,
[data-theme="dark"] .card-subtitle {
  color: #e0e0e0 !important;
}

[data-theme="dark"] .card .card-header1,
[data-theme="dark"] div.card-header1,
[data-theme="dark"] .card-header1 {
  color: #e0e0e0 !important;
}

[data-theme="dark"] .card .card-footer1,
[data-theme="dark"] div.card-footer1,
[data-theme="dark"] .card-footer1 {
  color: #e0e0e0 !important;
}

[data-theme="dark"] .card-header1 > div,
[data-theme="dark"] .card-header1 div,
[data-theme="dark"] .card-header1 span,
[data-theme="dark"] .card-footer1 > div,
[data-theme="dark"] .card-footer1 div,
[data-theme="dark"] .card-footer1 span {
  color: #e0e0e0 !important;
}

[data-theme="dark"] .card-icon,
[data-theme="dark"] .card-icon i {
  color: #e0e0e0 !important;
}

[data-theme="dark"] .status-tag {
  color: #e0e0e0 !important;
}

[data-theme="dark"] .dashboard-container .card {
  background-color: var(--card-bg) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .dashboard-container .card .card-title,
[data-theme="dark"] .dashboard-container .card .card-value,
[data-theme="dark"] .dashboard-container .card .card-subtitle,
[data-theme="dark"] .dashboard-container .card .card-header1,
[data-theme="dark"] .dashboard-container .card .card-footer1 {
  color: #e0e0e0 !important;
}

/* Ensure all text inside cards is light colored */
[data-theme="dark"] .card *:not(.btn):not(.badge):not(.alert) {
  color: #e0e0e0 !important;
}

[data-theme="dark"] .dashboard-container * {
  color: #e0e0e0;
}

/* Keep buttons and badges with their own colors */
[data-theme="dark"] .btn,
[data-theme="dark"] .badge {
  color: inherit;
}

/* Sidebar */
[data-theme="dark"] .sidebar,
[data-theme="dark"] .left-sidebar {
  background-color: var(--sidebar-bg) !important;
}

/* Force white text on all sidebar links and elements in dark mode */
[data-theme="dark"] .sidebar-nav ul li a,
[data-theme="dark"] .sidebar-link {
  color: #ffffff !important;
}

/* Ensure all child elements of sidebar links are white */
[data-theme="dark"] .sidebar-nav ul li a *,
[data-theme="dark"] .sidebar-link * {
  color: #ffffff !important;
}

/* Sidebar text and spans */
[data-theme="dark"] .sidebar-nav ul li a span,
[data-theme="dark"] .sidebar-nav ul li a .hide-menu {
  color: #ffffff !important;
}

[data-theme="dark"] .sidebar-nav ul li a:hover,
[data-theme="dark"] .sidebar-link:hover {
  background-color: var(--bg-secondary) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .sidebar-nav ul li a:hover *,
[data-theme="dark"] .sidebar-link:hover * {
  color: #ffffff !important;
}

[data-theme="dark"] .sidebar-nav ul li.active > a,
[data-theme="dark"] .sidebar-link.active {
  background-color: var(--bg-secondary) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .sidebar-nav ul li.active > a *,
[data-theme="dark"] .sidebar-link.active * {
  color: #ffffff !important;
}

[data-theme="dark"] .sidebar-nav ul li.selected > a,
[data-theme="dark"] .sidebar-nav ul li > a.active {
  color: #ffffff !important;
}

[data-theme="dark"] .sidebar-nav ul li.selected > a *,
[data-theme="dark"] .sidebar-nav ul li > a.active * {
  color: #ffffff !important;
}

/* Nested sidebar items (first-level, sub-menu) */
[data-theme="dark"] .sidebar-nav ul li .first-level .sidebar-item .sidebar-link {
  color: #ffffff !important;
}

[data-theme="dark"] .sidebar-nav ul li .first-level .sidebar-item .sidebar-link * {
  color: #ffffff !important;
}

[data-theme="dark"] .sidebar-nav ul li .first-level .sidebar-item .sidebar-link:hover {
  background-color: var(--bg-secondary) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .sidebar-nav ul li .first-level .sidebar-item .sidebar-link:hover * {
  color: #ffffff !important;
}

[data-theme="dark"] .sidebar-nav ul li .first-level .sidebar-item.active > .sidebar-link,
[data-theme="dark"] .sidebar-nav ul li .first-level .sidebar-item > .sidebar-link.active {
  background-color: var(--bg-secondary) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .sidebar-nav ul li .first-level .sidebar-item.active > .sidebar-link *,
[data-theme="dark"] .sidebar-nav ul li .first-level .sidebar-item > .sidebar-link.active * {
  color: #ffffff !important;
}

/* Header/Navbar */
[data-theme="dark"] .navbar,
[data-theme="dark"] .top-navbar,
[data-theme="dark"] .header {
  background-color: var(--header-bg) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .navbar-header,
[data-theme="dark"] .navbar-nav {
  background-color: var(--header-bg) !important;
}

[data-theme="dark"] .navbar-nav > li > a {
  color: var(--navbar-text) !important;
}

/* Header/Navbar text styling */
[data-theme="dark"] .nav-link {
  color: white !important;
}

[data-theme="dark"] .nav-link:hover {
  color: #ffffff !important;
}

[data-theme="dark"] .user-name {
  color: white !important;
}

[data-theme="dark"] .navbar-collapse {
  background-color: var(--header-bg) !important;
}

[data-theme="dark"] .navbar-brand {
  color: white !important;
}

[data-theme="dark"] .notification {
  color: white !important;
}

[data-theme="dark"] .notification i {
  color: white !important;
}

[data-theme="dark"] .theme-toggle {
  color: white !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
}

[data-theme="dark"] .theme-toggle:hover {
  color: white !important;
}

[data-theme="dark"] .theme-text {
  color: white !important;
}

[data-theme="dark"] .dropdown-trigger {
  background-color: var(--bg-secondary) !important;
}

[data-theme="dark"] .dropdown-trigger span {
  color: white !important;
}

[data-theme="dark"] .dropdown-trigger i {
  color: white !important;
}

/* Tables */
[data-theme="dark"] table,
[data-theme="dark"] .table {
  background-color: var(--table-bg) !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .table thead th {
  background-color: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .table tbody tr {
  background-color: var(--table-bg) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd) {
  background-color: var(--table-striped) !important;
}

[data-theme="dark"] .table-hover tbody tr:hover {
  background-color: var(--table-hover) !important;
}

[data-theme="dark"] .table td,
[data-theme="dark"] .table th {
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

/* Forms */
[data-theme="dark"] .form-control,
[data-theme="dark"] input[type="text"],
[data-theme="dark"] input[type="email"],
[data-theme="dark"] input[type="password"],
[data-theme="dark"] input[type="number"],
[data-theme="dark"] input[type="tel"],
[data-theme="dark"] input[type="date"],
[data-theme="dark"] input[type="time"],
[data-theme="dark"] input[type="datetime-local"],
[data-theme="dark"] textarea,
[data-theme="dark"] select {
  background-color: var(--input-bg) !important;
  border-color: var(--input-border) !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .form-control:focus,
[data-theme="dark"] input:focus,
[data-theme="dark"] textarea:focus,
[data-theme="dark"] select:focus {
  background-color: var(--input-bg) !important;
  border-color: var(--primary-color) !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .form-control::placeholder,
[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
  color: var(--text-secondary) !important;
}

/* Select dropdown options in dark mode */
[data-theme="dark"] select,
[data-theme="dark"] select.form-control {
  color: white !important;
  background-color: var(--input-bg) !important;
}

[data-theme="dark"] select option {
  color: white !important;
  background-color: #2d2d2d !important;
}

[data-theme="dark"] select option:hover {
  background-color: #404040 !important;
  color: white !important;
}

[data-theme="dark"] select option:checked {
  background: linear-gradient(#0ea5e9, #0ea5e9) !important;
  background-color: #0ea5e9 !important;
  color: white !important;
}

/* Dropdowns */
[data-theme="dark"] .dropdown-menu {
  background-color: var(--dropdown-bg) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .dropdown-item {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .dropdown-item:hover,
[data-theme="dark"] .dropdown-item:focus {
  background-color: var(--dropdown-hover) !important;
  color: var(--text-primary) !important;
}

/* Branch Dropdown - Ensure white text */
[data-theme="dark"] .dropdown-menu .dropdown-item {
  color: white !important;
}

[data-theme="dark"] .dropdown-menu .dropdown-item *,
[data-theme="dark"] .select2-dropdown .select2-results__option {
  color: white !important;
}

[data-theme="dark"] .dropdown-menu .dropdown-item:hover {
  color: white !important;
}

[data-theme="dark"] .dropdown-menu .dropdown-item span {
  color: white !important;
}

/* Branch select dropdown styling for dark mode */
[data-theme="dark"] .select2-dropdown {
  background-color: var(--dropdown-bg) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .select2-results__option {
  color: white !important;
}

[data-theme="dark"] .select2-results__option * {
  color: white !important;
}

[data-theme="dark"] .select2-results__option:hover {
  background-color: var(--dropdown-hover) !important;
  color: white !important;
}

[data-theme="dark"] .select2-results__option:hover * {
  color: white !important;
}

[data-theme="dark"] .select2-results__option--highlighted {
  background-color: var(--dropdown-hover) !important;
  color: white !important;
}

[data-theme="dark"] .select2-results__option--highlighted * {
  color: white !important;
}

[data-theme="dark"] .select2-results__option.select2-results__option--selected {
  color: white !important;
}

[data-theme="dark"] .select2-results__option.select2-results__option--selected * {
  color: white !important;
}

[data-theme="dark"] .select2-selection {
  background-color: var(--input-bg) !important;
  border-color: var(--input-border) !important;
  color: white !important;
}

[data-theme="dark"] .select2-selection * {
  color: white !important;
}

[data-theme="dark"] .select2-selection__rendered {
  color: white !important;
}

[data-theme="dark"] .select2-selection--multiple .select2-selection__choice {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
  color: white !important;
}

[data-theme="dark"] .select2-selection--multiple .select2-selection__choice * {
  color: white !important;
}

/* Modals */
[data-theme="dark"] .modal-content {
  background-color: var(--modal-bg) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .modal-header {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
}

[data-theme="dark"] .modal-header .close {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .modal-body {
  background-color: var(--modal-bg) !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .modal-footer {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
}

/* Buttons */
[data-theme="dark"] .btn-default {
  background-color: var(--btn-default-bg) !important;
  border-color: var(--btn-default-border) !important;
  color: var(--btn-default-text) !important;
}

[data-theme="dark"] .btn-default:hover {
  background-color: var(--bg-tertiary) !important;
  border-color: var(--border-color) !important;
}

/* Alerts */
[data-theme="dark"] .alert-info {
  background-color: var(--alert-info-bg) !important;
  color: var(--alert-info-text) !important;
  border-color: var(--alert-info-text) !important;
}

[data-theme="dark"] .alert-success {
  background-color: var(--alert-success-bg) !important;
  color: var(--alert-success-text) !important;
  border-color: var(--alert-success-text) !important;
}

[data-theme="dark"] .alert-warning {
  background-color: var(--alert-warning-bg) !important;
  color: var(--alert-warning-text) !important;
  border-color: var(--alert-warning-text) !important;
}

[data-theme="dark"] .alert-danger {
  background-color: var(--alert-danger-bg) !important;
  color: var(--alert-danger-text) !important;
  border-color: var(--alert-danger-text) !important;
}

/* Badges */
[data-theme="dark"] .badge-default {
  background-color: var(--badge-bg) !important;
  color: white !important;
}

[data-theme="dark"] .badge {
  color: white !important;
  font-weight: 600 !important;
}

[data-theme="dark"] .badge-light {
  background: #404040 !important;
  color: white !important;
}

[data-theme="dark"] .badge-primary {
  background: linear-gradient(135deg, #0ea5e9 0%, #0284c7 100%) !important;
  color: white !important;
}

[data-theme="dark"] .badge-success {
  background: linear-gradient(135deg, #10b981 0%, #059669 100%) !important;
  color: white !important;
}

[data-theme="dark"] .badge-warning {
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
  color: white !important;
}

[data-theme="dark"] .badge-danger {
  background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%) !important;
  color: white !important;
}

[data-theme="dark"] .badge-dark {
  background: #555555 !important;
  color: white !important;
}

[data-theme="dark"] .badge-info {
  background: linear-gradient(135deg, #06b6d4 0%, #0891b2 100%) !important;
  color: white !important;
}

/* Breadcrumbs */
[data-theme="dark"] .breadcrumb {
  background-color: var(--bg-secondary) !important;
  color: white !important;
}

[data-theme="dark"] .breadcrumb-item {
  color: white !important;
}

[data-theme="dark"] .breadcrumb-item.active {
  color: white !important;
}

[data-theme="dark"] .page-titles {
  background-color: var(--bg-secondary) !important;
  color: var(--text-primary) !important;
  border-bottom-color: var(--border-color) !important;
}

[data-theme="dark"] .page-titles h1,
[data-theme="dark"] .page-titles h2,
[data-theme="dark"] .page-titles h3,
[data-theme="dark"] .page-titles h4,
[data-theme="dark"] .page-titles h5,
[data-theme="dark"] .page-titles h6 {
  color: white !important;
}

[data-theme="dark"] .text-primary {
  color: white !important;
}


[data-theme="dark"] .breadcrumb-item,
[data-theme="dark"] .breadcrumb-item a {
  color: var(--text-secondary) !important;
}

/* Pagination */
[data-theme="dark"] .pagination .page-link {
  background-color: var(--bg-secondary) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .pagination .page-link:hover {
  background-color: var(--bg-tertiary) !important;
}

[data-theme="dark"] .page-wrapper {
  background: #1a1a1a !important;
  border-color: #1a1a1a !important;
  border: none !important;
  border-bottom: none !important;
}

[data-theme="dark"] #main-wrapper {
  background: #1a1a1a !important;
  border: none !important;
}

[data-theme="dark"] body {
  background: #1a1a1a !important;
  border: none !important;
}

[data-theme="dark"] .container-fluid {
  background: #1a1a1a !important;
  border: none !important;
  border-bottom: none !important;
  padding: 15px 20px !important;
  margin: 0 !important;
  margin-bottom: 0 !important;
}

[data-theme="dark"] .row {
  background: transparent !important;
  border: none !important;
}

[data-theme="dark"] [class*="col-"] {
  background: transparent !important;
  border: none !important;
}

[data-theme="dark"] .card,
[data-theme="dark"] .white-box {
  background-color: #2d2d2d !important;
}

/* Footer */
[data-theme="dark"] .footer {
  background: #1a1a1a !important;
  background-color: #1a1a1a !important;
  color: #e0e0e0 !important;
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
  border-left: none !important;
  border-right: none !important;
  border-color: transparent !important;
  border-top-color: transparent !important;
  text-align: right !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  margin: 0 !important;
  margin-top: 0 !important;
  padding: 15px 10px !important;
}

[data-theme="dark"] .sidebar-footer {
  background: #1a1a1a !important;
  border-top: 1px solid #404040 !important;
}

[data-theme="dark"] .sidebar-footer a {
  color: #e0e0e0 !important;
}

[data-theme="dark"] .sidebar-footer a:hover {
  color: white !important;
}

[data-theme="dark"] .footer a {
  color: #64b5f6 !important;
  text-decoration: none;
}

[data-theme="dark"] .footer a:hover {
  color: #90caf9 !important;
  text-decoration: underline;
}

[data-theme="dark"] .footer b {
  color: #ffffff !important;
  font-weight: 600;
}

[data-theme="dark"] .footer span {
  color: #e0e0e0 !important;
}

/* Scrollbar */
[data-theme="dark"] ::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

[data-theme="dark"] ::-webkit-scrollbar-track {
  background: var(--scrollbar-bg);
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
  background: var(--scrollbar-thumb);
  border-radius: 5px;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
  background: #666666;
}

/* Borders */
[data-theme="dark"] hr {
  border-color: var(--border-color) !important;
}

/* Pre and Code */
[data-theme="dark"] pre,
[data-theme="dark"] code {
  background-color: var(--code-bg) !important;
  color: var(--text-primary) !important;
}

/* DataTables specific */
[data-theme="dark"] .dataTables_wrapper {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button {
  color: var(--text-primary) !important;
}

[data-theme="dark"] .dataTables_wrapper .dataTables_info {
  color: var(--text-secondary) !important;
}

/* Additional elements that need light text in dark mode */
[data-theme="dark"] .card-title,
[data-theme="dark"] .card-subtitle,
[data-theme="dark"] .card-text,
[data-theme="dark"] .list-group-item {
  color: var(--text-primary) !important;
  background-color: transparent !important;
}

[data-theme="dark"] .list-group-item {
  border-color: var(--border-color) !important;
}

/* Row and column elements */
[data-theme="dark"] .row,
[data-theme="dark"] .col,
[data-theme="dark"] [class*="col-"] {
  color: inherit;
}

/* Stats and info boxes */
[data-theme="dark"] .info-box,
[data-theme="dark"] .small-box,
[data-theme="dark"] .box {
  background-color: var(--card-bg) !important;
  color: var(--text-primary) !important;
}

[data-theme="dark"] .info-box h3,
[data-theme="dark"] .info-box p,
[data-theme="dark"] .small-box h3,
[data-theme="dark"] .small-box p,
[data-theme="dark"] .box h3,
[data-theme="dark"] .box p {
  color: var(--text-primary) !important;
}

/* Override any inline styles that might set dark colors */
[data-theme="dark"] [style*="color: #000"],
[data-theme="dark"] [style*="color: black"],
[data-theme="dark"] [style*="color: #333"],
[data-theme="dark"] [style*="color:#000"],
[data-theme="dark"] [style*="color:black"],
[data-theme="dark"] [style*="color:#333"] {
  color: var(--text-primary) !important;
}

/* Dark Mode Toggle Button */
.theme-toggle {
  background: none;
  border: 2px solid var(--primary-color);
  color: var(--primary-color);
  padding: 8px 16px;
  border-radius: 50px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  transition: all 0.3s ease;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-left: 10px;
}

.theme-toggle:hover {
  background-color: var(--primary-color);
  color: white;
  transform: scale(1.05);
}

.theme-toggle i {
  font-size: 16px;
}

/* Page wrapper and body wrapper */
[data-theme="dark"] .page-wrapper,
[data-theme="dark"] .body-wrapper,
[data-theme="dark"] .container-fluid,
[data-theme="dark"] .container {
  background-color: var(--bg-primary) !important;
  color: var(--text-primary) !important;
}

/* Catch-all for any remaining dark text */
[data-theme="dark"] .page-wrapper *,
[data-theme="dark"] .body-wrapper *,
[data-theme="dark"] .container-fluid *,
[data-theme="dark"] main * {
  color: inherit;
}

/* Smooth transitions for theme change */
body,
.card,
.panel,
.white-box,
.sidebar,
.navbar,
.table,
.form-control,
.dropdown-menu,
.modal-content {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* ============================================
   LOGIN PAGES DARK MODE STYLES
   ============================================ */

/* Login page specific dark mode */
[data-theme="dark"] .container-login100 {
  background: linear-gradient(135deg, #1a4d2e 0%, #4f772d 50%, #132a13 100%) !important;
}

[data-theme="dark"] .wrap-login100 {
  background: rgba(30, 30, 30, 0.95) !important;
  backdrop-filter: blur(20px);
}

[data-theme="dark"] .login100-form-title {
  background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

[data-theme="dark"] .input100 {
  background: #2d2d2d !important;
  border-color: #404040 !important;
  color: #e0e0e0 !important;
}

[data-theme="dark"] .input100::placeholder {
  color: #888888 !important;
}

[data-theme="dark"] .input100:focus {
  background: #3a3a3a !important;
  border-color: var(--primary-color) !important;
}

[data-theme="dark"] .txt1,
[data-theme="dark"] .txt2 {
  color: #b0b0b0 !important;
}

[data-theme="dark"] .txt2:hover {
  color: var(--primary-color) !important;
}

[data-theme="dark"] .symbol-input100 {
  color: #888888 !important;
}

[data-theme="dark"] .input100:focus + .focus-input100 + .symbol-input100 {
  color: var(--primary-color) !important;
}

[data-theme="dark"] .eye-icon {
  color: #888888 !important;
}

[data-theme="dark"] .eye-icon:hover {
  color: var(--primary-color) !important;
}

[data-theme="dark"] .copy-right {
  color: #888888 !important;
}

/* Login alerts in dark mode */
[data-theme="dark"] .alert {
  border: 1px solid;
}

[data-theme="dark"] .alert-danger {
  background: linear-gradient(135deg, #3a1a1a, #2a1515) !important;
  color: #fca5a5 !important;
  border-color: #721c24 !important;
}

[data-theme="dark"] .alert-success {
  background: linear-gradient(135deg, #1a3a2a, #153a1a) !important;
  color: #86efac !important;
  border-color: #28a745 !important;
}

[data-theme="dark"] .alert-warning {
  background: linear-gradient(135deg, #3a3a1a, #2a2a15) !important;
  color: #fde047 !important;
  border-color: #ffc107 !important;
}
[data-theme="dark"] .page-wrapper {
  border: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

[data-theme="dark"] #main-wrapper {
  border: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
  background: #1a1a1a !important;
}

[data-theme="dark"] .body-wrapper {
  border: none !important;
  border-bottom: none !important;
}
/* ============================================
   DARK MODE FOR SAFARICOM LOGIN PAGE
   ============================================ */

[data-theme="dark"] .safaricom-login-container {
  background: linear-gradient(135deg, #1a1a1a 0%, #1e2a1e 100%) !important;
}

[data-theme="dark"] .safaricom-login-container::before {
  background: rgba(76, 175, 80, 0.05) !important;
}

[data-theme="dark"] .safaricom-login-container::after {
  background: rgba(76, 175, 80, 0.08) !important;
}

[data-theme="dark"] .dot {
  background: #4CAF50 !important;
  opacity: 0.4 !important;
}

[data-theme="dark"] .login-card {
  background: #2d2d2d !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5) !important;
}

[data-theme="dark"] .daraja-title .green {
  color: #66BB6A !important;
}

[data-theme="dark"] .daraja-title .red {
  color: #EF5350 !important;
}

[data-theme="dark"] .welcome-text {
  color: #66BB6A !important;
}

[data-theme="dark"] .login-instruction {
  color: #b0b0b0 !important;
}

[data-theme="dark"] .input-safaricom {
  background: #3a3a3a !important;
  border: 1px solid #505050 !important;
  color: #e0e0e0 !important;
}

[data-theme="dark"] .input-safaricom::placeholder {
  color: #808080 !important;
}

[data-theme="dark"] .input-safaricom:focus {
  border-color: #66BB6A !important;
  box-shadow: 0 0 0 3px rgba(102, 187, 106, 0.2) !important;
  background: #404040 !important;
}

[data-theme="dark"] .password-toggle-icon {
  color: #b0b0b0 !important;
}

[data-theme="dark"] .password-toggle-icon:hover {
  color: #e0e0e0 !important;
}

[data-theme="dark"] .btn-login-safaricom {
  background: #4CAF50 !important;
  color: white !important;
}

[data-theme="dark"] .btn-login-safaricom:hover:not(:disabled) {
  background: #66BB6A !important;
}

[data-theme="dark"] .btn-login-safaricom:disabled {
  background: #555555 !important;
}

[data-theme="dark"] .forgot-password-link a {
  color: #66BB6A !important;
}

[data-theme="dark"] .forgot-password-link a:hover {
  color: #81C784 !important;
}

[data-theme="dark"] .signup-text {
  color: #b0b0b0 !important;
}

[data-theme="dark"] .signup-text a {
  color: #66BB6A !important;
}

[data-theme="dark"] .signup-text a:hover {
  color: #81C784 !important;
}

[data-theme="dark"] .alert-danger {
  background-color: #3a1a1a !important;
  color: #fca5a5 !important;
  border-color: #5a2a2a !important;
}

[data-theme="dark"] .alert-success {
  background-color: #1a3a2a !important;
  color: #86efac !important;
  border-color: #2a5a3a !important;
}

[data-theme="dark"] .alert-warning {
  background-color: #3a3a1a !important;
  color: #fde047 !important;
  border-color: #5a5a2a !important;
}

[data-theme="dark"] #theme-toggle {
  background: #2d2d2d !important;
  border: 1px solid #505050 !important;
  color: #e0e0e0 !important;
}

[data-theme="dark"] #theme-toggle:hover {
  background: #3a3a3a !important;
}
