/**
 * LOTPIP brand theme — gold accents on navy (matches logo).
 */
:root {
  --lotpip-navy: #0a1628;
  --lotpip-navy-deep: #050c1d;
  --lotpip-navy-card: #112240;
  --lotpip-gold: #c59b4b;
  --lotpip-gold-light: #d4af37;
  --lotpip-gold-dark: #a67c52;
  --lotpip-gold-deep: #8b6914;
  --lotpip-text-muted: #b8a88a;
  --lotpip-border-gold: rgba(197, 155, 75, 0.35);
  --primary: #c59b4b;
  --blue: #c59b4b;
}

.row.page-titles h3.text-primary {
  color: var(--lotpip-gold-light) !important;
}

a.text-primary,
.color-primary {
  color: var(--lotpip-gold-light) !important;
}

.bg-primary {
  background-color: var(--lotpip-gold) !important;
}

.border-primary {
  border-color: var(--lotpip-gold) !important;
}

.btn-primary,
.bank_tabpanel .btn-primary,
.card-title a.btn-primary,
#profBtn {
  background: linear-gradient(135deg, var(--lotpip-gold) 0%, var(--lotpip-gold-dark) 100%) !important;
  border-color: var(--lotpip-gold-dark) !important;
  color: #fff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
  background: linear-gradient(135deg, var(--lotpip-gold-light) 0%, var(--lotpip-gold) 100%) !important;
  border-color: var(--lotpip-gold) !important;
  box-shadow: 0 4px 14px rgba(197, 155, 75, 0.35) !important;
}

.btn-outline-primary {
  color: var(--lotpip-gold-light) !important;
  border-color: var(--lotpip-gold) !important;
}

.btn-outline-primary:hover {
  background: var(--lotpip-gold) !important;
  border-color: var(--lotpip-gold) !important;
  color: #fff !important;
}

.badge-primary,
.badge-success {
  background-color: var(--lotpip-gold) !important;
}

.progress-bar-primary,
.progress-bar.bg-primary {
  background-color: var(--lotpip-gold) !important;
}

/* Sidebar & navigation — subtle gold accent, no solid gold blocks */
.sidebar-nav > ul > li.active {
  background: transparent !important;
}

.left-sidebar .scroll-sidebar .sidebar-nav > ul > li.active > a,
.sidebar-nav > ul > li.active > a {
  background: rgba(197, 155, 75, 0.14) !important;
  border-left: 3px solid var(--lotpip-gold-light) !important;
  color: var(--lotpip-gold-dark) !important;
  font-weight: 600;
}

.sidebar-nav > ul > li.active > a i,
.light_themesidebar .sidebar-nav > ul > li.active > a i {
  color: var(--lotpip-gold) !important;
}

.left-sidebar .scroll-sidebar .sidebar-nav > ul > li > a:hover,
.sidebar-nav > ul > li > a:hover,
.light_themesidebar .sidebar-nav > ul > li > a:hover,
.light_themesidebar .sidebar-nav ul li a:hover {
  background: rgba(197, 155, 75, 0.1) !important;
  border-left: 3px solid var(--lotpip-gold) !important;
  color: var(--lotpip-gold-dark) !important;
}

.sidebar-nav > ul > li > a:hover i,
.light_themesidebar .sidebar-nav > ul > li > a:hover i,
.light_themesidebar .sidebar-nav ul li a:hover i {
  color: var(--lotpip-gold) !important;
}

/* Submenu links — keep readable on light sidebar */
.light_themesidebar .sidebar-nav ul li ul li a {
  color: #1e222d !important;
}

.light_themesidebar .sidebar-nav ul li ul li a:hover {
  background: rgba(197, 155, 75, 0.08) !important;
  color: var(--lotpip-gold-dark) !important;
  border-left: none !important;
}

.light_themesidebar .sidebar-nav ul li ul li a.active {
  color: var(--lotpip-gold-dark) !important;
  font-weight: 600;
}

/* Dark client sidebar (navy background) */
body.lightmode .sidebar-nav ul li a,
body.lightmode .sidebar-nav > ul > li > a i {
  color: #8fa4c4 !important;
}

body.lightmode .left-sidebar .scroll-sidebar .sidebar-nav > ul > li.active > a,
body.lightmode .sidebar-nav > ul > li > a:hover {
  background: rgba(197, 155, 75, 0.15) !important;
  color: var(--lotpip-gold-light) !important;
}

body.lightmode .sidebar-nav > ul > li.active > a i,
body.lightmode .sidebar-nav > ul > li > a:hover i {
  color: var(--lotpip-gold-light) !important;
}

.sidebar-nav ul li.nav-label {
  color: var(--lotpip-gold-light) !important;
}

.light_themesidebar .sidebar-nav ul li.nav-label {
  color: var(--lotpip-gold-dark) !important;
}

/* Collapsed sidebar mini hover popup */
.sidebar-mini .sidebar-nav #sidebar-menu > li:hover > a {
  background: rgba(197, 155, 75, 0.12) !important;
  color: var(--lotpip-gold-dark) !important;
}

.sidebar-mini .sidebar-nav #sidebar-menu > li:hover > a i {
  color: var(--lotpip-gold) !important;
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
  background-color: var(--lotpip-gold) !important;
  border-color: var(--lotpip-gold) !important;
}

/* Forms */
.form-control:focus,
.form-control.active {
  border-color: var(--lotpip-border-gold) !important;
}

/* Wallet / deposit header button */
.header .wallet-btnn,
.wallet-btnn,
.btn.wallet-btnn,
.client-portal .header .btn.wallet-btnn {
  background: linear-gradient(135deg, var(--lotpip-gold) 0%, var(--lotpip-gold-dark) 100%) !important;
  border: 1px solid var(--lotpip-gold-dark) !important;
  color: #fff !important;
  font-weight: 600;
  border-radius: 6px !important;
  box-shadow: 0 2px 8px rgba(197, 155, 75, 0.35);
}

.header .wallet-btnn:hover,
.wallet-btnn:hover,
.btn.wallet-btnn:hover {
  background: linear-gradient(135deg, var(--lotpip-gold-light) 0%, var(--lotpip-gold) 100%) !important;
  color: #fff !important;
  border-color: var(--lotpip-gold) !important;
}

/* Dark / light mode toggle — logo gold */
.theme__toggler-container,
body.client-portal .theme__toggler-container,
.lightmode .theme__toggler-container {
  background: var(--lotpip-gold) !important;
  border: 3px solid var(--lotpip-gold-dark) !important;
}

.theme__toggler:before,
.theme__toggler .dot,
.theme__toggler .dot:before,
.theme__toggler .dot:after {
  background: var(--lotpip-gold-light) !important;
}

.theme__toggler,
body.client-portal .theme__toggler,
.lightmode .theme__toggler-container .theme__toggler {
  background: var(--lotpip-navy) !important;
}

.lightmode .theme__toggler-container .dot,
body.client-portal:not(.lightmode) .theme__toggler-container .dot {
  background: var(--lotpip-gold-light) !important;
}

/* Cregis crypto deposit card */
.cregis-deposit-card {
  background: linear-gradient(145deg, var(--lotpip-gold) 0%, var(--lotpip-gold-dark) 45%, var(--lotpip-gold-deep) 100%) !important;
}

.cregis-deposit-card:hover {
  box-shadow: 0 8px 24px rgba(197, 155, 75, 0.35) !important;
}

/* Account cards */
.account-card {
  border-color: var(--lotpip-border-gold) !important;
}

.account-card--standard {
  border-top-color: var(--lotpip-gold-light) !important;
}

/* 2FA steps */
.twofa-step.active .twofa-step-label,
.twofa-step.active .twofa-step-circle {
  color: var(--lotpip-gold-light) !important;
  border-color: var(--lotpip-gold-light) !important;
}

.twofa-step.active .twofa-step-circle {
  background: var(--lotpip-gold) !important;
}

/* Light theme header stays navy to match logo */
.lightmode .header,
.header {
  background: var(--lotpip-navy) !important;
}

.lightmode .header .top-navbar .navbar-header {
  background: var(--lotpip-navy) !important;
}

/* Logo — transparent PNG, no box behind image */
.navbar-brand .side-logo,
.navbar-brand img.side-logo,
.login-logo-right img {
  background: transparent !important;
  object-fit: contain;
}

/* Sidebar submenu & active links (admin + client) */
.sidebar-nav ul li a,
.sidebar-nav ul li ul li a,
#sidebar-menu ul li ul li a {
  color: #4a5568 !important;
}

.sidebar-nav ul li a:hover,
.sidebar-nav ul li ul li a:hover {
  color: var(--lotpip-gold-dark) !important;
}

.sidebar-nav ul li a.active,
.sidebar-nav ul li ul li a.active,
#sidebar-menu ul li a.active {
  color: var(--lotpip-gold-dark) !important;
  font-weight: 600;
}

.sidebar-nav ul li a.active i,
.sidebar-nav ul li ul li a.active i {
  color: var(--lotpip-gold) !important;
}

body.lightmode .sidebar-nav ul li ul li a {
  color: #8fa4c4 !important;
}

body.lightmode .sidebar-nav ul li ul li a.active,
body.lightmode .sidebar-nav ul li ul li a:hover {
  color: var(--lotpip-gold-light) !important;
}

/* DataTables export buttons (Copy, CSV, Excel, Print) */
.dataTables_wrapper .dt-buttons .dt-button,
.dataTables_wrapper .dt-buttons a.dt-button,
.dataTables_wrapper .dt-buttons button.dt-button,
.dt-button.buttons-copy,
.dt-button.buttons-csv,
.dt-button.buttons-excel,
.dt-button.buttons-print,
.dt-button.buttons-html5 {
  background: linear-gradient(135deg, var(--lotpip-gold) 0%, var(--lotpip-gold-dark) 100%) !important;
  border: 1px solid var(--lotpip-gold-dark) !important;
  color: #fff !important;
  border-radius: 4px !important;
}

.dataTables_wrapper .dt-buttons .dt-button:hover,
.dt-button.buttons-html5:hover {
  background: linear-gradient(135deg, var(--lotpip-gold-light) 0%, var(--lotpip-gold) 100%) !important;
  border-color: var(--lotpip-gold) !important;
  color: #fff !important;
}

/* Pagination — Bootstrap + DataTables */
.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.pagination > .active > span,
.pagination > .active > span:focus,
.pagination > .active > span:hover,
.page-item.active .page-link,
.page-item.active .page-link:hover,
.page-item.active .page-link:focus,
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
.paging_simple_numbers .pagination .paginate_button.active a {
  background-color: var(--lotpip-gold) !important;
  border-color: var(--lotpip-gold) !important;
  color: #fff !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover,
.pagination > li > a:hover,
.pagination > li > span:hover {
  background-color: rgba(197, 155, 75, 0.15) !important;
  border-color: var(--lotpip-gold) !important;
  color: var(--lotpip-gold-dark) !important;
}

/* Misc icons still using bootstrap blue */
.circle-icon {
  background-color: var(--lotpip-gold) !important;
}

.circle-icon:hover {
  background-color: var(--lotpip-gold-dark) !important;
}

.customtab li a.nav-link,
.profile-tab li a.nav-link {
  color: var(--lotpip-gold-dark) !important;
}

.customtab li a.nav-link.active,
.profile-tab li a.nav-link.active {
  border-bottom-color: var(--lotpip-gold) !important;
  color: var(--lotpip-gold-dark) !important;
}

/* Client page header / breadcrumb bar (Dashboard, etc.) */
.new-title .page-titles,
.container-fluid.new-title .page-titles {
  background: linear-gradient(
    135deg,
    var(--lotpip-navy) 0%,
    var(--lotpip-navy-card) 55%,
    rgba(197, 155, 75, 0.22) 100%
  ) !important;
  border-bottom: 2px solid var(--lotpip-gold) !important;
  border-radius: 16px 16px 0 0 !important;
  animation: none !important;
  box-shadow: 0 4px 14px rgba(10, 22, 40, 0.35) !important;
}

.new-title .page-titles:before {
  display: none !important;
}

.new-title .page-titles h3,
.row.page-titles h3,
.row.page-titles h3.text-primary {
  color: var(--lotpip-gold-light) !important;
  padding-left: 1rem !important;
}

.new-title .page-titles .breadcrumb li a,
.page-titles .breadcrumb li a {
  color: rgba(255, 255, 255, 0.88) !important;
}

.new-title .page-titles .breadcrumb li a:hover,
.page-titles .breadcrumb li a:hover {
  color: var(--lotpip-gold-light) !important;
}

.new-title .page-titles .breadcrumb .breadcrumb-item.active,
.page-titles .breadcrumb .breadcrumb-item.active {
  color: var(--lotpip-gold-light) !important;
}

.new-title .page-titles .breadcrumb .breadcrumb-item + .breadcrumb-item:before,
.page-titles .breadcrumb .breadcrumb-item + .breadcrumb-item:before {
  color: var(--lotpip-gold) !important;
}

/* Plain page-titles without new-title wrapper (fallback) */
.page-titles {
  background: var(--lotpip-navy-card) !important;
  border-bottom: 1px solid var(--lotpip-border-gold) !important;
}

/* Admin — top header + page title bar only (not sidebar/content) */
/* Logo strip — white box on navy header (client light theme + admin) */
body.client-portal:not(.lightmode) .header .top-navbar .navbar-header,
body.admin-portal .header .top-navbar .navbar-header {
  background: #fff !important;
  line-height: 45px;
  text-align: center;
}

body.client-portal:not(.lightmode) .header .top-navbar .navbar-header .navbar-brand,
body.client-portal:not(.lightmode) .header .top-navbar .navbar-header .navbar-brand b,
body.admin-portal .header .top-navbar .navbar-header .navbar-brand,
body.admin-portal .header .top-navbar .navbar-header .navbar-brand b {
  background: transparent !important;
}

body.client-portal:not(.lightmode) .header .top-navbar .navbar-header .navbar-brand b img,
body.admin-portal .header .top-navbar .navbar-header .navbar-brand b img {
  max-width: 100%;
  width: 65%;
  background: transparent !important;
}

body.client-portal:not(.lightmode) .header .top-navbar .navbar-header .side-logo,
body.admin-portal .header .top-navbar .navbar-header .side-logo {
  width: 51% !important;
}

body.admin-portal .header {
  background: var(--lotpip-navy) !important;
  box-shadow: 0 2px 10px rgba(10, 22, 40, 0.3) !important;
}

body.admin-portal .header .top-navbar .navbar-header .navbar-brand b {
  width: 100% !important;
  min-width: 160px;
}

/* Light theme CSS hides #dark_theme_logo — show the correct logo on admin (same as client light theme) */
body.admin-portal .desktop-logo .side-logo#light_theme_logo {
  display: inline-block !important;
}

body.admin-portal .desktop-logo .side-logo#dark_theme_logo {
  display: none !important;
}

body.admin-portal .mobile-logo .side-logo#dark_theme_logo {
  display: inline-block !important;
}

body.admin-portal .mobile-logo .side-logo#light_theme_logo {
  display: none !important;
}

body.admin-portal .header .nav-link,
body.admin-portal .header .nav-link i,
body.admin-portal .header .toggle-nav,
body.admin-portal .header .sidebartoggle {
  color: rgba(255, 255, 255, 0.9) !important;
}

body.admin-portal .header .nav-link:hover,
body.admin-portal .header .nav-link:hover i {
  color: var(--lotpip-gold-light) !important;
}

body.admin-portal .header .notify .heartbit,
body.admin-portal .header .notify .point {
  border-color: var(--lotpip-gold) !important;
  background-color: var(--lotpip-gold) !important;
}

/* Client header — welcome + name readable on navy bar (all themes) */
body.client-portal .header .client-header-greeting {
  color: rgba(255, 255, 255, 0.92) !important;
  font-weight: 600;
  font-size: 0.95rem;
  line-height: 1.3;
}

body.client-portal .header .client-header-greeting .client-header-name {
  color: var(--lotpip-gold-light) !important;
  font-weight: 700;
}

body.admin-portal .new-title .page-titles {
  background: linear-gradient(
    135deg,
    var(--lotpip-navy) 0%,
    var(--lotpip-navy-card) 55%,
    rgba(197, 155, 75, 0.22) 100%
  ) !important;
  border-bottom: 2px solid var(--lotpip-gold) !important;
  border-radius: 0 0 0 0 !important;
  margin-top: 0 !important;
  padding: 16px 12px !important;
  box-shadow: none !important;
}

body.admin-portal .new-title .page-titles h3,
body.admin-portal .new-title .page-titles h3.text-primary {
  color: var(--lotpip-gold-light) !important;
  padding-left: 0.5rem !important;
}

body.admin-portal .new-title .page-titles .breadcrumb li a {
  color: rgba(255, 255, 255, 0.88) !important;
}

body.admin-portal .new-title .page-titles .breadcrumb li a:hover {
  color: var(--lotpip-gold-light) !important;
}

body.admin-portal .new-title .page-titles .breadcrumb .breadcrumb-item.active {
  color: var(--lotpip-gold-light) !important;
}

body.admin-portal .new-title .page-titles .breadcrumb .breadcrumb-item + .breadcrumb-item:before {
  color: var(--lotpip-gold) !important;
}

body.admin-portal .admin-financial-quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 12px 12px 0;
}

body.admin-portal .admin-financial-quick-btn {
  background: linear-gradient(135deg, var(--lotpip-gold) 0%, var(--lotpip-gold-dark) 100%) !important;
  border: 1px solid var(--lotpip-gold-dark) !important;
  border-radius: 999px;
  box-shadow: 0 2px 8px rgba(197, 155, 75, 0.28);
  color: #fff !important;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.2;
  min-width: 7.5rem;
  padding: 0.45rem 1.15rem;
  text-align: center;
}

body.admin-portal .admin-financial-quick-btn:hover,
body.admin-portal .admin-financial-quick-btn:focus {
  background: linear-gradient(135deg, var(--lotpip-gold-light) 0%, var(--lotpip-gold) 100%) !important;
  border-color: var(--lotpip-gold) !important;
  box-shadow: 0 4px 14px rgba(197, 155, 75, 0.35) !important;
  color: #fff !important;
  text-decoration: none;
}

body.admin-portal .admin-financial-quick-btn.active {
  background: linear-gradient(135deg, var(--lotpip-gold-light) 0%, var(--lotpip-gold-deep) 100%) !important;
  border-color: var(--lotpip-gold-deep) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.2), 0 2px 10px rgba(197, 155, 75, 0.35) !important;
  color: #fff !important;
}