/**
 * SpotPro UI theme presets — recolor member + platform admin shell.
 * Activated by html[data-sp-theme="{id}"] (see spotpro_ui_themes.php).
 * classic = no attribute / default Skote (this file is no-op for classic).
 * v=20260804c-soft-primary-icons
*/

html[data-sp-theme] {
  /* Shared hooks used by optional overrides */
  --sp-theme-primary: var(--bs-primary);
  --sp-theme-primary-rgb: var(--bs-primary-rgb);
}

/* ── navy ── */
html[data-sp-theme="navy"] {
  --bs-primary: #1e4d8c;
  --bs-primary-rgb: 30, 77, 140;
  --bs-link-color: #1e4d8c;
  --bs-link-hover-color: #163a6b;
  --sp-theme-primary: #1e4d8c;
  --sp-theme-primary-hover: #163a6b;
  --sp-theme-primary-soft: rgba(30, 77, 140, 0.12);
  --sp-theme-accent: #3b82f6;
  --sp-theme-on-primary: #ffffff;
  --sp-theme-canvas: #f4f6fa;
  --sp-theme-card: #ffffff;
  --sp-theme-text: #1a2332;
  --sp-theme-muted: #5c6b7a;
  --sp-theme-border: #e2e8f0;
  --sp-theme-sidebar: #0f2744;
  --sp-theme-sidebar-text: #c5d0de;
}
html[data-sp-theme="navy"][data-layout-mode="dark"] {
  --sp-theme-canvas: #0b1220;
  --sp-theme-card: #121a2b;
  --sp-theme-text: #e8eef6;
  --sp-theme-muted: #94a3b8;
  --sp-theme-border: #1e2a3d;
  --sp-theme-sidebar: #0a1628;
  --sp-theme-sidebar-text: #b8c5d6;
  /* Light primary for text on dark cards (light-mode #1e4d8c is unreadable) */
  --sp-theme-primary-text: #7eb6ff;
}

/* Surfaces */
html[data-sp-theme="navy"] body,
html[data-sp-theme="navy"] body #layout-wrapper,
html[data-sp-theme="navy"] body .main-content,
html[data-sp-theme="navy"] body .page-content {
  background-color: var(--sp-theme-canvas) !important;
  color: var(--sp-theme-text);
}
html[data-sp-theme="navy"] body .card,
html[data-sp-theme="navy"] body .card-header,
html[data-sp-theme="navy"] body .dropdown-menu,
html[data-sp-theme="navy"] body .modal-content,
html[data-sp-theme="navy"] body .offcanvas,
html[data-sp-theme="navy"] body .right-bar {
  background-color: var(--sp-theme-card) !important;
  color: var(--sp-theme-text);
  border-color: var(--sp-theme-border);
}
html[data-sp-theme="navy"] body .card {
  border: 1px solid var(--sp-theme-border);
}
html[data-sp-theme="navy"] body .text-muted {
  color: var(--sp-theme-muted) !important;
}
html[data-sp-theme="navy"] body .border,
html[data-sp-theme="navy"] body .border-top,
html[data-sp-theme="navy"] body .border-bottom,
html[data-sp-theme="navy"] body hr {
  border-color: var(--sp-theme-border) !important;
}

/* Sidebar rail */
html[data-sp-theme="navy"] body .vertical-menu,
html[data-sp-theme="navy"] body[data-sidebar="dark"] .vertical-menu {
  background: var(--sp-theme-sidebar) !important;
  border-right-color: var(--sp-theme-border) !important;
}
html[data-sp-theme="navy"] body[data-sidebar="dark"] .navbar-brand-box {
  background: var(--sp-theme-sidebar) !important;
  border-right-color: var(--sp-theme-border) !important;
}
html[data-sp-theme="navy"] body #sidebar-menu ul li a,
html[data-sp-theme="navy"] body #sidebar-menu .metismenu > li > a:not(.active) {
  color: var(--sp-theme-sidebar-text);
}
html[data-sp-theme="navy"] body #sidebar-menu ul li a i,
html[data-sp-theme="navy"] body #sidebar-menu .metismenu > li > a:not(.active) i {
  color: var(--sp-theme-sidebar-text);
  opacity: 0.85;
}
html[data-sp-theme="navy"] body #sidebar-menu ul li a:hover,
html[data-sp-theme="navy"] body #sidebar-menu ul li a:hover i,
html[data-sp-theme="navy"] body #sidebar-menu .metismenu > li > a:not(.active):hover,
html[data-sp-theme="navy"] body #sidebar-menu .metismenu > li > a:not(.active):hover i {
  color: #ffffff !important;
  opacity: 1;
}
html[data-sp-theme="navy"] body #sidebar-menu .mm-active > a,
html[data-sp-theme="navy"] body #sidebar-menu .mm-active > a i,
html[data-sp-theme="navy"] body #sidebar-menu .mm-active .active,
html[data-sp-theme="navy"] body #sidebar-menu .mm-active .active i,
html[data-sp-theme="navy"] body #sidebar-menu a.active,
html[data-sp-theme="navy"] body #sidebar-menu a.active i {
  color: #ffffff !important;
}
html[data-sp-theme="navy"] body #sidebar-menu .sidebar-nav-submenu .sidebar-nav-section-links > li > a.active,
html[data-sp-theme="navy"] body #sidebar-menu ul.sub-menu.sidebar-nav-submenu li > a.active {
  background: rgba(var(--bs-primary-rgb), 0.22) !important;
  color: #ffffff !important;
}

/* Primary actions & badges */
html[data-sp-theme="navy"] .btn-primary {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="navy"] .btn-primary:hover,
html[data-sp-theme="navy"] .btn-primary:focus,
html[data-sp-theme="navy"] .btn-primary:active,
html[data-sp-theme="navy"] .btn-primary.active {
  background-color: var(--sp-theme-primary-hover) !important;
  border-color: var(--sp-theme-primary-hover) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="navy"] .btn-outline-primary {
  color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="navy"] .btn-outline-primary:hover,
html[data-sp-theme="navy"] .btn-outline-primary:focus,
html[data-sp-theme="navy"] .btn-outline-primary:active {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="navy"] .bg-primary:not(.bg-soft),
html[data-sp-theme="navy"] .badge.bg-primary:not(.bg-soft) {
  background-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="navy"] .text-primary,
html[data-sp-theme="navy"] a.text-primary {
  color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="navy"] .border-primary {
  border-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="navy"] .page-link {
  color: var(--sp-theme-primary);
}
html[data-sp-theme="navy"] .page-item.active .page-link {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="navy"] .form-check-input:checked {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="navy"] .form-control:focus,
html[data-sp-theme="navy"] .form-select:focus {
  border-color: var(--sp-theme-primary) !important;
  box-shadow: 0 0 0 0.15rem rgba(var(--bs-primary-rgb), 0.2) !important;
}
html[data-sp-theme="navy"] .nav-pills .nav-link.active,
html[data-sp-theme="navy"] .nav-tabs .nav-link.active {
  color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="navy"] .progress-bar {
  background-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="navy"] .avatar-title.bg-primary:not(.bg-soft):not(.bg-soft-primary) {
  background-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="navy"] .bg-soft-primary,
html[data-sp-theme="navy"] .badge-soft-primary {
  background-color: var(--sp-theme-primary-soft) !important;
  color: var(--sp-theme-primary) !important;
}

/* Topbar subtle blend on dark themes */
html[data-sp-theme="navy"][data-layout-mode="dark"] #page-topbar {
  background-color: var(--sp-theme-card) !important;
  border-bottom: 1px solid var(--sp-theme-border);
}
html[data-sp-theme="navy"][data-layout-mode="dark"] .footer {
  background-color: var(--sp-theme-card) !important;
  color: var(--sp-theme-muted);
  border-top: 1px solid var(--sp-theme-border);
}

/* ── gold ── */
html[data-sp-theme="gold"] {
  --bs-primary: #b8860b;
  --bs-primary-rgb: 184, 134, 11;
  --bs-link-color: #b8860b;
  --bs-link-hover-color: #9a7209;
  --sp-theme-primary: #b8860b;
  --sp-theme-primary-hover: #9a7209;
  --sp-theme-primary-soft: rgba(184, 134, 11, 0.14);
  --sp-theme-accent: #d4af37;
  --sp-theme-on-primary: #1c1917;
  --sp-theme-canvas: #f7f5f0;
  --sp-theme-card: #fffcf7;
  --sp-theme-text: #1c1917;
  --sp-theme-muted: #78716c;
  --sp-theme-border: #e7e0d4;
  --sp-theme-sidebar: #1c1917;
  --sp-theme-sidebar-text: #d6d3d1;
}
html[data-sp-theme="gold"][data-layout-mode="dark"] {
  --sp-theme-canvas: #14110d;
  --sp-theme-card: #1c1814;
  --sp-theme-text: #f5f0e6;
  --sp-theme-muted: #a8a29e;
  --sp-theme-border: #2d2721;
  --sp-theme-sidebar: #0f0d0b;
  --sp-theme-sidebar-text: #d6d3d1;
  --sp-theme-primary-text: #e8c547;
}

/* Surfaces */
html[data-sp-theme="gold"] body,
html[data-sp-theme="gold"] body #layout-wrapper,
html[data-sp-theme="gold"] body .main-content,
html[data-sp-theme="gold"] body .page-content {
  background-color: var(--sp-theme-canvas) !important;
  color: var(--sp-theme-text);
}
html[data-sp-theme="gold"] body .card,
html[data-sp-theme="gold"] body .card-header,
html[data-sp-theme="gold"] body .dropdown-menu,
html[data-sp-theme="gold"] body .modal-content,
html[data-sp-theme="gold"] body .offcanvas,
html[data-sp-theme="gold"] body .right-bar {
  background-color: var(--sp-theme-card) !important;
  color: var(--sp-theme-text);
  border-color: var(--sp-theme-border);
}
html[data-sp-theme="gold"] body .card {
  border: 1px solid var(--sp-theme-border);
}
html[data-sp-theme="gold"] body .text-muted {
  color: var(--sp-theme-muted) !important;
}
html[data-sp-theme="gold"] body .border,
html[data-sp-theme="gold"] body .border-top,
html[data-sp-theme="gold"] body .border-bottom,
html[data-sp-theme="gold"] body hr {
  border-color: var(--sp-theme-border) !important;
}

/* Sidebar rail */
html[data-sp-theme="gold"] body .vertical-menu,
html[data-sp-theme="gold"] body[data-sidebar="dark"] .vertical-menu {
  background: var(--sp-theme-sidebar) !important;
  border-right-color: var(--sp-theme-border) !important;
}
html[data-sp-theme="gold"] body[data-sidebar="dark"] .navbar-brand-box {
  background: var(--sp-theme-sidebar) !important;
  border-right-color: var(--sp-theme-border) !important;
}
html[data-sp-theme="gold"] body #sidebar-menu ul li a,
html[data-sp-theme="gold"] body #sidebar-menu .metismenu > li > a:not(.active) {
  color: var(--sp-theme-sidebar-text);
}
html[data-sp-theme="gold"] body #sidebar-menu ul li a i,
html[data-sp-theme="gold"] body #sidebar-menu .metismenu > li > a:not(.active) i {
  color: var(--sp-theme-sidebar-text);
  opacity: 0.85;
}
html[data-sp-theme="gold"] body #sidebar-menu ul li a:hover,
html[data-sp-theme="gold"] body #sidebar-menu ul li a:hover i,
html[data-sp-theme="gold"] body #sidebar-menu .metismenu > li > a:not(.active):hover,
html[data-sp-theme="gold"] body #sidebar-menu .metismenu > li > a:not(.active):hover i {
  color: #ffffff !important;
  opacity: 1;
}
html[data-sp-theme="gold"] body #sidebar-menu .mm-active > a,
html[data-sp-theme="gold"] body #sidebar-menu .mm-active > a i,
html[data-sp-theme="gold"] body #sidebar-menu .mm-active .active,
html[data-sp-theme="gold"] body #sidebar-menu .mm-active .active i,
html[data-sp-theme="gold"] body #sidebar-menu a.active,
html[data-sp-theme="gold"] body #sidebar-menu a.active i {
  color: #ffffff !important;
}
html[data-sp-theme="gold"] body #sidebar-menu .sidebar-nav-submenu .sidebar-nav-section-links > li > a.active,
html[data-sp-theme="gold"] body #sidebar-menu ul.sub-menu.sidebar-nav-submenu li > a.active {
  background: rgba(var(--bs-primary-rgb), 0.22) !important;
  color: #ffffff !important;
}

/* Primary actions & badges */
html[data-sp-theme="gold"] .btn-primary {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="gold"] .btn-primary:hover,
html[data-sp-theme="gold"] .btn-primary:focus,
html[data-sp-theme="gold"] .btn-primary:active,
html[data-sp-theme="gold"] .btn-primary.active {
  background-color: var(--sp-theme-primary-hover) !important;
  border-color: var(--sp-theme-primary-hover) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="gold"] .btn-outline-primary {
  color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="gold"] .btn-outline-primary:hover,
html[data-sp-theme="gold"] .btn-outline-primary:focus,
html[data-sp-theme="gold"] .btn-outline-primary:active {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="gold"] .bg-primary:not(.bg-soft),
html[data-sp-theme="gold"] .badge.bg-primary:not(.bg-soft) {
  background-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="gold"] .text-primary,
html[data-sp-theme="gold"] a.text-primary {
  color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="gold"] .border-primary {
  border-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="gold"] .page-link {
  color: var(--sp-theme-primary);
}
html[data-sp-theme="gold"] .page-item.active .page-link {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="gold"] .form-check-input:checked {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="gold"] .form-control:focus,
html[data-sp-theme="gold"] .form-select:focus {
  border-color: var(--sp-theme-primary) !important;
  box-shadow: 0 0 0 0.15rem rgba(var(--bs-primary-rgb), 0.2) !important;
}
html[data-sp-theme="gold"] .nav-pills .nav-link.active,
html[data-sp-theme="gold"] .nav-tabs .nav-link.active {
  color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="gold"] .progress-bar {
  background-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="gold"] .avatar-title.bg-primary:not(.bg-soft):not(.bg-soft-primary) {
  background-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="gold"] .bg-soft-primary,
html[data-sp-theme="gold"] .badge-soft-primary {
  background-color: var(--sp-theme-primary-soft) !important;
  color: var(--sp-theme-primary) !important;
}

/* Topbar subtle blend on dark themes */
html[data-sp-theme="gold"][data-layout-mode="dark"] #page-topbar {
  background-color: var(--sp-theme-card) !important;
  border-bottom: 1px solid var(--sp-theme-border);
}
html[data-sp-theme="gold"][data-layout-mode="dark"] .footer {
  background-color: var(--sp-theme-card) !important;
  color: var(--sp-theme-muted);
  border-top: 1px solid var(--sp-theme-border);
}

/* ── forest ── */
html[data-sp-theme="forest"] {
  --bs-primary: #0f766e;
  --bs-primary-rgb: 15, 118, 110;
  --bs-link-color: #0f766e;
  --bs-link-hover-color: #0d5f59;
  --sp-theme-primary: #0f766e;
  --sp-theme-primary-hover: #0d5f59;
  --sp-theme-primary-soft: rgba(15, 118, 110, 0.12);
  --sp-theme-accent: #14b8a6;
  --sp-theme-on-primary: #ffffff;
  --sp-theme-canvas: #f3f7f5;
  --sp-theme-card: #ffffff;
  --sp-theme-text: #134e4a;
  --sp-theme-muted: #5f736e;
  --sp-theme-border: #dce8e4;
  --sp-theme-sidebar: #0b2e2b;
  --sp-theme-sidebar-text: #c5ddd9;
}
html[data-sp-theme="forest"][data-layout-mode="dark"] {
  --sp-theme-canvas: #0a1614;
  --sp-theme-card: #10201d;
  --sp-theme-text: #e6f4f1;
  --sp-theme-muted: #94b0a9;
  --sp-theme-border: #1a302c;
  --sp-theme-sidebar: #071412;
  --sp-theme-sidebar-text: #b7d0ca;
  --sp-theme-primary-text: #5eead4;
}

/* Surfaces */
html[data-sp-theme="forest"] body,
html[data-sp-theme="forest"] body #layout-wrapper,
html[data-sp-theme="forest"] body .main-content,
html[data-sp-theme="forest"] body .page-content {
  background-color: var(--sp-theme-canvas) !important;
  color: var(--sp-theme-text);
}
html[data-sp-theme="forest"] body .card,
html[data-sp-theme="forest"] body .card-header,
html[data-sp-theme="forest"] body .dropdown-menu,
html[data-sp-theme="forest"] body .modal-content,
html[data-sp-theme="forest"] body .offcanvas,
html[data-sp-theme="forest"] body .right-bar {
  background-color: var(--sp-theme-card) !important;
  color: var(--sp-theme-text);
  border-color: var(--sp-theme-border);
}
html[data-sp-theme="forest"] body .card {
  border: 1px solid var(--sp-theme-border);
}
html[data-sp-theme="forest"] body .text-muted {
  color: var(--sp-theme-muted) !important;
}
html[data-sp-theme="forest"] body .border,
html[data-sp-theme="forest"] body .border-top,
html[data-sp-theme="forest"] body .border-bottom,
html[data-sp-theme="forest"] body hr {
  border-color: var(--sp-theme-border) !important;
}

/* Sidebar rail */
html[data-sp-theme="forest"] body .vertical-menu,
html[data-sp-theme="forest"] body[data-sidebar="dark"] .vertical-menu {
  background: var(--sp-theme-sidebar) !important;
  border-right-color: var(--sp-theme-border) !important;
}
html[data-sp-theme="forest"] body[data-sidebar="dark"] .navbar-brand-box {
  background: var(--sp-theme-sidebar) !important;
  border-right-color: var(--sp-theme-border) !important;
}
html[data-sp-theme="forest"] body #sidebar-menu ul li a,
html[data-sp-theme="forest"] body #sidebar-menu .metismenu > li > a:not(.active) {
  color: var(--sp-theme-sidebar-text);
}
html[data-sp-theme="forest"] body #sidebar-menu ul li a i,
html[data-sp-theme="forest"] body #sidebar-menu .metismenu > li > a:not(.active) i {
  color: var(--sp-theme-sidebar-text);
  opacity: 0.85;
}
html[data-sp-theme="forest"] body #sidebar-menu ul li a:hover,
html[data-sp-theme="forest"] body #sidebar-menu ul li a:hover i,
html[data-sp-theme="forest"] body #sidebar-menu .metismenu > li > a:not(.active):hover,
html[data-sp-theme="forest"] body #sidebar-menu .metismenu > li > a:not(.active):hover i {
  color: #ffffff !important;
  opacity: 1;
}
html[data-sp-theme="forest"] body #sidebar-menu .mm-active > a,
html[data-sp-theme="forest"] body #sidebar-menu .mm-active > a i,
html[data-sp-theme="forest"] body #sidebar-menu .mm-active .active,
html[data-sp-theme="forest"] body #sidebar-menu .mm-active .active i,
html[data-sp-theme="forest"] body #sidebar-menu a.active,
html[data-sp-theme="forest"] body #sidebar-menu a.active i {
  color: #ffffff !important;
}
html[data-sp-theme="forest"] body #sidebar-menu .sidebar-nav-submenu .sidebar-nav-section-links > li > a.active,
html[data-sp-theme="forest"] body #sidebar-menu ul.sub-menu.sidebar-nav-submenu li > a.active {
  background: rgba(var(--bs-primary-rgb), 0.22) !important;
  color: #ffffff !important;
}

/* Primary actions & badges */
html[data-sp-theme="forest"] .btn-primary {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="forest"] .btn-primary:hover,
html[data-sp-theme="forest"] .btn-primary:focus,
html[data-sp-theme="forest"] .btn-primary:active,
html[data-sp-theme="forest"] .btn-primary.active {
  background-color: var(--sp-theme-primary-hover) !important;
  border-color: var(--sp-theme-primary-hover) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="forest"] .btn-outline-primary {
  color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="forest"] .btn-outline-primary:hover,
html[data-sp-theme="forest"] .btn-outline-primary:focus,
html[data-sp-theme="forest"] .btn-outline-primary:active {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="forest"] .bg-primary:not(.bg-soft),
html[data-sp-theme="forest"] .badge.bg-primary:not(.bg-soft) {
  background-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="forest"] .text-primary,
html[data-sp-theme="forest"] a.text-primary {
  color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="forest"] .border-primary {
  border-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="forest"] .page-link {
  color: var(--sp-theme-primary);
}
html[data-sp-theme="forest"] .page-item.active .page-link {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="forest"] .form-check-input:checked {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="forest"] .form-control:focus,
html[data-sp-theme="forest"] .form-select:focus {
  border-color: var(--sp-theme-primary) !important;
  box-shadow: 0 0 0 0.15rem rgba(var(--bs-primary-rgb), 0.2) !important;
}
html[data-sp-theme="forest"] .nav-pills .nav-link.active,
html[data-sp-theme="forest"] .nav-tabs .nav-link.active {
  color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="forest"] .progress-bar {
  background-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="forest"] .avatar-title.bg-primary:not(.bg-soft):not(.bg-soft-primary) {
  background-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="forest"] .bg-soft-primary,
html[data-sp-theme="forest"] .badge-soft-primary {
  background-color: var(--sp-theme-primary-soft) !important;
  color: var(--sp-theme-primary) !important;
}

/* Topbar subtle blend on dark themes */
html[data-sp-theme="forest"][data-layout-mode="dark"] #page-topbar {
  background-color: var(--sp-theme-card) !important;
  border-bottom: 1px solid var(--sp-theme-border);
}
html[data-sp-theme="forest"][data-layout-mode="dark"] .footer {
  background-color: var(--sp-theme-card) !important;
  color: var(--sp-theme-muted);
  border-top: 1px solid var(--sp-theme-border);
}

/* ── graphite ── */
html[data-sp-theme="graphite"] {
  --bs-primary: #334155;
  --bs-primary-rgb: 51, 65, 85;
  --bs-link-color: #334155;
  --bs-link-hover-color: #1e293b;
  --sp-theme-primary: #334155;
  --sp-theme-primary-hover: #1e293b;
  --sp-theme-primary-soft: rgba(51, 65, 85, 0.12);
  --sp-theme-accent: #0ea5e9;
  --sp-theme-on-primary: #ffffff;
  --sp-theme-canvas: #f1f5f9;
  --sp-theme-card: #ffffff;
  --sp-theme-text: #0f172a;
  --sp-theme-muted: #64748b;
  --sp-theme-border: #e2e8f0;
  --sp-theme-sidebar: #0f172a;
  --sp-theme-sidebar-text: #cbd5e1;
}
html[data-sp-theme="graphite"][data-layout-mode="dark"] {
  --sp-theme-canvas: #0f172a;
  --sp-theme-card: #1e293b;
  --sp-theme-text: #f1f5f9;
  --sp-theme-muted: #94a3b8;
  --sp-theme-border: #334155;
  --sp-theme-sidebar: #020617;
  --sp-theme-sidebar-text: #cbd5e1;
  --sp-theme-primary-text: #93c5fd;
}

/* Surfaces */
html[data-sp-theme="graphite"] body,
html[data-sp-theme="graphite"] body #layout-wrapper,
html[data-sp-theme="graphite"] body .main-content,
html[data-sp-theme="graphite"] body .page-content {
  background-color: var(--sp-theme-canvas) !important;
  color: var(--sp-theme-text);
}
html[data-sp-theme="graphite"] body .card,
html[data-sp-theme="graphite"] body .card-header,
html[data-sp-theme="graphite"] body .dropdown-menu,
html[data-sp-theme="graphite"] body .modal-content,
html[data-sp-theme="graphite"] body .offcanvas,
html[data-sp-theme="graphite"] body .right-bar {
  background-color: var(--sp-theme-card) !important;
  color: var(--sp-theme-text);
  border-color: var(--sp-theme-border);
}
html[data-sp-theme="graphite"] body .card {
  border: 1px solid var(--sp-theme-border);
}
html[data-sp-theme="graphite"] body .text-muted {
  color: var(--sp-theme-muted) !important;
}
html[data-sp-theme="graphite"] body .border,
html[data-sp-theme="graphite"] body .border-top,
html[data-sp-theme="graphite"] body .border-bottom,
html[data-sp-theme="graphite"] body hr {
  border-color: var(--sp-theme-border) !important;
}

/* Sidebar rail */
html[data-sp-theme="graphite"] body .vertical-menu,
html[data-sp-theme="graphite"] body[data-sidebar="dark"] .vertical-menu {
  background: var(--sp-theme-sidebar) !important;
  border-right-color: var(--sp-theme-border) !important;
}
html[data-sp-theme="graphite"] body[data-sidebar="dark"] .navbar-brand-box {
  background: var(--sp-theme-sidebar) !important;
  border-right-color: var(--sp-theme-border) !important;
}
html[data-sp-theme="graphite"] body #sidebar-menu ul li a,
html[data-sp-theme="graphite"] body #sidebar-menu .metismenu > li > a:not(.active) {
  color: var(--sp-theme-sidebar-text);
}
html[data-sp-theme="graphite"] body #sidebar-menu ul li a i,
html[data-sp-theme="graphite"] body #sidebar-menu .metismenu > li > a:not(.active) i {
  color: var(--sp-theme-sidebar-text);
  opacity: 0.85;
}
html[data-sp-theme="graphite"] body #sidebar-menu ul li a:hover,
html[data-sp-theme="graphite"] body #sidebar-menu ul li a:hover i,
html[data-sp-theme="graphite"] body #sidebar-menu .metismenu > li > a:not(.active):hover,
html[data-sp-theme="graphite"] body #sidebar-menu .metismenu > li > a:not(.active):hover i {
  color: #ffffff !important;
  opacity: 1;
}
html[data-sp-theme="graphite"] body #sidebar-menu .mm-active > a,
html[data-sp-theme="graphite"] body #sidebar-menu .mm-active > a i,
html[data-sp-theme="graphite"] body #sidebar-menu .mm-active .active,
html[data-sp-theme="graphite"] body #sidebar-menu .mm-active .active i,
html[data-sp-theme="graphite"] body #sidebar-menu a.active,
html[data-sp-theme="graphite"] body #sidebar-menu a.active i {
  color: #ffffff !important;
}
html[data-sp-theme="graphite"] body #sidebar-menu .sidebar-nav-submenu .sidebar-nav-section-links > li > a.active,
html[data-sp-theme="graphite"] body #sidebar-menu ul.sub-menu.sidebar-nav-submenu li > a.active {
  background: rgba(var(--bs-primary-rgb), 0.22) !important;
  color: #ffffff !important;
}

/* Primary actions & badges */
html[data-sp-theme="graphite"] .btn-primary {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="graphite"] .btn-primary:hover,
html[data-sp-theme="graphite"] .btn-primary:focus,
html[data-sp-theme="graphite"] .btn-primary:active,
html[data-sp-theme="graphite"] .btn-primary.active {
  background-color: var(--sp-theme-primary-hover) !important;
  border-color: var(--sp-theme-primary-hover) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="graphite"] .btn-outline-primary {
  color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="graphite"] .btn-outline-primary:hover,
html[data-sp-theme="graphite"] .btn-outline-primary:focus,
html[data-sp-theme="graphite"] .btn-outline-primary:active {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="graphite"] .bg-primary:not(.bg-soft),
html[data-sp-theme="graphite"] .badge.bg-primary:not(.bg-soft) {
  background-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="graphite"] .text-primary,
html[data-sp-theme="graphite"] a.text-primary {
  color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="graphite"] .border-primary {
  border-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="graphite"] .page-link {
  color: var(--sp-theme-primary);
}
html[data-sp-theme="graphite"] .page-item.active .page-link {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="graphite"] .form-check-input:checked {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="graphite"] .form-control:focus,
html[data-sp-theme="graphite"] .form-select:focus {
  border-color: var(--sp-theme-primary) !important;
  box-shadow: 0 0 0 0.15rem rgba(var(--bs-primary-rgb), 0.2) !important;
}
html[data-sp-theme="graphite"] .nav-pills .nav-link.active,
html[data-sp-theme="graphite"] .nav-tabs .nav-link.active {
  color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="graphite"] .progress-bar {
  background-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="graphite"] .avatar-title.bg-primary:not(.bg-soft):not(.bg-soft-primary) {
  background-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="graphite"] .bg-soft-primary,
html[data-sp-theme="graphite"] .badge-soft-primary {
  background-color: var(--sp-theme-primary-soft) !important;
  color: var(--sp-theme-primary) !important;
}

/* Topbar subtle blend on dark themes */
html[data-sp-theme="graphite"][data-layout-mode="dark"] #page-topbar {
  background-color: var(--sp-theme-card) !important;
  border-bottom: 1px solid var(--sp-theme-border);
}
html[data-sp-theme="graphite"][data-layout-mode="dark"] .footer {
  background-color: var(--sp-theme-card) !important;
  color: var(--sp-theme-muted);
  border-top: 1px solid var(--sp-theme-border);
}

/* ── wine ── */
html[data-sp-theme="wine"] {
  --bs-primary: #9f1239;
  --bs-primary-rgb: 159, 18, 57;
  --bs-link-color: #9f1239;
  --bs-link-hover-color: #881337;
  --sp-theme-primary: #9f1239;
  --sp-theme-primary-hover: #881337;
  --sp-theme-primary-soft: rgba(159, 18, 57, 0.12);
  --sp-theme-accent: #e11d48;
  --sp-theme-on-primary: #ffffff;
  --sp-theme-canvas: #faf7f8;
  --sp-theme-card: #ffffff;
  --sp-theme-text: #1c1917;
  --sp-theme-muted: #78716c;
  --sp-theme-border: #efe4e7;
  --sp-theme-sidebar: #1c0a10;
  --sp-theme-sidebar-text: #e7d0d7;
}
html[data-sp-theme="wine"][data-layout-mode="dark"] {
  --sp-theme-canvas: #140a0e;
  --sp-theme-card: #1c1014;
  --sp-theme-text: #fce7ef;
  --sp-theme-muted: #c4a4ae;
  --sp-theme-border: #2e1a22;
  --sp-theme-sidebar: #0f070a;
  --sp-theme-sidebar-text: #e7d0d7;
  --sp-theme-primary-text: #f9a8d4;
}

/* Surfaces */
html[data-sp-theme="wine"] body,
html[data-sp-theme="wine"] body #layout-wrapper,
html[data-sp-theme="wine"] body .main-content,
html[data-sp-theme="wine"] body .page-content {
  background-color: var(--sp-theme-canvas) !important;
  color: var(--sp-theme-text);
}
html[data-sp-theme="wine"] body .card,
html[data-sp-theme="wine"] body .card-header,
html[data-sp-theme="wine"] body .dropdown-menu,
html[data-sp-theme="wine"] body .modal-content,
html[data-sp-theme="wine"] body .offcanvas,
html[data-sp-theme="wine"] body .right-bar {
  background-color: var(--sp-theme-card) !important;
  color: var(--sp-theme-text);
  border-color: var(--sp-theme-border);
}
html[data-sp-theme="wine"] body .card {
  border: 1px solid var(--sp-theme-border);
}
html[data-sp-theme="wine"] body .text-muted {
  color: var(--sp-theme-muted) !important;
}
html[data-sp-theme="wine"] body .border,
html[data-sp-theme="wine"] body .border-top,
html[data-sp-theme="wine"] body .border-bottom,
html[data-sp-theme="wine"] body hr {
  border-color: var(--sp-theme-border) !important;
}

/* Sidebar rail */
html[data-sp-theme="wine"] body .vertical-menu,
html[data-sp-theme="wine"] body[data-sidebar="dark"] .vertical-menu {
  background: var(--sp-theme-sidebar) !important;
  border-right-color: var(--sp-theme-border) !important;
}
html[data-sp-theme="wine"] body[data-sidebar="dark"] .navbar-brand-box {
  background: var(--sp-theme-sidebar) !important;
  border-right-color: var(--sp-theme-border) !important;
}
html[data-sp-theme="wine"] body #sidebar-menu ul li a,
html[data-sp-theme="wine"] body #sidebar-menu .metismenu > li > a:not(.active) {
  color: var(--sp-theme-sidebar-text);
}
html[data-sp-theme="wine"] body #sidebar-menu ul li a i,
html[data-sp-theme="wine"] body #sidebar-menu .metismenu > li > a:not(.active) i {
  color: var(--sp-theme-sidebar-text);
  opacity: 0.85;
}
html[data-sp-theme="wine"] body #sidebar-menu ul li a:hover,
html[data-sp-theme="wine"] body #sidebar-menu ul li a:hover i,
html[data-sp-theme="wine"] body #sidebar-menu .metismenu > li > a:not(.active):hover,
html[data-sp-theme="wine"] body #sidebar-menu .metismenu > li > a:not(.active):hover i {
  color: #ffffff !important;
  opacity: 1;
}
html[data-sp-theme="wine"] body #sidebar-menu .mm-active > a,
html[data-sp-theme="wine"] body #sidebar-menu .mm-active > a i,
html[data-sp-theme="wine"] body #sidebar-menu .mm-active .active,
html[data-sp-theme="wine"] body #sidebar-menu .mm-active .active i,
html[data-sp-theme="wine"] body #sidebar-menu a.active,
html[data-sp-theme="wine"] body #sidebar-menu a.active i {
  color: #ffffff !important;
}
html[data-sp-theme="wine"] body #sidebar-menu .sidebar-nav-submenu .sidebar-nav-section-links > li > a.active,
html[data-sp-theme="wine"] body #sidebar-menu ul.sub-menu.sidebar-nav-submenu li > a.active {
  background: rgba(var(--bs-primary-rgb), 0.22) !important;
  color: #ffffff !important;
}

/* Primary actions & badges */
html[data-sp-theme="wine"] .btn-primary {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="wine"] .btn-primary:hover,
html[data-sp-theme="wine"] .btn-primary:focus,
html[data-sp-theme="wine"] .btn-primary:active,
html[data-sp-theme="wine"] .btn-primary.active {
  background-color: var(--sp-theme-primary-hover) !important;
  border-color: var(--sp-theme-primary-hover) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="wine"] .btn-outline-primary {
  color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="wine"] .btn-outline-primary:hover,
html[data-sp-theme="wine"] .btn-outline-primary:focus,
html[data-sp-theme="wine"] .btn-outline-primary:active {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="wine"] .bg-primary:not(.bg-soft),
html[data-sp-theme="wine"] .badge.bg-primary:not(.bg-soft) {
  background-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="wine"] .text-primary,
html[data-sp-theme="wine"] a.text-primary {
  color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="wine"] .border-primary {
  border-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="wine"] .page-link {
  color: var(--sp-theme-primary);
}
html[data-sp-theme="wine"] .page-item.active .page-link {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="wine"] .form-check-input:checked {
  background-color: var(--sp-theme-primary) !important;
  border-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="wine"] .form-control:focus,
html[data-sp-theme="wine"] .form-select:focus {
  border-color: var(--sp-theme-primary) !important;
  box-shadow: 0 0 0 0.15rem rgba(var(--bs-primary-rgb), 0.2) !important;
}
html[data-sp-theme="wine"] .nav-pills .nav-link.active,
html[data-sp-theme="wine"] .nav-tabs .nav-link.active {
  color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="wine"] .progress-bar {
  background-color: var(--sp-theme-primary) !important;
}
html[data-sp-theme="wine"] .avatar-title.bg-primary:not(.bg-soft):not(.bg-soft-primary) {
  background-color: var(--sp-theme-primary) !important;
  color: var(--sp-theme-on-primary) !important;
}
html[data-sp-theme="wine"] .bg-soft-primary,
html[data-sp-theme="wine"] .badge-soft-primary {
  background-color: var(--sp-theme-primary-soft) !important;
  color: var(--sp-theme-primary) !important;
}

/* Topbar subtle blend on dark themes */
html[data-sp-theme="wine"][data-layout-mode="dark"] #page-topbar {
  background-color: var(--sp-theme-card) !important;
  border-bottom: 1px solid var(--sp-theme-border);
}
html[data-sp-theme="wine"][data-layout-mode="dark"] .footer {
  background-color: var(--sp-theme-card) !important;
  color: var(--sp-theme-muted);
  border-top: 1px solid var(--sp-theme-border);
}

/* Gold buttons: dark ink for contrast on warm primary */
html[data-sp-theme="gold"] .btn-primary,
html[data-sp-theme="gold"] .btn-outline-primary:hover,
html[data-sp-theme="gold"] .page-item.active .page-link {
  color: #1c1917 !important;
}
html[data-sp-theme="gold"] .btn-outline-primary {
  color: #9a7209 !important;
  border-color: #b8860b !important;
}

/*
 * Dark mode: light-mode primaries (e.g. navy #1e4d8c) are too dark for
 * .text-primary on grey card headers — classic “grey on grey” on
 * usgoldcoins / othergoldcoins and similar. Brighten text roles only.
 */
html[data-sp-theme][data-layout-mode="dark"] {
  --sp-theme-primary-text: #8eb6ff;
}
html[data-sp-theme][data-layout-mode="dark"] .text-primary,
html[data-sp-theme][data-layout-mode="dark"] a.text-primary,
html[data-sp-theme][data-layout-mode="dark"] .card-header h5,
html[data-sp-theme][data-layout-mode="dark"] .card-header h6,
html[data-sp-theme][data-layout-mode="dark"] .card-header .coinname,
html[data-sp-theme][data-layout-mode="dark"] .card-header h5.my-0,
html[data-sp-theme][data-layout-mode="dark"] .badge-soft-primary {
  color: var(--sp-theme-primary-text) !important;
}
html[data-sp-theme][data-layout-mode="dark"] .btn-outline-primary {
  color: var(--sp-theme-primary-text) !important;
  border-color: var(--sp-theme-primary-text) !important;
}
html[data-sp-theme][data-layout-mode="dark"] .nav-pills .nav-link.active,
html[data-sp-theme][data-layout-mode="dark"] .nav-tabs .nav-link.active {
  color: var(--sp-theme-primary-text) !important;
}
html[data-sp-theme][data-layout-mode="dark"] .page-link {
  color: var(--sp-theme-primary-text);
}
/* Coin melt cards: keep description table readable */
html[data-sp-theme][data-layout-mode="dark"] .coinholder .description h5,
html[data-sp-theme][data-layout-mode="dark"] .coinholder .description td {
  color: var(--sp-theme-text) !important;
}
html[data-sp-theme][data-layout-mode="dark"] .card-title.pricesheader,
html[data-sp-theme][data-layout-mode="dark"] .card-title.value {
  color: var(--sp-theme-text) !important;
}

/* Soft primary tints — keep icons/numbers visible */
html[data-sp-theme] .bg-primary.bg-soft,
html[data-sp-theme] .badge.bg-primary.bg-soft,
html[data-sp-theme] .bg-soft-primary,
html[data-sp-theme] .badge-soft-primary,
html[data-sp-theme] .avatar-title.bg-soft-primary,
html[data-sp-theme] .avatar-sm .avatar-title.bg-soft-primary,
html[data-sp-theme] .avatar-title.bg-primary.bg-soft {
  background-color: var(--sp-theme-primary-soft) !important;
  color: var(--sp-theme-primary) !important;
}
html[data-sp-theme] .bg-primary.bg-soft i,
html[data-sp-theme] .bg-soft-primary i,
html[data-sp-theme] .badge-soft-primary i,
html[data-sp-theme] .avatar-title.bg-soft-primary i,
html[data-sp-theme] .avatar-title.bg-primary.bg-soft i {
  color: inherit !important;
}

/* Dark mode: soft chips need bright primary text (not light-mode navy/gold ink) */
html[data-sp-theme][data-layout-mode="dark"] .bg-primary.bg-soft,
html[data-sp-theme][data-layout-mode="dark"] .badge.bg-primary.bg-soft,
html[data-sp-theme][data-layout-mode="dark"] .bg-soft-primary,
html[data-sp-theme][data-layout-mode="dark"] .badge-soft-primary,
html[data-sp-theme][data-layout-mode="dark"] .avatar-title.bg-soft-primary,
html[data-sp-theme][data-layout-mode="dark"] .avatar-title.bg-primary.bg-soft {
  color: var(--sp-theme-primary-text) !important;
}

/* Spot / metric numbers on themed cards stay readable */
html[data-sp-theme] .pos-spot-value,
html[data-sp-theme] .pos-metric-value,
html[data-sp-theme] .pa-stat-card .stat-value {
  color: var(--sp-theme-text) !important;
}
html[data-sp-theme][data-layout-mode="dark"] .pos-spot-value,
html[data-sp-theme][data-layout-mode="dark"] .pos-metric-value,
html[data-sp-theme][data-layout-mode="dark"] .pa-stat-card .stat-value {
  color: var(--sp-theme-text) !important;
}