:root {
  --app-bg: #f4f6f9;
  --app-surface: #ffffff;
  --app-surface-2: #f8fafc;
  --app-text: #0f172a;
  --app-muted: #64748b;
  --app-border: #dbe3ec;
  --app-primary: #2c3e50;
  --app-primary-hover: #223140;
  --app-header: var(--color-header, #3c8dbc);
  --app-sidebar: var(--color-sidebar, #222d32);
  --app-sidebar-text: #ecf0f1;
  --app-sidebar-muted: #a1b0c0;
  --app-sidebar-hover: rgba(255, 255, 255, 0.11);
  --app-sidebar-active: rgba(255, 255, 255, 0.18);
  --app-sidebar-submenu: rgba(0, 0, 0, 0.22);
  --app-sidebar-border: rgba(255, 255, 255, 0.06);
  --app-sidebar-header: rgba(236, 240, 241, 0.55);
  --app-sidebar-user-panel: transparent;
  --app-table-head: #eef2f7;
  --app-table-hover: #f1f5f9;
  --app-input-bg: #ffffff;
  --app-input-text: #0f172a;
  --app-input-placeholder: #94a3b8;
  --app-disabled-bg: #e5e7eb;
  --app-disabled-text: #64748b;
  --app-focus-ring: rgba(44, 62, 80, 0.22);
  --app-success-bg: #dcfce7;
  --app-success-text: #166534;
  --app-success-solid: #15803d;
  --app-warning-bg: #fef3c7;
  --app-warning-text: #92400e;
  --app-warning-solid: #b45309;
  --app-danger-bg: #fee2e2;
  --app-danger-text: #991b1b;
  --app-danger-solid: #b91c1c;
  --app-info-bg: #dbeafe;
  --app-info-text: #1e3a8a;
  --app-info-solid: #2563eb;
  --app-active-bg: #edf2f7;
  --app-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}

html[data-theme="light"] .wrapper {
  --color-header: #fbfdff;
  --color-sidebar: #eef3f8;
}

html[data-theme="light"] {
  --app-bg: #f5f7fb;
  --app-surface: #ffffff;
  --app-surface-2: #f7f9fc;
  --app-surface-3: #eef3f8;
  --app-text: #111827;
  --app-muted: #66758a;
  --app-border: #d7e0ea;
  --app-primary: #2c3e50;
  --app-primary-hover: #1f2d3a;
  --app-header: #fbfdff;
  --app-sidebar: #eef3f8;
  --app-sidebar-text: #1f2937;
  --app-sidebar-muted: #6b7a90;
  --app-sidebar-hover: #e4ebf3;
  --app-sidebar-active: #dce7f3;
  --app-sidebar-submenu: #e8eef5;
  --app-table-head: #e9eff6;
  --app-table-row: #ffffff;
  --app-table-row-alt: #f8fafc;
  --app-table-hover: #edf4fb;
  --app-input-bg: #ffffff;
  --app-input-text: #111827;
  --app-input-placeholder: #94a3b8;
  --app-disabled-bg: #e5e7eb;
  --app-disabled-text: #64748b;
  --app-focus-ring: rgba(44, 62, 80, 0.24);
  --app-success-bg: #dcfce7;
  --app-success-text: #166534;
  --app-success-solid: #15803d;
  --app-warning-bg: #fef3c7;
  --app-warning-text: #92400e;
  --app-warning-solid: #b45309;
  --app-danger-bg: #fee2e2;
  --app-danger-text: #991b1b;
  --app-danger-solid: #b91c1c;
  --app-info-bg: #dbeafe;
  --app-info-text: #1e3a8a;
  --app-info-solid: #2563eb;
  --app-active-bg: #e6eef7;
  --app-elevated-shadow: 0 14px 34px rgba(31, 45, 58, 0.10);
  --app-card-shadow: 0 8px 22px rgba(31, 45, 58, 0.07);
  --app-header-shadow: 0 10px 26px rgba(31, 45, 58, 0.09);
  --app-sidebar-shadow: inset -1px 0 0 rgba(148, 163, 184, 0.28);
  --app-shadow: 0 12px 30px rgba(31, 45, 58, 0.08);
}

html[data-theme="dark"] .wrapper {
  --color-header: #1f2023;
  --color-sidebar: #171717;
}

html[data-theme="dark"] {
  --app-bg: #202123;
  --app-surface: #2a2b2f;
  --app-surface-2: #303136;
  --app-surface-3: #383a40;
  --app-text: #f3f4f6;
  --app-muted: #b4b7be;
  --app-border: #3a3c42;
  --app-primary: #8a95a6;
  --app-primary-hover: #a3adba;
  --app-header: #1f2023;
  --app-sidebar: #171717;
  --app-sidebar-text: #e5e7eb;
  --app-sidebar-muted: #9ca3af;
  --app-sidebar-hover: #242529;
  --app-sidebar-active: #2f3035;
  --app-sidebar-submenu: #1d1e21;
  --app-table-head: #36383d;
  --app-table-row: #303136;
  --app-table-row-alt: #34363b;
  --app-table-hover: #3a3c42;
  --app-input-bg: #282a2e;
  --app-input-text: #f3f4f6;
  --app-input-placeholder: #9498a1;
  --app-disabled-bg: #303136;
  --app-disabled-text: #92969f;
  --app-focus-ring: rgba(151, 163, 181, 0.26);
  --app-success-bg: #183226;
  --app-success-text: #9bd8b3;
  --app-success-solid: #2f7d55;
  --app-warning-bg: #342b18;
  --app-warning-text: #e6c979;
  --app-warning-solid: #9a6a27;
  --app-danger-bg: #351d22;
  --app-danger-text: #e7a2a9;
  --app-danger-solid: #9c3f49;
  --app-info-bg: #242f3c;
  --app-info-text: #a8c2dc;
  --app-info-solid: #52708d;
  --app-active-bg: #36383d;
  --app-elevated-shadow: 0 24px 54px rgba(0, 0, 0, 0.32);
  --app-card-shadow: 0 18px 42px rgba(0, 0, 0, 0.26);
  --app-header-shadow: 0 14px 32px rgba(0, 0, 0, 0.22);
  --app-sidebar-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.045);
  --app-shadow: 0 20px 46px rgba(0, 0, 0, 0.28);
}

html[data-theme="custom"] {
  --app-bg: #f4f6f9;
  --app-surface: #ffffff;
  --app-surface-2: #f8fafc;
  --app-surface-3: #eef2f7;
  --app-text: #0f172a;
  --app-muted: #64748b;
  --app-border: #dbe3ec;
  --app-primary: var(--color-header, #3c8dbc);
  --app-primary-hover: color-mix(in srgb, var(--color-header, #3c8dbc) 86%, #000000);
  --app-header: var(--color-header, #3c8dbc);
  --app-header-text: var(--color-header-text, #ffffff);
  --app-header-hover: var(--color-header-hover, rgba(255, 255, 255, 0.14));
  --app-sidebar: var(--color-sidebar, #222d32);
  --app-sidebar-text: var(--color-sidebar-text, #ecf0f1);
  --app-sidebar-muted: var(--color-sidebar-muted, #a1b0c0);
  --app-sidebar-hover: var(--color-sidebar-hover, rgba(255, 255, 255, 0.14));
  --app-sidebar-active: var(--color-sidebar-hover, rgba(255, 255, 255, 0.18));
  --app-sidebar-submenu: color-mix(in srgb, var(--color-sidebar, #222d32) 82%, #000000);
  --app-sidebar-border: rgba(255, 255, 255, 0.06);
  --app-sidebar-header: var(--color-sidebar-muted, rgba(236, 240, 241, 0.55));
  --app-sidebar-user-panel: transparent;
  --app-table-head: #eef2f7;
  --app-table-row: #ffffff;
  --app-table-row-alt: #f8fafc;
  --app-table-hover: #f1f5f9;
  --app-input-bg: #ffffff;
  --app-input-text: #0f172a;
  --app-input-placeholder: #94a3b8;
  --app-disabled-bg: #e5e7eb;
  --app-disabled-text: #64748b;
  --app-focus-ring: rgba(44, 62, 80, 0.22);
  --app-active-bg: rgba(255, 255, 255, 0.18);
  --app-card-shadow: 0 8px 22px rgba(15, 23, 42, 0.08);
  --app-header-shadow: none;
  --app-sidebar-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.06);
}

html[data-theme="custom"] body .wrapper {
  --app-primary: var(--color-header, #3c8dbc);
  --app-primary-hover: color-mix(in srgb, var(--color-header, #3c8dbc) 86%, #000000);
  --app-header: var(--color-header, #3c8dbc);
  --app-header-text: var(--color-header-text, #ffffff);
  --app-header-hover: var(--color-header-hover, rgba(255, 255, 255, 0.14));
  --app-sidebar: var(--color-sidebar, #222d32);
  --app-sidebar-text: var(--color-sidebar-text, #ecf0f1);
  --app-sidebar-muted: var(--color-sidebar-muted, #a1b0c0);
  --app-sidebar-hover: var(--color-sidebar-hover, rgba(255, 255, 255, 0.14));
  --app-sidebar-active: var(--color-sidebar-hover, rgba(255, 255, 255, 0.18));
  --app-sidebar-submenu: color-mix(in srgb, var(--color-sidebar, #222d32) 82%, #000000);
  --app-sidebar-header: var(--color-sidebar-muted, rgba(236, 240, 241, 0.55));
}

html[data-theme="light"] body,
html[data-theme="light"] .content-wrapper,
html[data-theme="light"] .right-side,
html[data-theme="dark"] body,
html[data-theme="dark"] .content-wrapper,
html[data-theme="dark"] .right-side {
  background: var(--app-bg) !important;
  color: var(--app-text);
  transition: background-color 180ms ease, color 180ms ease;
}

html[data-theme="light"] .main-header .navbar,
html[data-theme="light"] .main-header .logo,
html[data-theme="light"] .user-menu .user-header,
html[data-theme="dark"] .main-header .navbar,
html[data-theme="dark"] .main-header .logo,
html[data-theme="dark"] .user-menu .user-header {
  background-color: var(--app-header) !important;
}

html[data-theme="light"] .main-header .navbar,
html[data-theme="light"] .main-header .logo {
  border-bottom: 1px solid var(--app-border);
  box-shadow: var(--app-header-shadow);
}

html[data-theme="light"] .sidebar-toggle,
html[data-theme="light"] .navbar-nav > li > a {
  color: #0f172a !important;
}

html[data-theme="light"] .user-menu .user-header,
html[data-theme="light"] .user-menu .user-header p,
html[data-theme="light"] .user-menu .user-header small {
  color: #0f172a !important;
}

html[data-theme] .main-sidebar {
  background-color: var(--app-sidebar) !important;
  box-shadow: var(--app-sidebar-shadow);
}

html[data-theme] .sidebar-menu > li > a,
html[data-theme] .treeview-menu > li > a {
  color: var(--app-sidebar-text) !important;
}

html[data-theme] .treeview-menu {
  background-color: var(--app-sidebar-submenu) !important;
}

html[data-theme] .sidebar-menu > li > a > .fa,
html[data-theme] .sidebar-menu > li > a > .glyphicon,
html[data-theme] .sidebar-menu > li > a > .ion {
  color: var(--app-sidebar-muted) !important;
}

html[data-theme="light"] .sidebar,
html[data-theme="light"] .sidebar-menu,
html[data-theme="dark"] .sidebar,
html[data-theme="dark"] .sidebar-menu {
  background: var(--app-sidebar) !important;
}

html[data-theme="light"] .sidebar-menu > li.header,
html[data-theme="light"] .sidebar-menu .treeview-menu > li > a,
html[data-theme="dark"] .sidebar-menu > li.header,
html[data-theme="dark"] .sidebar-menu .treeview-menu > li > a {
  color: var(--app-sidebar-muted) !important;
}

html[data-theme="light"] .sidebar-menu > li:hover > a,
html[data-theme="light"] .sidebar-menu > li.active > a,
html[data-theme="light"] .sidebar-menu > li.menu-open > a,
html[data-theme="light"] .treeview-menu > li.active > a,
html[data-theme="light"] .treeview-menu > li > a:hover,
html[data-theme="dark"] .sidebar-menu > li:hover > a,
html[data-theme="dark"] .sidebar-menu > li.active > a,
html[data-theme="dark"] .sidebar-menu > li.menu-open > a,
html[data-theme="dark"] .treeview-menu > li.active > a,
html[data-theme="dark"] .treeview-menu > li > a:hover {
  background: var(--app-sidebar-hover) !important;
  color: var(--app-sidebar-text) !important;
}

html[data-theme="light"] .sidebar-menu > li.active > a,
html[data-theme="light"] .treeview-menu > li.active > a,
html[data-theme="dark"] .sidebar-menu > li.active > a,
html[data-theme="dark"] .treeview-menu > li.active > a {
  background: var(--app-sidebar-active) !important;
  border-left-color: var(--app-primary) !important;
}

html[data-theme="light"].sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right),
html[data-theme="light"].sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu,
html[data-theme="dark"].sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right),
html[data-theme="dark"].sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu,
html[data-theme="light"] body.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right),
html[data-theme="light"] body.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu,
html[data-theme="dark"] body.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right),
html[data-theme="dark"] body.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
  background: var(--app-sidebar) !important;
  color: var(--app-sidebar-text) !important;
  border-color: var(--app-border) !important;
}

html[data-theme="light"] .box,
html[data-theme="light"] .panel,
html[data-theme="light"] .nav-tabs-custom,
html[data-theme="light"] .info-box,
html[data-theme="light"] .small-box,
html[data-theme="light"] .modal-content,
html[data-theme="light"] .dropdown-menu,
html[data-theme="light"] .theme-dropdown,
html[data-theme="light"] .select2-container .select2-selection,
html[data-theme="dark"] .box,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .nav-tabs-custom,
html[data-theme="dark"] .info-box,
html[data-theme="dark"] .small-box,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .theme-dropdown,
html[data-theme="dark"] .select2-container .select2-selection {
  background: var(--app-surface) !important;
  border-color: var(--app-border) !important;
  color: var(--app-text) !important;
}

html[data-theme="light"] .box,
html[data-theme="light"] .panel,
html[data-theme="light"] .modal-content,
html[data-theme="light"] .nav-tabs-custom,
html[data-theme="dark"] .box,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .nav-tabs-custom {
  box-shadow: var(--app-card-shadow);
}

html[data-theme="light"] .box-header,
html[data-theme="light"] .panel-heading,
html[data-theme="light"] .modal-header,
html[data-theme="light"] .box-footer,
html[data-theme="light"] .panel-footer,
html[data-theme="dark"] .box-header,
html[data-theme="dark"] .panel-heading,
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .box-footer,
html[data-theme="dark"] .panel-footer,
html[data-theme="dark"] .modal-footer {
  background: var(--app-surface-2) !important;
  border-color: var(--app-border) !important;
  color: var(--app-text) !important;
}

html[data-theme="light"] body h1,
html[data-theme="light"] .content-wrapper h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] h4,
html[data-theme="light"] h5,
html[data-theme="light"] label,
html[data-theme="light"] .control-label,
html[data-theme="light"] .box-title,
html[data-theme="dark"] body h1,
html[data-theme="dark"] .content-wrapper 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"] label,
html[data-theme="dark"] .control-label,
html[data-theme="dark"] .box-title {
  color: var(--app-text) !important;
}

html[data-theme="light"] p,
html[data-theme="light"] .help-block,
html[data-theme="light"] .text-muted,
html[data-theme="light"] .description-block > .description-text,
html[data-theme="light"] .breadcrumb,
html[data-theme="light"] .breadcrumb a,
html[data-theme="dark"] p,
html[data-theme="dark"] .help-block,
html[data-theme="dark"] .text-muted,
html[data-theme="dark"] .description-block > .description-text,
html[data-theme="dark"] .breadcrumb,
html[data-theme="dark"] .breadcrumb a {
  color: var(--app-muted) !important;
}

html[data-theme="light"] .dropdown-menu > li > a,
html[data-theme="light"] .dropdown-menu > li > button,
html[data-theme="light"] .user-menu .user-footer,
html[data-theme="dark"] .dropdown-menu > li > a,
html[data-theme="dark"] .dropdown-menu > li > button,
html[data-theme="dark"] .user-menu .user-footer {
  color: var(--app-text) !important;
  background: var(--app-surface) !important;
}

html[data-theme="light"] .dropdown-menu > li > a:hover,
html[data-theme="light"] .dropdown-menu > li > a:focus,
html[data-theme="dark"] .dropdown-menu > li > a:hover,
html[data-theme="dark"] .dropdown-menu > li > a:focus {
  color: var(--app-text) !important;
  background: var(--app-surface-2) !important;
}

html[data-theme="light"] .form-control,
html[data-theme="light"] .form-select,
html[data-theme="light"] select,
html[data-theme="light"] textarea,
html[data-theme="light"] input[type="text"],
html[data-theme="light"] input[type="number"],
html[data-theme="light"] input[type="date"],
html[data-theme="light"] input[type="email"],
html[data-theme="light"] input[type="password"],
html[data-theme="light"] input[type="search"],
html[data-theme="light"] input[type="file"],
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="number"],
html[data-theme="dark"] input[type="date"],
html[data-theme="dark"] input[type="email"],
html[data-theme="dark"] input[type="password"],
html[data-theme="dark"] input[type="search"],
html[data-theme="dark"] input[type="file"] {
  background-color: var(--app-input-bg) !important;
  border-color: var(--app-border) !important;
  color: var(--app-input-text) !important;
}

html[data-theme="light"] .form-control:focus,
html[data-theme="light"] select:focus,
html[data-theme="light"] textarea:focus,
html[data-theme="light"] input:focus,
html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] select:focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] input:focus {
  border-color: var(--app-primary) !important;
  box-shadow: 0 0 0 3px var(--app-focus-ring) !important;
  outline: none;
}

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

html[data-theme="light"] .table > thead > tr > th,
html[data-theme="light"] table.dataTable thead th,
html[data-theme="light"] table.dataTable thead td,
html[data-theme="dark"] .table > thead > tr > th,
html[data-theme="dark"] table.dataTable thead th,
html[data-theme="dark"] table.dataTable thead td {
  background: var(--app-table-head) !important;
  border-color: var(--app-border) !important;
  color: var(--app-text) !important;
}

html[data-theme="light"] .table > tbody > tr > td,
html[data-theme="light"] .table > tbody > tr > th,
html[data-theme="light"] table.dataTable tbody td,
html[data-theme="dark"] .table > tbody > tr > td,
html[data-theme="dark"] .table > tbody > tr > th,
html[data-theme="dark"] table.dataTable tbody td {
  border-color: var(--app-border) !important;
  color: var(--app-text) !important;
}

html[data-theme="light"] .table-striped > tbody > tr:nth-of-type(odd),
html[data-theme="light"] table.dataTable.stripe tbody tr.odd,
html[data-theme="light"] table.dataTable.display tbody tr.odd,
html[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd),
html[data-theme="dark"] table.dataTable.stripe tbody tr.odd,
html[data-theme="dark"] table.dataTable.display tbody tr.odd {
  background-color: var(--app-surface-2) !important;
}

html[data-theme="light"] .table-hover > tbody > tr:hover,
html[data-theme="light"] table.dataTable.hover tbody tr:hover,
html[data-theme="light"] table.dataTable.display tbody tr:hover,
html[data-theme="dark"] .table-hover > tbody > tr:hover,
html[data-theme="dark"] table.dataTable.hover tbody tr:hover,
html[data-theme="dark"] table.dataTable.display tbody tr:hover {
  background-color: var(--app-table-hover) !important;
}

html[data-theme="light"] .pagination > li > a,
html[data-theme="light"] .pagination > li > span,
html[data-theme="light"] .dataTables_wrapper .dataTables_paginate .paginate_button,
html[data-theme="dark"] .pagination > li > a,
html[data-theme="dark"] .pagination > li > span,
html[data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button {
  background: var(--app-surface) !important;
  border-color: var(--app-border) !important;
  color: var(--app-text) !important;
}

html[data-theme="light"] .pagination > .active > a,
html[data-theme="light"] .dataTables_wrapper .dataTables_paginate .paginate_button.current,
html[data-theme="dark"] .pagination > .active > a,
html[data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current {
  background: var(--app-primary) !important;
  border-color: var(--app-primary) !important;
  color: #ffffff !important;
}

html[data-theme="light"] .btn-primary,
html[data-theme="light"] .btn-info,
html[data-theme="light"] .btn.btn-primary,
html[data-theme="light"] button[type="submit"].btn,
html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .btn-info,
html[data-theme="dark"] .btn.btn-primary,
html[data-theme="dark"] button[type="submit"].btn {
  background-color: var(--app-primary) !important;
  border-color: var(--app-primary) !important;
  color: #ffffff !important;
}

html[data-theme="light"] .btn-primary:hover,
html[data-theme="light"] .btn-info:hover,
html[data-theme="light"] .btn.btn-primary:hover,
html[data-theme="light"] button[type="submit"].btn:hover,
html[data-theme="dark"] .btn-primary:hover,
html[data-theme="dark"] .btn-info:hover,
html[data-theme="dark"] .btn.btn-primary:hover,
html[data-theme="dark"] button[type="submit"].btn:hover {
  background-color: var(--app-primary-hover) !important;
  border-color: var(--app-primary-hover) !important;
}

html[data-theme="light"] .alert,
html[data-theme="light"] .callout,
html[data-theme="dark"] .alert,
html[data-theme="dark"] .callout {
  border-color: var(--app-border) !important;
  box-shadow: none;
}

.theme-menu {
  position: relative;
}

.theme-toggle {
  display: inline-flex !important;
  align-items: center;
  gap: 7px;
  min-height: 50px;
}

.theme-toggle-icon {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.16);
}

html[data-theme="light"] .theme-toggle-icon {
  background: rgba(15, 23, 42, 0.08);
}

.theme-dropdown {
  width: 270px;
  padding: 8px !important;
  border-radius: 12px !important;
  border: 1px solid var(--app-border) !important;
  box-shadow: var(--app-shadow) !important;
  right: 0;
  left: auto !important;
}

.theme-dropdown .dropdown-header {
  color: var(--app-muted);
  padding: 8px 10px;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.04em;
}

.theme-option {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--app-text);
  text-align: left;
  transition: background-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.theme-option:hover,
.theme-option:focus {
  background: var(--app-surface-2);
  color: var(--app-text);
  outline: 2px solid transparent;
}

.theme-option.is-active {
  background: var(--app-active-bg);
  color: var(--app-text);
}

.theme-option-icon {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #ffffff;
}

.theme-option-light {
  background: #f59e0b;
}

.theme-option-dark {
  background: #111827;
}

.theme-option-custom {
  background: var(--app-primary);
}

.theme-option strong,
.theme-option small {
  display: block;
  line-height: 1.25;
}

.theme-option small {
  color: var(--app-muted);
  font-size: 12px;
  margin-top: 2px;
}

html[data-theme="light"] ::placeholder,
html[data-theme="dark"] ::placeholder {
  color: var(--app-input-placeholder) !important;
  opacity: 1;
}

html[data-theme="light"] .form-control[disabled],
html[data-theme="light"] .form-control[readonly],
html[data-theme="light"] fieldset[disabled] .form-control,
html[data-theme="light"] select[disabled],
html[data-theme="light"] input[disabled],
html[data-theme="dark"] .form-control[disabled],
html[data-theme="dark"] .form-control[readonly],
html[data-theme="dark"] fieldset[disabled] .form-control,
html[data-theme="dark"] select[disabled],
html[data-theme="dark"] input[disabled] {
  background-color: var(--app-disabled-bg) !important;
  color: var(--app-disabled-text) !important;
  opacity: 1;
}

html[data-theme="light"] .card,
html[data-theme="light"] .card-body,
html[data-theme="light"] .person-card,
html[data-theme="light"] .persona-title,
html[data-theme="light"] .doc-card,
html[data-theme="light"] .oficio-panel,
html[data-theme="light"] .receipt-paper,
html[data-theme="light"] .cashbook-panel,
html[data-theme="light"] .cashbook-table-panel,
html[data-theme="light"] .finance-v2-card,
html[data-theme="light"] .finance-v2-sidebar,
html[data-theme="light"] .finance-v2-main,
html[data-theme="light"] .notary-card,
html[data-theme="light"] .notary-table-card,
html[data-theme="light"] .expedientes-card,
html[data-theme="dark"] .card,
html[data-theme="dark"] .card-body,
html[data-theme="dark"] .person-card,
html[data-theme="dark"] .persona-title,
html[data-theme="dark"] .doc-card,
html[data-theme="dark"] .oficio-panel,
html[data-theme="dark"] .receipt-paper,
html[data-theme="dark"] .cashbook-panel,
html[data-theme="dark"] .cashbook-table-panel,
html[data-theme="dark"] .finance-v2-card,
html[data-theme="dark"] .finance-v2-sidebar,
html[data-theme="dark"] .finance-v2-main,
html[data-theme="dark"] .notary-card,
html[data-theme="dark"] .notary-table-card,
html[data-theme="dark"] .expedientes-card {
  background: var(--app-surface) !important;
  border-color: var(--app-border) !important;
  color: var(--app-text) !important;
}

html[data-theme="light"] .card-header,
html[data-theme="light"] .person-header,
html[data-theme="light"] .doc-header,
html[data-theme="light"] .cashbook-panel-header,
html[data-theme="light"] .finance-v2-section-header,
html[data-theme="light"] .notary-table-card .card-header,
html[data-theme="dark"] .card-header,
html[data-theme="dark"] .person-header,
html[data-theme="dark"] .doc-header,
html[data-theme="dark"] .cashbook-panel-header,
html[data-theme="dark"] .finance-v2-section-header,
html[data-theme="dark"] .notary-table-card .card-header {
  background: var(--app-surface-2) !important;
  border-color: var(--app-border) !important;
  color: var(--app-text) !important;
}

html[data-theme="light"] .card-header *,
html[data-theme="light"] .box-header *,
html[data-theme="light"] .panel-heading *,
html[data-theme="light"] .modal-header:not(.bg-primary):not(.bg-info):not(.bg-success):not(.bg-warning):not(.bg-danger):not(.bg-blue) *,
html[data-theme="dark"] .card-header *,
html[data-theme="dark"] .box-header *,
html[data-theme="dark"] .panel-heading *,
html[data-theme="dark"] .modal-header:not(.bg-primary):not(.bg-info):not(.bg-success):not(.bg-warning):not(.bg-danger):not(.bg-blue) * {
  color: var(--app-text) !important;
}

html[data-theme="light"] .modal-header.bg-primary,
html[data-theme="light"] .modal-header.bg-blue,
html[data-theme="dark"] .modal-header.bg-primary,
html[data-theme="dark"] .modal-header.bg-blue {
  background: var(--app-primary) !important;
  color: #ffffff !important;
}

html[data-theme="light"] .modal-header.bg-success,
html[data-theme="dark"] .modal-header.bg-success {
  background: var(--app-success-solid) !important;
  color: #ffffff !important;
}

html[data-theme="light"] .modal-header.bg-warning,
html[data-theme="dark"] .modal-header.bg-warning {
  background: var(--app-warning-solid) !important;
  color: #ffffff !important;
}

html[data-theme="light"] .modal-header.bg-danger,
html[data-theme="dark"] .modal-header.bg-danger {
  background: var(--app-danger-solid) !important;
  color: #ffffff !important;
}

html[data-theme="light"] .modal-header.bg-info,
html[data-theme="dark"] .modal-header.bg-info {
  background: var(--app-info-solid) !important;
  color: #ffffff !important;
}

html[data-theme="light"] .modal-header.bg-primary *,
html[data-theme="light"] .modal-header.bg-info *,
html[data-theme="light"] .modal-header.bg-success *,
html[data-theme="light"] .modal-header.bg-warning *,
html[data-theme="light"] .modal-header.bg-danger *,
html[data-theme="light"] .modal-header.bg-blue *,
html[data-theme="dark"] .modal-header.bg-primary *,
html[data-theme="dark"] .modal-header.bg-info *,
html[data-theme="dark"] .modal-header.bg-success *,
html[data-theme="dark"] .modal-header.bg-warning *,
html[data-theme="dark"] .modal-header.bg-danger *,
html[data-theme="dark"] .modal-header.bg-blue * {
  color: #ffffff !important;
}

html[data-theme="light"] .small-box,
html[data-theme="light"] .info-box,
html[data-theme="dark"] .small-box,
html[data-theme="dark"] .info-box {
  background: var(--app-surface) !important;
  border: 1px solid var(--app-border) !important;
  color: var(--app-text) !important;
}

html[data-theme="light"] .small-box *,
html[data-theme="light"] .info-box *,
html[data-theme="dark"] .small-box *,
html[data-theme="dark"] .info-box * {
  color: inherit !important;
}

html[data-theme="light"] .small-box.bg-green,
html[data-theme="dark"] .small-box.bg-green {
  background: var(--app-success-bg) !important;
  color: var(--app-success-text) !important;
}

html[data-theme="light"] .small-box.bg-red,
html[data-theme="dark"] .small-box.bg-red {
  background: var(--app-danger-bg) !important;
  color: var(--app-danger-text) !important;
}

html[data-theme="light"] .small-box.bg-yellow,
html[data-theme="dark"] .small-box.bg-yellow {
  background: var(--app-warning-bg) !important;
  color: var(--app-warning-text) !important;
}

html[data-theme="light"] .small-box.bg-aqua,
html[data-theme="light"] .small-box.bg-teal,
html[data-theme="light"] .small-box.bg-blue,
html[data-theme="dark"] .small-box.bg-aqua,
html[data-theme="dark"] .small-box.bg-teal,
html[data-theme="dark"] .small-box.bg-blue {
  background: var(--app-info-bg) !important;
  color: var(--app-info-text) !important;
}

html[data-theme="light"] .small-box .small-box-footer,
html[data-theme="dark"] .small-box .small-box-footer {
  background: rgba(0, 0, 0, 0.08) !important;
  color: inherit !important;
}

html[data-theme="light"] .label,
html[data-theme="light"] .badge,
html[data-theme="dark"] .label,
html[data-theme="dark"] .badge {
  border: 1px solid transparent;
  font-weight: 700;
}

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

html[data-theme="light"] .label-success,
html[data-theme="light"] .badge-success,
html[data-theme="dark"] .label-success,
html[data-theme="dark"] .badge-success {
  background: var(--app-success-bg) !important;
  color: var(--app-success-text) !important;
}

html[data-theme="light"] .label-warning,
html[data-theme="light"] .badge-warning,
html[data-theme="dark"] .label-warning,
html[data-theme="dark"] .badge-warning {
  background: var(--app-warning-bg) !important;
  color: var(--app-warning-text) !important;
}

html[data-theme="light"] .label-danger,
html[data-theme="light"] .badge-danger,
html[data-theme="dark"] .label-danger,
html[data-theme="dark"] .badge-danger {
  background: var(--app-danger-bg) !important;
  color: var(--app-danger-text) !important;
}

html[data-theme="light"] .label-info,
html[data-theme="light"] .badge-info,
html[data-theme="dark"] .label-info,
html[data-theme="dark"] .badge-info {
  background: var(--app-info-bg) !important;
  color: var(--app-info-text) !important;
}

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

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

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

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

html[data-theme="light"] .dataTables_wrapper,
html[data-theme="light"] .dataTables_wrapper .dataTables_length,
html[data-theme="light"] .dataTables_wrapper .dataTables_filter,
html[data-theme="light"] .dataTables_wrapper .dataTables_info,
html[data-theme="dark"] .dataTables_wrapper,
html[data-theme="dark"] .dataTables_wrapper .dataTables_length,
html[data-theme="dark"] .dataTables_wrapper .dataTables_filter,
html[data-theme="dark"] .dataTables_wrapper .dataTables_info {
  color: var(--app-text) !important;
}

html[data-theme="light"] .dataTables_wrapper .dataTables_length select,
html[data-theme="light"] .dataTables_wrapper .dataTables_filter input,
html[data-theme="dark"] .dataTables_wrapper .dataTables_length select,
html[data-theme="dark"] .dataTables_wrapper .dataTables_filter input {
  background: var(--app-input-bg) !important;
  border: 1px solid var(--app-border) !important;
  color: var(--app-input-text) !important;
}

html[data-theme="light"] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
html[data-theme="light"] .pagination > .disabled > a,
html[data-theme="light"] .pagination > .disabled > span,
html[data-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
html[data-theme="dark"] .pagination > .disabled > a,
html[data-theme="dark"] .pagination > .disabled > span {
  background: var(--app-disabled-bg) !important;
  color: var(--app-disabled-text) !important;
  border-color: var(--app-border) !important;
}

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

html[data-theme="light"] .tooltip.top .tooltip-arrow,
html[data-theme="dark"] .tooltip.top .tooltip-arrow {
  border-top-color: var(--app-text) !important;
}

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

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

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

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

@media (max-width: 767px) {
  .theme-dropdown {
    position: absolute !important;
    right: 0 !important;
    left: auto !important;
    width: min(270px, calc(100vw - 24px));
  }

  .theme-toggle {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}

/* Final theme overrides: keep custom untouched and fully replace AdminLTE colors in light/dark. */
html[data-theme="light"] body .wrapper .main-header .navbar,
html[data-theme="light"] body .wrapper .main-header .logo,
html[data-theme="light"] body .wrapper .main-header .user-header {
  background: var(--app-header) !important;
  color: var(--app-text) !important;
}

html[data-theme="dark"] body .wrapper .main-header .navbar,
html[data-theme="dark"] body .wrapper .main-header .logo,
html[data-theme="dark"] body .wrapper .main-header .user-header {
  background: var(--app-header) !important;
  color: var(--app-text) !important;
}

html[data-theme="light"] body .wrapper .main-header .navbar .sidebar-toggle,
html[data-theme="light"] body .wrapper .main-header .navbar .nav > li > a,
html[data-theme="light"] body .wrapper .main-header .logo,
html[data-theme="light"] body .wrapper .main-header .logo:hover,
html[data-theme="light"] body .wrapper .main-header .user-header p,
html[data-theme="light"] body .wrapper .main-header .user-header small {
  color: var(--app-text) !important;
}

html[data-theme="dark"] body .wrapper .main-header .navbar .sidebar-toggle,
html[data-theme="dark"] body .wrapper .main-header .navbar .nav > li > a,
html[data-theme="dark"] body .wrapper .main-header .logo,
html[data-theme="dark"] body .wrapper .main-header .logo:hover,
html[data-theme="dark"] body .wrapper .main-header .user-header p,
html[data-theme="dark"] body .wrapper .main-header .user-header small {
  color: var(--app-text) !important;
}

html[data-theme="light"] body .wrapper .main-header .navbar .nav > li > a:hover,
html[data-theme="light"] body .wrapper .main-header .navbar .nav > li > a:focus,
html[data-theme="light"] body .wrapper .main-header .navbar .nav > li.open > a,
html[data-theme="light"] body .wrapper .main-header .navbar .nav > li.open > a:hover,
html[data-theme="light"] body .wrapper .main-header .navbar .nav > li.open > a:focus,
html[data-theme="dark"] body .wrapper .main-header .navbar .nav > li > a:hover,
html[data-theme="dark"] body .wrapper .main-header .navbar .nav > li > a:focus,
html[data-theme="dark"] body .wrapper .main-header .navbar .nav > li.open > a,
html[data-theme="dark"] body .wrapper .main-header .navbar .nav > li.open > a:hover,
html[data-theme="dark"] body .wrapper .main-header .navbar .nav > li.open > a:focus {
  background: var(--app-surface-2) !important;
  color: var(--app-text) !important;
}

html[data-theme="light"] body .wrapper .main-sidebar,
html[data-theme="light"] body .wrapper .left-side,
html[data-theme="light"] body .wrapper .sidebar,
html[data-theme="light"] body .wrapper .sidebar-menu,
html[data-theme="light"] body .wrapper .treeview-menu,
html[data-theme="light"] body.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right),
html[data-theme="light"] body.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
  background: var(--app-sidebar) !important;
  color: var(--app-sidebar-text) !important;
}

html[data-theme="dark"] body .wrapper .main-sidebar,
html[data-theme="dark"] body .wrapper .left-side,
html[data-theme="dark"] body .wrapper .sidebar,
html[data-theme="dark"] body .wrapper .sidebar-menu,
html[data-theme="dark"] body .wrapper .treeview-menu,
html[data-theme="dark"] body.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right),
html[data-theme="dark"] body.sidebar-mini.sidebar-collapse .sidebar-menu > li:hover > .treeview-menu {
  background: var(--app-sidebar) !important;
  color: var(--app-sidebar-text) !important;
}

html[data-theme="light"] body .wrapper .sidebar-menu > li > a,
html[data-theme="light"] body .wrapper .sidebar-menu > li > a > i,
html[data-theme="light"] body .wrapper .sidebar-menu > li > a > span,
html[data-theme="light"] body .wrapper .treeview-menu > li > a,
html[data-theme="light"] body .wrapper .treeview-menu > li > a > i,
html[data-theme="light"] body .wrapper .treeview-menu > li > a > span {
  color: var(--app-sidebar-text) !important;
}

html[data-theme="dark"] body .wrapper .sidebar-menu > li > a,
html[data-theme="dark"] body .wrapper .sidebar-menu > li > a > i,
html[data-theme="dark"] body .wrapper .sidebar-menu > li > a > span,
html[data-theme="dark"] body .wrapper .treeview-menu > li > a,
html[data-theme="dark"] body .wrapper .treeview-menu > li > a > i,
html[data-theme="dark"] body .wrapper .treeview-menu > li > a > span {
  color: var(--app-sidebar-text) !important;
}

html[data-theme="light"] body .wrapper .sidebar-menu > li:hover > a,
html[data-theme="light"] body .wrapper .sidebar-menu > li.active > a,
html[data-theme="light"] body .wrapper .sidebar-menu > li.menu-open > a,
html[data-theme="light"] body .wrapper .treeview-menu > li:hover > a,
html[data-theme="light"] body .wrapper .treeview-menu > li.active > a,
html[data-theme="dark"] body .wrapper .sidebar-menu > li:hover > a,
html[data-theme="dark"] body .wrapper .sidebar-menu > li.active > a,
html[data-theme="dark"] body .wrapper .sidebar-menu > li.menu-open > a,
html[data-theme="dark"] body .wrapper .treeview-menu > li:hover > a,
html[data-theme="dark"] body .wrapper .treeview-menu > li.active > a {
  background: var(--app-sidebar-active) !important;
  color: var(--app-sidebar-text) !important;
}

html[data-theme="light"] body .wrapper .sidebar-menu > li:hover > a *,
html[data-theme="light"] body .wrapper .sidebar-menu > li.active > a *,
html[data-theme="light"] body .wrapper .sidebar-menu > li.menu-open > a *,
html[data-theme="light"] body .wrapper .treeview-menu > li:hover > a *,
html[data-theme="light"] body .wrapper .treeview-menu > li.active > a *,
html[data-theme="dark"] body .wrapper .sidebar-menu > li:hover > a *,
html[data-theme="dark"] body .wrapper .sidebar-menu > li.active > a *,
html[data-theme="dark"] body .wrapper .sidebar-menu > li.menu-open > a *,
html[data-theme="dark"] body .wrapper .treeview-menu > li:hover > a *,
html[data-theme="dark"] body .wrapper .treeview-menu > li.active > a * {
  color: var(--app-sidebar-text) !important;
}

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

/* Visual refinement for light/dark themes only. */
html[data-theme="light"] body .wrapper .main-header .navbar,
html[data-theme="light"] body .wrapper .main-header .logo,
html[data-theme="dark"] body .wrapper .main-header .navbar,
html[data-theme="dark"] body .wrapper .main-header .logo {
  border-bottom: 1px solid var(--app-border) !important;
  box-shadow: var(--app-header-shadow) !important;
}

html[data-theme="light"] body .wrapper .main-sidebar,
html[data-theme="dark"] body .wrapper .main-sidebar {
  border-right: 1px solid var(--app-border) !important;
}

html[data-theme="light"] body .wrapper .sidebar-menu > li > a,
html[data-theme="light"] body .wrapper .treeview-menu > li > a,
html[data-theme="dark"] body .wrapper .sidebar-menu > li > a,
html[data-theme="dark"] body .wrapper .treeview-menu > li > a,
html[data-theme="custom"] body .wrapper .sidebar-menu > li > a,
html[data-theme="custom"] body .wrapper .treeview-menu > li > a {
  border-radius: 10px;
  margin: 3px 8px;
  font-size: 15px;
  transition: background-color 160ms ease, color 160ms ease, transform 160ms ease;
}

html[data-theme="light"] body .wrapper .sidebar-menu > li.active > a,
html[data-theme="light"] body .wrapper .treeview-menu > li.active > a,
html[data-theme="dark"] body .wrapper .sidebar-menu > li.active > a,
html[data-theme="dark"] body .wrapper .treeview-menu > li.active > a,
html[data-theme="custom"] body .wrapper .sidebar-menu > li.active > a,
html[data-theme="custom"] body .wrapper .treeview-menu > li.active > a {
  box-shadow: inset 3px 0 0 var(--app-primary);
}

html[data-theme="light"] body .wrapper .treeview-menu > li > a,
html[data-theme="dark"] body .wrapper .treeview-menu > li > a,
html[data-theme="custom"] body .wrapper .treeview-menu > li > a {
  font-size: 14px;
  padding: 10px 5px 10px 24px;
}

html[data-theme="light"] .box,
html[data-theme="light"] .panel,
html[data-theme="light"] .card,
html[data-theme="light"] .modal-content,
html[data-theme="light"] .nav-tabs-custom,
html[data-theme="light"] .person-card,
html[data-theme="light"] .persona-title,
html[data-theme="light"] .cashbook-panel,
html[data-theme="light"] .cashbook-table-panel,
html[data-theme="light"] .finance-v2-card,
html[data-theme="light"] .notary-card,
html[data-theme="dark"] .box,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .card,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .nav-tabs-custom,
html[data-theme="dark"] .person-card,
html[data-theme="dark"] .persona-title,
html[data-theme="dark"] .cashbook-panel,
html[data-theme="dark"] .cashbook-table-panel,
html[data-theme="dark"] .finance-v2-card,
html[data-theme="dark"] .notary-card {
  border: 1px solid var(--app-border) !important;
  border-radius: 12px !important;
  box-shadow: var(--app-card-shadow) !important;
}

html[data-theme="light"] .box:hover,
html[data-theme="light"] .panel:hover,
html[data-theme="light"] .card:hover,
html[data-theme="light"] .cashbook-panel:hover,
html[data-theme="light"] .finance-v2-card:hover,
html[data-theme="dark"] .box:hover,
html[data-theme="dark"] .panel:hover,
html[data-theme="dark"] .card:hover,
html[data-theme="dark"] .cashbook-panel:hover,
html[data-theme="dark"] .finance-v2-card:hover {
  box-shadow: var(--app-elevated-shadow) !important;
}

html[data-theme="light"] .box-header,
html[data-theme="light"] .panel-heading,
html[data-theme="light"] .card-header,
html[data-theme="dark"] .box-header,
html[data-theme="dark"] .panel-heading,
html[data-theme="dark"] .card-header {
  background: linear-gradient(180deg, var(--app-surface) 0%, var(--app-surface-2) 100%) !important;
}

html[data-theme="light"] .table-responsive,
html[data-theme="light"] .ledger-table-wrap,
html[data-theme="light"] .finance-v2-table-wrap,
html[data-theme="light"] .cashbook-table-panel .table-responsive,
html[data-theme="dark"] .table-responsive,
html[data-theme="dark"] .ledger-table-wrap,
html[data-theme="dark"] .finance-v2-table-wrap,
html[data-theme="dark"] .cashbook-table-panel .table-responsive {
  background: var(--app-surface) !important;
  border-color: var(--app-border) !important;
}

html[data-theme="light"] table tbody tr,
html[data-theme="light"] .table tbody tr,
html[data-theme="light"] table.dataTable tbody tr,
html[data-theme="dark"] table tbody tr,
html[data-theme="dark"] .table tbody tr,
html[data-theme="dark"] table.dataTable tbody tr {
  background: var(--app-table-row) !important;
}

html[data-theme="light"] table tbody tr:nth-child(even),
html[data-theme="light"] .table tbody tr:nth-child(even),
html[data-theme="light"] table.dataTable tbody tr.even,
html[data-theme="dark"] table tbody tr:nth-child(even),
html[data-theme="dark"] .table tbody tr:nth-child(even),
html[data-theme="dark"] table.dataTable tbody tr.even {
  background: var(--app-table-row-alt) !important;
}

html[data-theme="light"] table thead th,
html[data-theme="light"] .table thead th,
html[data-theme="light"] table.dataTable thead th,
html[data-theme="dark"] table thead th,
html[data-theme="dark"] .table thead th,
html[data-theme="dark"] table.dataTable thead th {
  border-bottom: 1px solid var(--app-border) !important;
  box-shadow: inset 0 -1px 0 var(--app-border);
  font-weight: 700;
}

html[data-theme="light"] .form-control,
html[data-theme="light"] select,
html[data-theme="light"] textarea,
html[data-theme="dark"] .form-control,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
}

html[data-theme="dark"] .form-control,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.22);
}

html[data-theme="light"] .btn-primary,
html[data-theme="light"] .btn-info,
html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .btn-info {
  box-shadow: 0 8px 18px rgba(44, 62, 80, 0.16);
}

html[data-theme="dark"] .label,
html[data-theme="dark"] .badge {
  filter: saturate(0.92);
}

/* Header-only contrast fixes: theme selector and user menu. */
html[data-theme="light"] {
  --header-dropdown-bg: #ffffff;
  --header-dropdown-bg-soft: #f1f5f9;
  --header-dropdown-active: #e7eef7;
  --header-dropdown-text: #111827;
  --header-dropdown-muted: #64748b;
  --header-dropdown-border: #d8e1ec;
}

html[data-theme="dark"] {
  --header-dropdown-bg: #25262a;
  --header-dropdown-bg-soft: #303136;
  --header-dropdown-active: #383a40;
  --header-dropdown-text: #f3f4f6;
  --header-dropdown-muted: #b4b7be;
  --header-dropdown-border: #3a3c42;
}

html[data-theme="custom"] {
  --header-dropdown-bg: #ffffff;
  --header-dropdown-bg-soft: #f1f5f9;
  --header-dropdown-active: #e8eef5;
  --header-dropdown-text: #111827;
  --header-dropdown-muted: #64748b;
  --header-dropdown-border: #dbe3ec;
}

html[data-theme] body .wrapper .main-header .theme-menu > .theme-toggle,
html[data-theme] body .wrapper .main-header .user-menu > .dropdown-toggle {
  color: var(--header-dropdown-text, #111827) !important;
}

html[data-theme="custom"] body .wrapper .main-header .theme-menu > .theme-toggle,
html[data-theme="custom"] body .wrapper .main-header .user-menu > .dropdown-toggle {
  color: #ffffff !important;
}

html[data-theme="custom"] body .wrapper .main-header .theme-menu.open > .theme-toggle,
html[data-theme="custom"] body .wrapper .main-header .theme-menu > .theme-toggle:hover,
html[data-theme="custom"] body .wrapper .main-header .user-menu.open > .dropdown-toggle,
html[data-theme="custom"] body .wrapper .main-header .user-menu > .dropdown-toggle:hover {
  background: rgba(255, 255, 255, 0.14) !important;
  color: #ffffff !important;
}

html[data-theme] body .wrapper .main-header .theme-dropdown,
html[data-theme] body .wrapper .main-header .user-menu > .dropdown-menu {
  background: var(--header-dropdown-bg) !important;
  border: 1px solid var(--header-dropdown-border) !important;
  color: var(--header-dropdown-text) !important;
}

html[data-theme] body .wrapper .main-header .theme-dropdown .dropdown-header {
  background: transparent !important;
  color: var(--header-dropdown-muted) !important;
}

html[data-theme] body .wrapper .main-header .theme-option {
  background: transparent !important;
  color: var(--header-dropdown-text) !important;
}

html[data-theme] body .wrapper .main-header .theme-option strong,
html[data-theme] body .wrapper .main-header .theme-option span,
html[data-theme] body .wrapper .main-header .theme-option i {
  color: inherit !important;
}

html[data-theme] body .wrapper .main-header .theme-option small {
  color: var(--header-dropdown-muted) !important;
}

html[data-theme] body .wrapper .main-header .theme-option:hover,
html[data-theme] body .wrapper .main-header .theme-option:focus {
  background: var(--header-dropdown-bg-soft) !important;
  color: var(--header-dropdown-text) !important;
}

html[data-theme] body .wrapper .main-header .theme-option.is-active {
  background: var(--header-dropdown-active) !important;
  color: var(--header-dropdown-text) !important;
}

html[data-theme] body .wrapper .main-header .theme-option.is-active small {
  color: var(--header-dropdown-muted) !important;
}

html[data-theme] body .wrapper .main-header .theme-option-icon,
html[data-theme] body .wrapper .main-header .theme-option-icon i {
  color: #ffffff !important;
}

html[data-theme] body .wrapper .main-header .theme-toggle-icon {
  color: inherit !important;
}

html[data-theme="light"] body .wrapper .main-header .theme-toggle-icon {
  background: #e8eef5 !important;
  color: #2c3e50 !important;
}

html[data-theme="dark"] body .wrapper .main-header .theme-toggle-icon {
  background: #383a40 !important;
  color: #f3f4f6 !important;
}

html[data-theme="custom"] body .wrapper .main-header .theme-toggle-icon {
  background: rgba(255, 255, 255, 0.18) !important;
  color: #ffffff !important;
}

html[data-theme="light"] body .wrapper .main-header .user-menu .user-header,
html[data-theme="dark"] body .wrapper .main-header .user-menu .user-header {
  background: var(--header-dropdown-bg-soft) !important;
  color: var(--header-dropdown-text) !important;
}

html[data-theme="light"] body .wrapper .main-header .user-menu .user-header p,
html[data-theme="light"] body .wrapper .main-header .user-menu .user-header small,
html[data-theme="dark"] body .wrapper .main-header .user-menu .user-header p,
html[data-theme="dark"] body .wrapper .main-header .user-menu .user-header small {
  color: var(--header-dropdown-text) !important;
}

html[data-theme="light"] body .wrapper .main-header .user-menu .user-header small,
html[data-theme="dark"] body .wrapper .main-header .user-menu .user-header small {
  opacity: 0.78;
}

html[data-theme="light"] body .wrapper .main-header .user-menu .user-footer,
html[data-theme="dark"] body .wrapper .main-header .user-menu .user-footer {
  background: var(--header-dropdown-bg) !important;
  border-top: 1px solid var(--header-dropdown-border) !important;
}

html[data-theme] body .wrapper .main-header .user-menu .user-footer .btn {
  color: #ffffff !important;
}

html[data-theme] body .wrapper .main-header .user-menu .user-footer .btn-primary {
  background: #2c3e50 !important;
  border-color: #2c3e50 !important;
}

html[data-theme] body .wrapper .main-header .user-menu .user-footer .btn-danger {
  background: #b91c1c !important;
  border-color: #b91c1c !important;
}

/* Navigation text size — balanced for readability */
html[data-theme] body .wrapper .sidebar-menu > li > a {
  font-size: 13.5px;
  padding: 11px 8px 11px 16px;
}

html[data-theme] body .wrapper .treeview-menu > li > a {
  font-size: 12.5px;
  padding: 9px 5px 9px 28px;
}

html[data-theme] body .wrapper .sidebar-menu > li > a > i {
  font-size: 15px;
  width: 20px;
}

html[data-theme] body .wrapper .main-header .navbar .nav > li > a {
  font-size: 14px;
}