/**
 * CallDrive theme for CallHub
 * Brandkit tokens + Dark/Light modes via html[data-theme]
 */
:root {
  --cd-cyan: #00c9f6;
  --cd-blue: #008cf8;
  --cd-purple: #c209fa;
  --cd-lavender: #c680e4;
  --cd-royal: #645be9;
  --cd-success: #10b981;
  --cd-radius: 12px;
  --cd-radius-sm: 8px;
  --cd-gradient: linear-gradient(90deg, #00c9f6 0%, #c209fa 100%);
  --cd-gradient-soft: linear-gradient(135deg, rgba(0, 201, 246, 0.2), rgba(194, 9, 250, 0.2));
}

/* Shared layout chrome sizing */
body.cd-theme,
body.m-page--fluid {
  font-family: Roboto, "Helvetica Neue", Arial, sans-serif !important;
}

.m-brand {
  min-width: 320px;
  height: 78px !important;
}

.m-header {
  height: 78px !important;
}

.m-brand__logo.w-75 {
  width: 90% !important;
}

.m-brand__logo-wrapper img.cd-brand-logo {
  max-height: 72px;
  height: 72px;
  width: auto;
  max-width: 320px;
  object-fit: contain;
}

.cd-brand-logo--light { display: none !important; }
.cd-brand-logo--dark { display: inline-block !important; }

/* Brand/logo area stays dark in both themes (matches sidebar) */
.m-brand,
.m-brand--skin-dark {
  background-color: #040404 !important;
}

html[data-theme="light"] .m-brand,
html[data-theme="light"] .m-brand--skin-dark {
  background-color: #040404 !important;
  border-bottom-color: rgba(255, 255, 255, 0.06) !important;
}

html[data-theme="light"] .cd-brand-logo--dark,
html[data-theme="light"] .cd-brand-logo {
  display: inline-block !important;
}

html[data-theme="light"] .cd-brand-logo--light {
  display: none !important;
}

html[data-theme="light"] .m-brand__toggler span,
html[data-theme="light"] .m-brand__toggler span::before,
html[data-theme="light"] .m-brand__toggler span::after {
  background-color: #a0a0b0 !important;
}

.cd-footer-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  gap: 1rem;
  flex-wrap: wrap;
}

.cd-footer-product {
  color: var(--cd-cyan) !important;
  font-weight: 600;
}

.btn-primary,
.m-btn--custom.btn-primary,
.btn.btn-brand {
  background: var(--cd-gradient) !important;
  border: none !important;
  color: #fff !important;
  border-radius: var(--cd-radius-sm) !important;
  box-shadow: none !important;
}

.btn-primary:hover,
.btn-primary:focus {
  filter: brightness(1.08);
  color: #fff !important;
}

.m-scroll-top {
  background: var(--cd-gradient) !important;
}

.m-datatable__pager-link--active,
.dataTables_paginate .paginate_button.current,
.page-item.active .page-link {
  background: var(--cd-blue) !important;
  border-color: var(--cd-blue) !important;
  color: #fff !important;
}

.alert {
  border-radius: var(--cd-radius-sm);
}

/* Shared CallDrive dashboard components (both themes) */
.cd-card {
  background: var(--cd-surface, #151521);
  border: 1px solid var(--cd-border, rgba(255, 255, 255, 0.08));
  border-radius: var(--cd-radius);
  padding: 1.25rem 1.5rem;
  color: var(--cd-text, #fff);
  height: 100%;
  position: relative;
  overflow: hidden;
}

.cd-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 2px;
  background: var(--cd-gradient);
  opacity: 0.9;
  z-index: 1;
}

.cd-card__label {
  color: var(--cd-text-muted, #a0a0b0);
  font-size: 0.85rem;
  font-weight: 500;
  margin-bottom: 0.35rem;
}

.cd-card__value {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--cd-text, #fff);
  line-height: 1.2;
}

.cd-card__trend {
  color: var(--cd-success);
  font-size: 0.85rem;
  font-weight: 600;
}

.cd-filter-bar {
  background: var(--cd-surface, #151521);
  border: 1px solid var(--cd-border, rgba(255, 255, 255, 0.08));
  border-radius: var(--cd-radius);
  padding: 1.25rem;
  margin-bottom: 1.25rem;
}

.cd-page-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--cd-text, #fff);
  margin-bottom: 0.25rem;
}

.cd-page-subtitle {
  color: var(--cd-text-muted, #a0a0b0);
  font-size: 0.9rem;
  margin-bottom: 1.25rem;
}

.cd-auth-links a {
  color: var(--cd-cyan) !important;
  text-decoration: none;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 0.8rem;
  padding: 0 0.75rem;
}

.cd-auth-links a:hover {
  color: var(--cd-lavender) !important;
}

.cd-auth-logo {
  max-width: 280px;
  width: 80%;
  height: auto;
  margin-bottom: 1.5rem;
}



.cd-theme-mode .m-dropdown__inner {
  background: var(--cd-surface, #151521) !important;
  border: 1px solid var(--cd-border, rgba(255,255,255,.08)) !important;
  border-radius: 12px !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45) !important;
  padding: 0.4rem !important;
  min-width: 160px;
  overflow: hidden;
}

html[data-theme="light"] .cd-theme-mode .m-dropdown__inner {
  background: #ffffff !important;
  border: 1px solid rgba(15, 15, 25, 0.1) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
}

/* Avoid double Metronic body/content boxes on this menu */
.cd-theme-mode .m-dropdown__body,
.cd-theme-mode .m-dropdown__content {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

.cd-theme-menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

.cd-theme-menu__link {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0.55rem 0.75rem;
  border-radius: 8px;
  color: var(--cd-text-muted, #a0a0b0);
  text-decoration: none !important;
  font-size: 0.9rem;
  font-weight: 500;
}

.cd-theme-menu__link > i:first-child {
  font-size: 1.05rem;
  width: 1.2rem;
  text-align: center;
}

.cd-theme-menu__link:hover {
  background: rgba(0, 201, 246, 0.12);
  color: var(--cd-cyan, #00c9f6);
}

.cd-theme-menu__item.is-active .cd-theme-menu__link {
  color: var(--cd-text, #fff);
}

html[data-theme="light"] .cd-theme-menu__item.is-active .cd-theme-menu__link {
  color: #1b1b28;
}

.cd-theme-check {
  margin-left: auto;
  opacity: 0;
  color: var(--cd-cyan, #00c9f6);
  font-size: 0.95rem;
}

.cd-theme-menu__item.is-active .cd-theme-check {
  opacity: 1;
}


/* ========== DARK (Brandkit) ========== */
html[data-theme="dark"] {
  --cd-bg: #040404;
  --cd-bg-elevated: #0b0b10;
  --cd-surface: #151521;
  --cd-surface-2: #1a1a24;
  --cd-border: rgba(255, 255, 255, 0.08);
  --cd-text: #ffffff;
  --cd-text-muted: #a0a0b0;
}
/* Base shell */
html[data-theme="dark"] body.m-page--fluid,
html[data-theme="dark"] body.cd-theme {
  background-color: var(--cd-bg) !important;
  color: var(--cd-text);
  font-family: Roboto, "Helvetica Neue", Arial, sans-serif !important;
}

html[data-theme="dark"] body.m-content--skin-light2 {
  /* keep class for Metronic JS; force dark content */
}

html[data-theme="dark"] .m-body,
html[data-theme="dark"] .m-wrapper,
html[data-theme="dark"] .m-content,
html[data-theme="dark"] #vueRoot {
  background-color: var(--cd-bg-elevated) !important;
  color: var(--cd-text);
}

/* Header / brand */
html[data-theme="dark"] .m-header,
html[data-theme="dark"] #m_header {
  background-color: var(--cd-bg) !important;
  border-bottom: 1px solid var(--cd-border);
  box-shadow: none !important;
}

html[data-theme="dark"] .m-brand,
html[data-theme="dark"] .m-brand--skin-dark {
  background-color: var(--cd-bg) !important;
}

html[data-theme="dark"] .m-brand {
  min-width: 320px;
  height: 78px !important;
}

html[data-theme="dark"] .m-header {
  height: 78px !important;
}

html[data-theme="dark"] .m-brand__logo.w-75 {
  width: 90% !important;
}

html[data-theme="dark"] .m-brand__logo-wrapper img.cd-brand-logo {
  max-height: 72px;
  height: 72px;
  width: auto;
  max-width: 320px;
  object-fit: contain;
}

html[data-theme="dark"] .m-brand__toggler span,
html[data-theme="dark"] .m-brand__toggler span::before,
html[data-theme="dark"] .m-brand__toggler span::after {
  background-color: var(--cd-text-muted) !important;
}

html[data-theme="dark"] .m-header-menu.m-header-menu--skin-light,
html[data-theme="dark"] .m-header-menu .m-menu__nav > .m-menu__item > .m-menu__link .m-menu__link-text {
  color: var(--cd-text-muted) !important;
}

html[data-theme="dark"] .m-header-menu .m-menu__nav > .m-menu__item:hover > .m-menu__link .m-menu__link-text,
html[data-theme="dark"] .m-header-menu .m-menu__nav > .m-menu__item.m-menu__item--active > .m-menu__link .m-menu__link-text {
  color: var(--cd-text) !important;
}

html[data-theme="dark"] .m-topbar .m-topbar__nav-wrapper .m-topbar__nav .m-nav__item .m-nav__link .m-nav__link-icon {
  color: var(--cd-text-muted) !important;
}

/* Sidebar */
html[data-theme="dark"] .m-aside-left,
html[data-theme="dark"] .m-aside-left--skin-dark,
html[data-theme="dark"] #m_aside_left {
  background-color: var(--cd-bg) !important;
  border-right: 1px solid var(--cd-border);
}

html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item > .m-menu__link .m-menu__link-text,
html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item > .m-menu__link .m-menu__link-icon {
  color: var(--cd-text-muted) !important;
}

html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item:hover > .m-menu__link,
html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item.m-menu__item--active > .m-menu__link {
  background: var(--cd-gradient-soft) !important;
  border-radius: var(--cd-radius-sm);
}

html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item.m-menu__item--active > .m-menu__link .m-menu__link-text,
html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item.m-menu__item--active > .m-menu__link .m-menu__link-icon,
html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item:hover > .m-menu__link .m-menu__link-text,
html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__nav > .m-menu__item:hover > .m-menu__link .m-menu__link-icon {
  color: var(--cd-cyan) !important;
}

html[data-theme="dark"] .m-aside-menu .m-menu__section .m-menu__section-text {
  color: var(--cd-text-muted) !important;
  opacity: 0.7;
  letter-spacing: 0.06em;
}

/* Footer */
html[data-theme="dark"] .m-footer {
  background-color: var(--cd-bg) !important;
  border-top: 1px solid var(--cd-border) !important;
  color: var(--cd-text-muted) !important;
}

html[data-theme="dark"] .m-footer__copyright,
html[data-theme="dark"] .m-footer__copyright b {
  color: var(--cd-text-muted) !important;
  font-weight: 500;
}

html[data-theme="dark"] .cd-footer-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  gap: 1rem;
  flex-wrap: wrap;
}

html[data-theme="dark"] .cd-footer-product {
  color: var(--cd-cyan) !important;
  font-weight: 600;
}

/* Cards / portlets / content surfaces */
html[data-theme="dark"] .m-portlet,
html[data-theme="dark"] .card,
html[data-theme="dark"] .m-portlet.m-portlet--bordered-semi,
html[data-theme="dark"] .m-portlet .m-portlet__head,
html[data-theme="dark"] .m-portlet .m-portlet__body {
  background-color: var(--cd-surface) !important;
  color: var(--cd-text) !important;
  border-color: var(--cd-border) !important;
  border-radius: var(--cd-radius) !important;
  box-shadow: none !important;
}



/* Metronic KPI widgets (broker/buyer/vendor dashboards) */
html[data-theme="dark"] .m-widget29,
html[data-theme="dark"] .m-widget29 .m-widget_content,
html[data-theme="dark"] .m-portlet .m-portlet__body--no-padding,
html[data-theme="dark"] .m-portlet.m-portlet--full-height {
  background-color: var(--cd-surface, #151521) !important;
  color: var(--cd-text, #fff) !important;
}

html[data-theme="dark"] .m-widget29 .m-widget_content-title,
html[data-theme="dark"] .m-widget29 .m-widget_content-items,
html[data-theme="dark"] .m-widget29 .m-widget_content-item,
html[data-theme="dark"] .m-widget29 h1,
html[data-theme="dark"] .m-widget29 h2,
html[data-theme="dark"] .m-widget29 h3,
html[data-theme="dark"] .m-widget29 span {
  color: var(--cd-text-muted, #a0a0b0) !important;
}

html[data-theme="dark"] .m-widget29 .m--font-accent,
html[data-theme="dark"] .m-widget29 .m--font-accent h1,
html[data-theme="dark"] .m-widget29 .m--font-accent h2 {
  color: var(--cd-cyan, #00c9f6) !important;
}

html[data-theme="dark"] .m-row--col-separator-xl > div,
html[data-theme="dark"] .m-row--col-separator-lg > div,
html[data-theme="dark"] .m-row--col-separator-md > div,
html[data-theme="dark"] [class*="m-row--col-separator"] > div {
  border-color: var(--cd-border, rgba(255,255,255,.08)) !important;
}

html[data-theme="dark"] .m-separator,
html[data-theme="dark"] .m-separator--dashed {
  border-bottom-color: var(--cd-border, rgba(255,255,255,.08)) !important;
}

html[data-theme="dark"] .m-portlet .m-portlet__head .m-portlet__head-text,
html[data-theme="dark"] .m-portlet .m-portlet__head-caption .m-portlet__head-title .m-portlet__head-text,
html[data-theme="dark"] .card-title,
html[data-theme="dark"] label,
html[data-theme="dark"] .form-label,
html[data-theme="dark"] .m-form .form-control-label {
  color: var(--cd-text) !important;
}

html[data-theme="dark"] .m-subheader .m-subheader__title,
html[data-theme="dark"] .m-subheader__breadcrumbs-link,
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: var(--cd-text) !important;
}

/* Forms */
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .bootstrap-select .dropdown-toggle,
html[data-theme="dark"] .select2-container--default .select2-selection--single,
html[data-theme="dark"] .select2-container--default .select2-selection--multiple,
html[data-theme="dark"] .m-input {
  background-color: var(--cd-surface-2) !important;
  border: 1px solid var(--cd-border) !important;
  color: var(--cd-text) !important;
  border-radius: var(--cd-radius-sm) !important;
}

html[data-theme="dark"] .form-control:focus {
  border-color: var(--cd-cyan) !important;
  box-shadow: 0 0 0 0.15rem rgba(0, 201, 246, 0.25) !important;
}

html[data-theme="dark"] .form-control::placeholder {
  color: var(--cd-text-muted) !important;
}

/* Buttons */
html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .m-btn--custom.btn-primary,
html[data-theme="dark"] .btn.btn-brand {
  background: var(--cd-gradient) !important;
  border: none !important;
  color: #fff !important;
  border-radius: var(--cd-radius-sm) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .btn-primary:hover,
html[data-theme="dark"] .btn-primary:focus {
  filter: brightness(1.08);
  color: #fff !important;
}

html[data-theme="dark"] .btn-secondary,
html[data-theme="dark"] .btn-outline-metal,
html[data-theme="dark"] .m-btn--custom.btn-secondary {
  background-color: var(--cd-surface-2) !important;
  border: 1px solid var(--cd-border) !important;
  color: var(--cd-text) !important;
  border-radius: var(--cd-radius-sm) !important;
}

/* Tables */
html[data-theme="dark"] .table,
html[data-theme="dark"] .m-table,
html[data-theme="dark"] .dataTables_wrapper,
html[data-theme="dark"] .table thead th,
html[data-theme="dark"] .table td,
html[data-theme="dark"] .table th {
  color: var(--cd-text-muted) !important;
  border-color: var(--cd-border) !important;
}

html[data-theme="dark"] .table thead th {
  background-color: var(--cd-surface-2) !important;
  color: var(--cd-text) !important;
}

/* Base row bg — DataTables CDN sets #fff on tbody tr (loads after theme) */
html[data-theme="dark"] .table tbody tr,
html[data-theme="dark"] table.dataTable tbody tr,
html[data-theme="dark"] table.dataTable tbody tr.even,
html[data-theme="dark"] table.dataTable.stripe tbody tr.even,
html[data-theme="dark"] table.dataTable.display tbody tr.even {
  background-color: var(--cd-surface, #151521) !important;
}

html[data-theme="dark"] .table-striped tbody tr:nth-of-type(odd),
html[data-theme="dark"] table.dataTable tbody tr.odd,
html[data-theme="dark"] table.dataTable.stripe tbody tr.odd,
html[data-theme="dark"] table.dataTable.display tbody tr.odd {
  background-color: rgba(255, 255, 255, 0.04) !important;
}

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: rgba(0, 201, 246, 0.08) !important;
}

/* DataTables order-column paints td.sorting_* with #fafafa — neutralize in dark */
html[data-theme="dark"] table.dataTable tbody tr > td,
html[data-theme="dark"] table.dataTable tbody tr > th,
html[data-theme="dark"] table.dataTable.display tbody tr > .sorting_1,
html[data-theme="dark"] table.dataTable.display tbody tr > .sorting_2,
html[data-theme="dark"] table.dataTable.display tbody tr > .sorting_3,
html[data-theme="dark"] table.dataTable.order-column tbody tr > .sorting_1,
html[data-theme="dark"] table.dataTable.order-column tbody tr > .sorting_2,
html[data-theme="dark"] table.dataTable.order-column tbody tr > .sorting_3,
html[data-theme="dark"] table.dataTable.display tbody tr.odd > .sorting_1,
html[data-theme="dark"] table.dataTable.display tbody tr.odd > .sorting_2,
html[data-theme="dark"] table.dataTable.display tbody tr.odd > .sorting_3,
html[data-theme="dark"] table.dataTable.display tbody tr.even > .sorting_1,
html[data-theme="dark"] table.dataTable.display tbody tr.even > .sorting_2,
html[data-theme="dark"] table.dataTable.display tbody tr.even > .sorting_3 {
  background-color: transparent !important;
}

/* Modals */
html[data-theme="dark"] .modal-content {
  background-color: var(--cd-surface) !important;
  color: var(--cd-text) !important;
  border: 1px solid var(--cd-border) !important;
  border-radius: var(--cd-radius) !important;
}

html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer {
  border-color: var(--cd-border) !important;
}

html[data-theme="dark"] .btn-close {
  filter: invert(1);
}

/* Scroll top */
html[data-theme="dark"] .m-scroll-top {
  background: var(--cd-gradient) !important;
}

/* Dropdowns */
html[data-theme="dark"] .dropdown-menu {
  background-color: var(--cd-surface) !important;
  border: 1px solid var(--cd-border) !important;
  color: var(--cd-text) !important;
}

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

html[data-theme="dark"] .dropdown-item:hover,
html[data-theme="dark"] .dropdown-item:focus {
  background-color: var(--cd-surface-2) !important;
  color: var(--cd-cyan) !important;
}

/* cd-card / filter / titles: shared above; dark uses tokens */


/* Auth / welcome — ALWAYS Brandkit dark (ignore light/dark toggle) */
.cd-auth-body,
html[data-theme="light"] .cd-auth-body,
html[data-theme="light"] body.cd-auth-body,
html[data-theme="dark"] .cd-auth-body {
  --cd-bg: #040404;
  --cd-bg-elevated: #0b0b10;
  --cd-surface: #151521;
  --cd-surface-2: #1a1a24;
  --cd-border: rgba(255, 255, 255, 0.08);
  --cd-text: #ffffff;
  --cd-text-muted: #a0a0b0;
  background:
    radial-gradient(ellipse at top, rgba(0, 201, 246, 0.12), transparent 50%),
    radial-gradient(ellipse at bottom right, rgba(194, 9, 250, 0.12), transparent 45%),
    #040404 !important;
  background-color: #040404 !important;
  color: #ffffff !important;
  min-height: 100vh;
  font-family: Roboto, "Helvetica Neue", Arial, sans-serif !important;
}

.cd-auth-panel,
html[data-theme="light"] .cd-auth-panel {
  background: #151521 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: var(--cd-radius);
  padding: 2rem;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.45);
  color: #ffffff !important;
}

.cd-auth-logo {
  max-width: 280px;
  width: 80%;
  height: auto;
  margin-bottom: 1.5rem;
}

.cd-auth-links a,
html[data-theme="light"] .cd-auth-links a {
  color: var(--cd-cyan, #00c9f6) !important;
  text-decoration: none;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-size: 0.8rem;
  padding: 0 0.75rem;
}

.cd-auth-links a:hover,
html[data-theme="light"] .cd-auth-links a:hover {
  color: var(--cd-lavender, #c680e4) !important;
}

.cd-auth-footer,
html[data-theme="light"] .cd-auth-footer {
  color: #a0a0b0 !important;
  font-size: 0.85rem;
}

/* Login Metronic shell */
.cd-auth-body .m-login,
.cd-auth-body .m-login-2--skin-2,
html[data-theme="light"] .cd-auth-body .m-login {
  background: #040404 !important;
  color: #ffffff !important;
}

.cd-auth-body .m-login .form-control,
.cd-auth-body .m-login .m-input,
html[data-theme="light"] .cd-auth-body .m-login .form-control {
  background-color: #151521 !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
}

.cd-auth-body .navbar,
.cd-auth-body .navbar-dark,
html[data-theme="light"] .cd-auth-body .navbar {
  background: #040404 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

.cd-auth-body .navbar .nav-link,
.cd-auth-body .navbar-brand,
html[data-theme="light"] .cd-auth-body .navbar .nav-link {
  color: #a0a0b0 !important;
}

/* Bootstrap / Metronic text helpers on dark */
html[data-theme="dark"] .text-dark,
html[data-theme="dark"] .text-black-50,
html[data-theme="dark"] .m--font-dark {
  color: var(--cd-text) !important;
}

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

html[data-theme="dark"] .alert {
  border-radius: var(--cd-radius-sm);
}

/* DataTables length/filter labels */
html[data-theme="dark"] .dataTables_wrapper .dataTables_length,
html[data-theme="dark"] .dataTables_wrapper .dataTables_filter,
html[data-theme="dark"] .dataTables_wrapper .dataTables_info,
html[data-theme="dark"] .dataTables_wrapper .dataTables_paginate {
  color: var(--cd-text-muted) !important;
}

/* Selectpicker dropdown */
html[data-theme="dark"] .bootstrap-select .dropdown-menu {
  background: var(--cd-surface) !important;
}

html[data-theme="dark"] .bootstrap-select .dropdown-menu li a {
  color: var(--cd-text-muted) !important;
}

html[data-theme="dark"] .bootstrap-select .dropdown-menu li a:hover,
html[data-theme="dark"] .bootstrap-select .dropdown-menu li.selected a {
  background: var(--cd-surface-2) !important;
  color: var(--cd-cyan) !important;
}

/* Topbar user / notification dropdowns — force dark */
html[data-theme="dark"] .m-topbar .m-dropdown__inner,
html[data-theme="dark"] .m-topbar .m-dropdown__body,
html[data-theme="dark"] .m-topbar .m-dropdown__content,
html[data-theme="dark"] .m-topbar__user-profile .m-dropdown__inner,
html[data-theme="dark"] .m-topbar__user-profile .m-dropdown__body {
  background-color: var(--cd-surface) !important;
  border: 1px solid var(--cd-border) !important;
  border-radius: var(--cd-radius) !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.55) !important;
  color: var(--cd-text) !important;
}

html[data-theme="dark"] .m-topbar .m-dropdown__header,
html[data-theme="dark"] .m-topbar__user-profile .m-dropdown__header {
  background: linear-gradient(135deg, #0b0b10 0%, #151521 55%, #1a1228 100%) !important;
  background-image: none !important;
  border-bottom: 1px solid var(--cd-border) !important;
  border-radius: var(--cd-radius) var(--cd-radius) 0 0 !important;
}

html[data-theme="dark"] .m-topbar .m-dropdown__arrow,
html[data-theme="dark"] .m-topbar .m-dropdown__arrow:before {
  color: var(--cd-surface) !important;
  background: var(--cd-surface) !important;
}

html[data-theme="dark"] .m-topbar .m-card-user__name,
html[data-theme="dark"] .m-topbar .m-dropdown__header-title {
  color: var(--cd-text) !important;
}

html[data-theme="dark"] .m-topbar .m-card-user__email,
html[data-theme="dark"] .m-topbar .m-dropdown__header-subtitle,
html[data-theme="dark"] .m-topbar .m-card-user__email.m-link {
  color: var(--cd-text-muted) !important;
}

html[data-theme="dark"] .m-topbar .m-nav .m-nav__link .m-nav__link-text,
html[data-theme="dark"] .m-topbar .m-nav .m-nav__link .m-nav__link-icon,
html[data-theme="dark"] .m-topbar .m-nav--skin-light .m-nav__link .m-nav__link-text,
html[data-theme="dark"] .m-topbar .m-nav--skin-dark .m-nav__link .m-nav__link-text {
  color: var(--cd-text-muted) !important;
}

html[data-theme="dark"] .m-topbar .m-nav .m-nav__item:hover > .m-nav__link .m-nav__link-text,
html[data-theme="dark"] .m-topbar .m-nav .m-nav__item:hover > .m-nav__link .m-nav__link-icon {
  color: var(--cd-cyan) !important;
}

html[data-theme="dark"] .m-topbar .m-nav__separator {
  border-bottom-color: var(--cd-border) !important;
}

html[data-theme="dark"] .m-topbar__user-profile .btn.btn-secondary,
html[data-theme="dark"] .m-topbar__user-profile .m-btn--label-brand {
  background: var(--cd-surface-2) !important;
  border: 1px solid var(--cd-border) !important;
  color: var(--cd-text) !important;
}

html[data-theme="dark"] .m-topbar__user-profile .btn.btn-secondary:hover {
  background: var(--cd-gradient) !important;
  border-color: transparent !important;
  color: #fff !important;
}

html[data-theme="dark"] .m-topbar__userpic img {
  border: 2px solid rgba(0, 201, 246, 0.35);
  background: var(--cd-surface-2);
}

/* Pagination active: brand blue instead of Metronic orange where possible */
html[data-theme="dark"] .m-datatable__pager-link--active,
html[data-theme="dark"] .dataTables_paginate .paginate_button.current,
html[data-theme="dark"] .page-item.active .page-link {
  background: var(--cd-blue) !important;
  border-color: var(--cd-blue) !important;
  color: #fff !important;
}


/* ========== LIGHT (Brandkit accents on Metronic-light surfaces) ========== */
html[data-theme="light"] {
  --cd-bg: #e4e6ed;
  --cd-bg-elevated: #e4e6ed;
  --cd-surface: #ffffff;
  --cd-surface-2: #f4f5f8;
  --cd-border: #c5cad6;
  --cd-text: #181c32;
  --cd-text-muted: #4b4f66;
  --cd-label: #3f4254;
}

html[data-theme="light"] body.cd-theme,
html[data-theme="light"] body.m-page--fluid {
  background-color: var(--cd-bg) !important;
  color: var(--cd-text);
}

html[data-theme="light"] .m-body,
html[data-theme="light"] .m-wrapper,
html[data-theme="light"] .m-content,
html[data-theme="light"] #vueRoot {
  background-color: var(--cd-bg-elevated) !important;
  color: var(--cd-text);
}

html[data-theme="light"] .m-header,
html[data-theme="light"] #m_header {
  background-color: #ffffff !important;
  border-bottom: 1px solid var(--cd-border);
  box-shadow: 0 1px 0 rgba(0,0,0,.04) !important;
}

/* Keep brand strip dark in light mode (do not whiten) */
html[data-theme="light"] .m-brand,
html[data-theme="light"] .m-brand--skin-dark {
  background-color: #040404 !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
  box-shadow: none !important;
}

html[data-theme="light"] .m-brand__toggler span,
html[data-theme="light"] .m-brand__toggler span::before,
html[data-theme="light"] .m-brand__toggler span::after {
  background-color: #a0a0b0 !important;
}

html[data-theme="light"] .m-header-menu .m-menu__nav > .m-menu__item > .m-menu__link .m-menu__link-text,
html[data-theme="light"] .m-topbar .m-topbar__nav-wrapper .m-topbar__nav .m-nav__item .m-nav__link .m-nav__link-icon {
  color: var(--cd-text-muted) !important;
}

html[data-theme="light"] .m-header-menu .m-menu__nav > .m-menu__item:hover > .m-menu__link .m-menu__link-text,
html[data-theme="light"] .m-header-menu .m-menu__nav > .m-menu__item.m-menu__item--active > .m-menu__link .m-menu__link-text {
  color: var(--cd-text) !important;
}

html[data-theme="light"] .m-aside-left,
html[data-theme="light"] .m-aside-left--skin-dark,
html[data-theme="light"] #m_aside_left {
  background-color: #040404 !important; /* match brand strip */
  border-right: 1px solid rgba(255,255,255,.06);
}

html[data-theme="light"] .m-footer {
  background-color: #ffffff !important;
  border-top: 1px solid var(--cd-border) !important;
  color: var(--cd-text-muted) !important;
}

html[data-theme="light"] .m-footer__copyright,
html[data-theme="light"] .m-footer__copyright b {
  color: var(--cd-text-muted) !important;
}

html[data-theme="light"] .m-portlet,
html[data-theme="light"] .card,
html[data-theme="light"] .m-portlet .m-portlet__head,
html[data-theme="light"] .m-portlet .m-portlet__body,
html[data-theme="light"] .cd-card,
html[data-theme="light"] .cd-filter-bar {
  background-color: var(--cd-surface) !important;
  color: var(--cd-text) !important;
  border: 1px solid var(--cd-border) !important;
  border-radius: var(--cd-radius) !important;
  box-shadow: 0 6px 22px rgba(24, 28, 50, 0.09) !important;
}

html[data-theme="light"] .m-portlet .m-portlet__head-text,
html[data-theme="light"] 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"] h6,
html[data-theme="light"] .cd-page-title,
html[data-theme="light"] .cd-card__value {
  color: var(--cd-text) !important;
}

html[data-theme="light"] .cd-page-subtitle,
html[data-theme="light"] .cd-card__label,
html[data-theme="light"] .text-muted {
  color: var(--cd-text-muted) !important;
}

html[data-theme="light"] label,
html[data-theme="light"] .form-label {
  color: var(--cd-label, #3f4254) !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .form-control,
html[data-theme="light"] .bootstrap-select .dropdown-toggle,
html[data-theme="light"] .m-input {
  background-color: #ffffff !important;
  border: 1px solid #b8bdc9 !important;
  color: var(--cd-text) !important;
}

html[data-theme="light"] .btn-secondary,
html[data-theme="light"] .m-btn--custom.btn-secondary {
  background-color: #f4f5f8 !important;
  border: 1px solid var(--cd-border) !important;
  color: var(--cd-text) !important;
}

html[data-theme="light"] .table,
html[data-theme="light"] .table thead th,
html[data-theme="light"] .table td,
html[data-theme="light"] .table th {
  color: var(--cd-text-muted) !important;
  border-color: var(--cd-border) !important;
}

html[data-theme="light"] .table thead th {
  background-color: #f4f5f8 !important;
  color: var(--cd-text) !important;
}

html[data-theme="light"] .table tbody tr,
html[data-theme="light"] table.dataTable tbody tr,
html[data-theme="light"] table.dataTable tbody tr.even {
  background-color: #ffffff !important;
}

html[data-theme="light"] .table-striped tbody tr:nth-of-type(odd),
html[data-theme="light"] table.dataTable tbody tr.odd,
html[data-theme="light"] table.dataTable.stripe tbody tr.odd,
html[data-theme="light"] table.dataTable.display tbody tr.odd {
  background-color: #f1f2f6 !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 {
  background-color: #eef3ff !important;
}

html[data-theme="light"] table.dataTable.display tbody tr > .sorting_1,
html[data-theme="light"] table.dataTable.display tbody tr > .sorting_2,
html[data-theme="light"] table.dataTable.display tbody tr > .sorting_3,
html[data-theme="light"] table.dataTable.display tbody tr.odd > .sorting_1,
html[data-theme="light"] table.dataTable.display tbody tr.even > .sorting_1 {
  background-color: transparent !important;
}

html[data-theme="light"] .modal-content {
  background-color: #ffffff !important;
  color: var(--cd-text) !important;
  border: 1px solid var(--cd-border) !important;
}

html[data-theme="light"] .btn-close {
  filter: none;
}

html[data-theme="light"] .dropdown-menu,
html[data-theme="light"] .bootstrap-select .dropdown-menu {
  background: #ffffff !important;
  border: 1px solid var(--cd-border) !important;
  color: var(--cd-text) !important;
}

html[data-theme="light"] .dropdown-item {
  color: var(--cd-text-muted) !important;
}

html[data-theme="light"] .dropdown-item:hover,
html[data-theme="light"] .dropdown-item:focus {
  background-color: #f4f5f8 !important;
  color: var(--cd-cyan) !important;
}

html[data-theme="light"] .m-topbar .m-dropdown__inner,
html[data-theme="light"] .m-topbar .m-dropdown__body,
html[data-theme="light"] .m-topbar .m-dropdown__content,
html[data-theme="light"] .m-topbar__user-profile .m-dropdown__inner,
html[data-theme="light"] .m-topbar__user-profile .m-dropdown__body {
  background-color: #ffffff !important;
  border: 1px solid var(--cd-border) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.12) !important;
  color: var(--cd-text) !important;
}

html[data-theme="light"] .m-topbar .m-dropdown__header,
html[data-theme="light"] .m-topbar__user-profile .m-dropdown__header {
  background: linear-gradient(135deg, #00c9f6 0%, #c209fa 100%) !important;
  border-bottom: none !important;
}

html[data-theme="light"] .m-topbar .m-card-user__name,
html[data-theme="light"] .m-topbar .m-card-user__email,
html[data-theme="light"] .m-topbar .m-card-user__email.m-link {
  color: #ffffff !important;
}

html[data-theme="light"] .m-topbar .m-nav .m-nav__link .m-nav__link-text,
html[data-theme="light"] .m-topbar .m-nav .m-nav__link .m-nav__link-icon {
  color: var(--cd-text-muted) !important;
}

html[data-theme="light"] .m-topbar .m-nav .m-nav__item:hover > .m-nav__link .m-nav__link-text,
html[data-theme="light"] .m-topbar .m-nav .m-nav__item:hover > .m-nav__link .m-nav__link-icon {
  color: var(--cd-cyan) !important;
}

html[data-theme="light"] .m-topbar__user-profile .btn.btn-secondary {
  background: #f4f5f8 !important;
  border: 1px solid var(--cd-border) !important;
  color: var(--cd-text) !important;
}

html[data-theme="light"] .m-topbar__userpic img {
  border: 2px solid rgba(0, 140, 248, 0.35);
  background: #f4f5f8;
}

/* Auth stays dark — light overrides removed */


html[data-theme="light"] .text-dark,
html[data-theme="light"] .m--font-dark {
  color: var(--cd-text) !important;
}

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="light"] .dataTables_wrapper .dataTables_paginate {
  color: var(--cd-text-muted) !important;
}

/* Theme dropdown: override generic topbar dropdown nesting */
html[data-theme="dark"] .cd-theme-mode .m-dropdown__inner,
html[data-theme="light"] .cd-theme-mode .m-dropdown__inner {
  padding: 0.4rem !important;
}

html[data-theme="dark"] .cd-theme-mode .m-dropdown__body,
html[data-theme="dark"] .cd-theme-mode .m-dropdown__content,
html[data-theme="light"] .cd-theme-mode .m-dropdown__body,
html[data-theme="light"] .cd-theme-mode .m-dropdown__content {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

html[data-theme="light"] .cd-theme-mode .m-nav__link-icon,
html[data-theme="light"] .cd-theme-mode #cd_theme_mode_icon {
  color: #6c7293 !important;
}

html[data-theme="dark"] .cd-theme-mode .m-dropdown__inner,
html[data-theme="light"] .cd-theme-mode .m-dropdown__inner {
  background-color: var(--cd-surface) !important;
  border: 1px solid var(--cd-border) !important;
  border-radius: 12px !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45) !important;
  padding: 0.4rem !important;
}

html[data-theme="light"] .cd-theme-mode .m-dropdown__inner {
  background-color: #ffffff !important;
}

html[data-theme="dark"] .cd-theme-mode .m-dropdown__body,
html[data-theme="dark"] .cd-theme-mode .m-dropdown__content,
html[data-theme="light"] .cd-theme-mode .m-dropdown__body,
html[data-theme="light"] .cd-theme-mode .m-dropdown__content {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

/* ========== LIGHT MODE: depth + contrast ========== */
html[data-theme="light"] {
  --cd-bg: #e4e6ed;
  --cd-bg-elevated: #e4e6ed;
  --cd-surface: #ffffff;
  --cd-surface-2: #f4f5f8;
  --cd-border: #c5cad6;
  --cd-text: #181c32;
  --cd-text-muted: #4b4f66;
  --cd-label: #3f4254;
}

/* Brand strip always dark + opaque over white header */
html[data-theme="light"] #m_header .m-brand,
html[data-theme="light"] .m-header .m-brand,
html[data-theme="light"] .m-stack__item.m-brand,
html[data-theme="light"] .m-brand.m-brand--skin-dark {
  background: #040404 !important;
  background-color: #040404 !important;
  background-image: none !important;
  z-index: 2;
}

html[data-theme="light"] .m-brand__logo-wrapper,
html[data-theme="light"] .m-brand__logo-wrapper img.cd-brand-logo {
  opacity: 1 !important;
  visibility: visible !important;
}

/* Surfaces: white cards on cooler gray canvas */
html[data-theme="light"] .m-portlet,
html[data-theme="light"] .card,
html[data-theme="light"] .m-portlet.m-portlet--bordered-semi,
html[data-theme="light"] .cd-card,
html[data-theme="light"] .cd-filter-bar {
  background-color: #ffffff !important;
  border: 1px solid #c5cad6 !important;
  border-radius: 12px !important;
  box-shadow: 0 6px 22px rgba(24, 28, 50, 0.09) !important;
}

html[data-theme="light"] .cd-card {
  padding: 1.25rem 1.5rem !important;
  position: relative !important;
  overflow: hidden !important;
  height: 100%;
  color: var(--cd-text) !important;
}

html[data-theme="light"] .cd-filter-bar {
  padding: 1.35rem 1.5rem !important;
  margin-bottom: 1.35rem !important;
}

html[data-theme="light"] .m-portlet .m-portlet__head {
  background-color: #ffffff !important;
  border-bottom: 1px solid #dde0e8 !important;
  border-radius: 12px 12px 0 0 !important;
}

html[data-theme="light"] .m-portlet .m-portlet__body {
  background-color: #ffffff !important;
  border-radius: 0 0 12px 12px !important;
}

/* Primary text */
html[data-theme="light"] .m-portlet .m-portlet__head-text,
html[data-theme="light"] .m-portlet__head-title .m-portlet__head-text,
html[data-theme="light"] .cd-page-title,
html[data-theme="light"] 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"] h6,
html[data-theme="light"] .cd-card__value,
html[data-theme="light"] .m-widget_content-title,
html[data-theme="light"] .m-widget29 .m-widget_content-title {
  color: #181c32 !important;
  font-weight: 700 !important;
}

html[data-theme="light"] .cd-page-title {
  font-size: 1.5rem !important;
  margin-bottom: 0.25rem !important;
}

/* Form labels: darker than muted (readable on white) */
html[data-theme="light"] label,
html[data-theme="light"] .form-label,
html[data-theme="light"] .m-form .form-control-label {
  color: #3f4254 !important;
  font-weight: 600 !important;
  font-size: 0.875rem !important;
}

/* Secondary / KPI captions */
html[data-theme="light"] .cd-page-subtitle,
html[data-theme="light"] .cd-card__label,
html[data-theme="light"] .text-muted,
html[data-theme="light"] .m-widget_content-items {
  color: #4b4f66 !important;
}

html[data-theme="light"] .cd-page-subtitle {
  margin-bottom: 1.25rem !important;
}

html[data-theme="light"] .cd-card__label {
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.01em;
}

html[data-theme="light"] .cd-card__value {
  font-size: 1.75rem !important;
  line-height: 1.2 !important;
}

/* Inputs: clearer edges */
html[data-theme="light"] .form-control,
html[data-theme="light"] .bootstrap-select .dropdown-toggle,
html[data-theme="light"] .bootstrap-select > .dropdown-toggle.btn-light,
html[data-theme="light"] .m-input,
html[data-theme="light"] select.form-control {
  background-color: #ffffff !important;
  border: 1px solid #b8bdc9 !important;
  color: #181c32 !important;
  box-shadow: none !important;
  min-height: 40px;
}

html[data-theme="light"] .form-control:focus,
html[data-theme="light"] .bootstrap-select .dropdown-toggle:focus {
  border-color: #008cf8 !important;
  box-shadow: 0 0 0 0.15rem rgba(0, 140, 248, 0.18) !important;
}

html[data-theme="light"] .form-control::placeholder {
  color: #7e8299 !important;
  opacity: 1;
}

html[data-theme="light"] .table thead th {
  background-color: #eef0f5 !important;
  color: #181c32 !important;
  border-bottom: 1px solid #c5cad6 !important;
  font-weight: 600 !important;
}

html[data-theme="light"] .table td,
html[data-theme="light"] .table th {
  color: #3f4254 !important;
  border-color: #dde0e8 !important;
}

html[data-theme="light"] .m-separator {
  border-bottom-color: #dde0e8 !important;
}

html[data-theme="light"] .m-subheader .m-subheader__title,
html[data-theme="light"] .m-subheader__breadcrumbs-link {
  color: #181c32 !important;
}

html[data-theme="light"] .m--font-accent,
html[data-theme="light"] .m--font-brand {
  color: #008cf8 !important;
}

/* Header menu text readable on white */
html[data-theme="light"] .m-header-menu .m-menu__link-text,
html[data-theme="light"] .m-header-menu .m-menu__link-icon {
  color: #5e6278 !important;
}


/* ========== Dark sidebar readable in BOTH themes ==========
   Body light color must NOT win via inheritance; force muted/cyan text. */
html[data-theme="light"] .m-aside-left,
html[data-theme="light"] .m-aside-left--skin-dark,
html[data-theme="light"] #m_aside_left,
html[data-theme="light"] .m-aside-menu.m-aside-menu--skin-dark,
html[data-theme="dark"] .m-aside-left,
html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark {
  color: #a2a3b7 !important;
}

html[data-theme="light"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__link-text,
html[data-theme="light"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__link-icon,
html[data-theme="light"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__link-icon:before,
html[data-theme="light"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__ver-arrow,
html[data-theme="light"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__link-bullet > span,
html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__link-text,
html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__link-icon,
html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__link-icon:before,
html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__ver-arrow,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__link-text,
.m-aside-menu.m-aside-menu--skin-dark .m-menu__link-icon {
  color: #a2a3b7 !important;
}

html[data-theme="light"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__item:hover > .m-menu__link .m-menu__link-text,
html[data-theme="light"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__item:hover > .m-menu__link .m-menu__link-icon,
html[data-theme="light"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__item.m-menu__item--active > .m-menu__link .m-menu__link-text,
html[data-theme="light"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__item.m-menu__item--active > .m-menu__link .m-menu__link-icon,
html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__item:hover > .m-menu__link .m-menu__link-text,
html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__item:hover > .m-menu__link .m-menu__link-icon,
html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__item.m-menu__item--active > .m-menu__link .m-menu__link-text,
html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__item.m-menu__item--active > .m-menu__link .m-menu__link-icon {
  color: #00c9f6 !important;
}

html[data-theme="light"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__item:hover > .m-menu__link,
html[data-theme="light"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__item.m-menu__item--active > .m-menu__link,
html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__item:hover > .m-menu__link,
html[data-theme="dark"] .m-aside-menu.m-aside-menu--skin-dark .m-menu__item.m-menu__item--active > .m-menu__link {
  background: linear-gradient(135deg, rgba(0, 201, 246, 0.2), rgba(194, 9, 250, 0.2)) !important;
  border-radius: 8px;
}

.m-aside-menu .m-menu__section .m-menu__section-text {
  color: #6c7293 !important;
}

/* Theme toggle: stay in Metronic horizontal topbar row (table/table-cell), do not restyle siblings */
.m-topbar .m-topbar__nav.m-nav > .m-nav__item.cd-theme-mode {
  height: 100%;
}

.m-topbar .m-topbar__nav.m-nav > .m-nav__item.cd-theme-mode > .m-nav__link {
  display: table !important;
  table-layout: fixed;
  height: 100%;
  width: auto;
  padding: 0 !important;
  margin: 0 auto;
}

.m-topbar .m-topbar__nav.m-nav > .m-nav__item.cd-theme-mode > .m-nav__link .m-nav__link-icon {
  display: table-cell !important;
  height: 100%;
  vertical-align: middle !important;
  line-height: 0 !important;
  padding: 0 !important;
  width: auto;
}

.m-topbar .m-topbar__nav.m-nav > .m-nav__item.cd-theme-mode #cd_theme_mode_icon {
  font-size: 1.4rem !important;
  line-height: 0 !important;
  vertical-align: middle;
}

/* Stripe-hosted Add Funds action shared by tenant-admin and buyer headers. */
.cd-add-credit-item {
  display: flex !important;
  align-items: center;
  height: 78px;
  padding: 0 0.75rem;
}

.cd-add-credit-form {
  margin: 0;
}

.cd-add-credit-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  min-width: 118px;
  min-height: 38px;
  padding: 0.55rem 1rem !important;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
}

.cd-add-credit-button i {
  font-size: 1.15rem;
  line-height: 1;
}

@media (max-width: 1200px) {
  .cd-add-credit-item {
    padding: 0 0.4rem;
  }

  .cd-add-credit-button {
    min-width: 108px;
    padding-right: 0.75rem !important;
    padding-left: 0.75rem !important;
  }
}