/*
 * Nexus Green Theme — PopPay
 * Single override file for admin + merchant panels.
 * Loaded last in both header includes so these rules win.
 */

/* =====================================================================
   1. SIDEBAR / LEFT MENU
   ===================================================================== */
#layout-menu.bg-menu-theme,
.layout-menu.bg-menu-theme {
  background-color: #0d3b2e !important;
  border-right: none !important;
}
#layout-menu .app-brand,
.layout-menu .app-brand {
  background-color: #0a2e23 !important;
  border-bottom: 1px solid rgba(255,255,255,.08);
  padding: 16px 20px;
}
.bg-menu-theme .menu-link,
.bg-menu-theme .menu-horizontal-prev,
.bg-menu-theme .menu-horizontal-next {
  color: rgba(255,255,255,.65) !important;
}
.bg-menu-theme .menu-link:hover,
.bg-menu-theme .menu-link:focus {
  color: #fff !important;
  background-color: rgba(255,255,255,.08) !important;
}
.layout-wrapper:not(.layout-horizontal) .bg-menu-theme .menu-inner > .menu-item.active:before {
  background: #2d8653 !important;
}
.bg-menu-theme .menu-item.active > .menu-link,
.bg-menu-theme .menu-item.open:not(.menu-item-closing) > .menu-toggle {
  color: #fff !important;
  background-color: rgba(255,255,255,.1) !important;
}
.bg-menu-theme .menu-item.active > .menu-link:not(.menu-toggle) {
  background-color: rgba(45,134,83,.25) !important;
  color: #fff !important;
}
.bg-menu-theme .menu-sub > .menu-item > .menu-link:before {
  background-color: rgba(255,255,255,.5) !important;
}
.bg-menu-theme .menu-sub > .menu-item.active > .menu-link:not(.menu-toggle):before {
  background-color: #fff !important;
}
.bg-menu-theme .menu-sub,
.bg-menu-theme .menu-inner > .menu-item.open .menu-sub {
  background-color: rgba(0,0,0,.15) !important;
}
.bg-menu-theme .menu-header { color: rgba(255,255,255,.35) !important; }
.bg-menu-theme .menu-header:before { background-color: rgba(255,255,255,.15) !important; }
.bg-menu-theme .menu-text,
.bg-menu-theme .menu-link .menu-icon { color: rgba(255,255,255,.65) !important; }
.bg-menu-theme .menu-inner-shadow {
  background: linear-gradient(#0d3b2e 41%, rgba(13,59,46,.11) 95%, rgba(13,59,46,0)) !important;
}
.bg-menu-theme .menu-item .menu-toggle::after { color: rgba(255,255,255,.5) !important; }
.bg-menu-theme .menu-icon { color: rgba(255,255,255,.5) !important; }
.bg-menu-theme .menu-item.active .menu-icon,
.bg-menu-theme .menu-item:hover .menu-icon { color: #fff !important; }
#layout-menu::-webkit-scrollbar { width: 4px; }
#layout-menu::-webkit-scrollbar-thumb { background: rgba(255,255,255,.2); border-radius: 4px; }

/* =====================================================================
   2. TOP NAVBAR
   ===================================================================== */
.bg-navbar-theme,
#layout-navbar.bg-navbar-theme {
  background-color: #fff !important;
  border-bottom: 1px solid #b7dfc8 !important;
  box-shadow: 0 1px 8px rgba(13,59,46,.08) !important;
}
.bg-navbar-theme .navbar-nav .nav-link,
.bg-navbar-theme .navbar-brand,
.bg-navbar-theme .navbar-brand a { color: #1a2e25 !important; }

/* =====================================================================
   3. PRIMARY COLOUR — all usages of Bootstrap's blue primary
   ===================================================================== */
.btn-primary {
  background-color: #2d8653 !important;
  border-color: #2d8653 !important;
  color: #fff !important;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
  background-color: #1a5c3a !important;
  border-color: #1a5c3a !important;
}
.btn-outline-primary {
  color: #2d8653 !important;
  border-color: #2d8653 !important;
  background: transparent !important;
}
.btn-outline-primary:hover {
  background-color: #2d8653 !important;
  color: #fff !important;
}
.text-primary { color: #2d8653 !important; }
a.text-primary:hover { color: #1a5c3a !important; }
.bg-primary, .badge.bg-primary { background-color: #2d8653 !important; }
.bg-label-primary { background-color: #e8f5ee !important; color: #1a5c3a !important; }
.border-primary { border-color: #2d8653 !important; }
.form-control:focus, .form-select:focus {
  border-color: #2d8653 !important;
  box-shadow: 0 0 0 .2rem rgba(45,134,83,.2) !important;
}
.form-check-input:checked {
  background-color: #2d8653 !important;
  border-color: #2d8653 !important;
}
/* Spinner */
.spinner-border.text-primary { color: #2d8653 !important; }
.spinner-grow.text-primary   { color: #2d8653 !important; }

/* =====================================================================
   4. INFO COLOUR — replace Bootstrap cyan-blue with teal-green
   ===================================================================== */
.btn-info {
  background-color: #1a9c6e !important;
  border-color: #1a9c6e !important;
  color: #fff !important;
}
.btn-info:hover, .btn-info:focus {
  background-color: #157a57 !important;
  border-color: #157a57 !important;
}
.btn-outline-info {
  color: #1a9c6e !important;
  border-color: #1a9c6e !important;
}
.btn-outline-info:hover {
  background-color: #1a9c6e !important;
  color: #fff !important;
}
.text-info { color: #1a9c6e !important; }
.bg-info    { background-color: #1a9c6e !important; }
.bg-label-info { background-color: #d4f0e7 !important; color: #0d5c40 !important; }
.alert-info {
  background-color: #d4f0e7 !important;
  border-color: #a8dfc8 !important;
  color: #0d5c40 !important;
}

/* =====================================================================
   5. TABLE HEADERS — table-primary → green
   ===================================================================== */
.table-primary,
.table-primary > th,
.table-primary > td,
thead.table-primary tr th,
thead.table-primary tr td {
  background-color: #0d3b2e !important;
  color: #fff !important;
  border-color: #1a5c3a !important;
}
.table-primary a { color: #a8dfc8 !important; }

/* General table improvements */
.table thead th,
.table > thead > tr > th {
  background-color: #0d3b2e !important;
  color: #fff !important;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  border-bottom: none !important;
  padding: 11px 14px;
}
.table td, .table th { border-color: #e8f5ee !important; vertical-align: middle; }
.table tbody tr:hover { background-color: #f2fbf6 !important; }
.table-striped > tbody > tr:nth-of-type(odd) > * { background-color: rgba(232,245,238,.35) !important; }
.table-bordered > :not(caption) > * > * { border-color: #d4edda !important; }
/* Remove blue hover background from Bootstrap table */
.table-hover > tbody > tr:hover > * { background-color: #f2fbf6 !important; }

/* =====================================================================
   6. NAV PILLS (tab navigation)
   ===================================================================== */
.nav-pills .nav-link {
  color: #5a7a6a !important;
  border-radius: 8px !important;
  padding: 8px 18px !important;
  font-size: .875rem;
  font-weight: 500;
  transition: all .15s;
}
.nav-pills .nav-link:hover {
  background-color: #e8f5ee !important;
  color: #1a5c3a !important;
}
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
  background-color: #2d8653 !important;
  color: #fff !important;
  box-shadow: 0 2px 8px rgba(45,134,83,.3) !important;
}

/* NAV TABS */
.nav-tabs .nav-link { color: #5a7a6a !important; border-color: transparent !important; }
.nav-tabs .nav-link:hover { color: #2d8653 !important; border-color: #b7dfc8 !important; }
.nav-tabs .nav-link.active {
  color: #2d8653 !important;
  border-bottom-color: #2d8653 !important;
  border-top-color: #b7dfc8 !important;
  border-left-color: #b7dfc8 !important;
  border-right-color: #b7dfc8 !important;
}

/* =====================================================================
   7. CARDS
   ===================================================================== */
.card {
  border: 1px solid #b7dfc8 !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 8px rgba(13,59,46,.06) !important;
}
.card:hover {
  box-shadow: 0 4px 14px rgba(13,59,46,.12) !important;
  transform: translateY(-1px);
  transition: all .2s ease;
  background-color: #fff !important; /* override any blue hover bg in inline styles */
}
.card-header {
  background-color: #fff !important;
  border-bottom: 1px solid #b7dfc8 !important;
  padding: 14px 20px;
}
.card-header h5, .card-header h6 { color: #1a2e25; }

/* =====================================================================
   8. MODALS — replace purple-tinted headers
   ===================================================================== */
.modal-header {
  background-color: #e8f5ee !important;
  border-bottom: 1px solid #b7dfc8 !important;
  color: #1a2e25 !important;
}
.modal-header .modal-title { color: #1a2e25 !important; }
/* Override any inline rgba(105,108,255,...) on modal headers */
[style*="105, 108, 255"],
[style*="rgba(105"] {
  background-color: #e8f5ee !important;
}

/* =====================================================================
   9. FORMS
   ===================================================================== */
.form-control, .form-select {
  border-color: #b7dfc8 !important;
  border-radius: 7px !important;
}
.form-control:not(:focus), .form-select:not(:focus) { background-color: #fff; }
.input-group-text {
  border-color: #b7dfc8 !important;
  background-color: #e8f5ee !important;
  color: #2d8653 !important;
}
.form-label { color: #3a5a4a; font-weight: 500; }

/* =====================================================================
   10. BUTTONS — misc
   ===================================================================== */
.btn { border-radius: 7px !important; font-weight: 500; }
.btn-secondary {
  background-color: #6c757d !important;
  border-color: #6c757d !important;
}
.btn-success {
  background-color: #198754 !important;
  border-color: #198754 !important;
}
.btn-success:hover { background-color: #146c43 !important; border-color: #146c43 !important; }
.btn-outline-secondary {
  color: #5a7a6a !important;
  border-color: #b7dfc8 !important;
}
.btn-outline-secondary:hover {
  background-color: #e8f5ee !important;
  color: #1a5c3a !important;
  border-color: #2d8653 !important;
}

/* =====================================================================
   11. DROPDOWNS
   ===================================================================== */
.dropdown-menu {
  border: 1px solid #b7dfc8 !important;
  box-shadow: 0 4px 16px rgba(13,59,46,.12) !important;
  border-radius: 8px !important;
}
.dropdown-item { color: #1a2e25 !important; font-size: .875rem; }
.dropdown-item:hover, .dropdown-item:focus {
  background-color: #e8f5ee !important;
  color: #1a2e25 !important;
}
.dropdown-item.active, .dropdown-item:active {
  background-color: #2d8653 !important;
  color: #fff !important;
}
.dropdown-divider { border-color: #b7dfc8 !important; }

/* =====================================================================
   12. PAGINATION
   ===================================================================== */
.page-link {
  color: #2d8653 !important;
  border-color: #b7dfc8 !important;
  border-radius: 6px !important;
}
.page-item.active .page-link {
  background-color: #2d8653 !important;
  border-color: #2d8653 !important;
  color: #fff !important;
}
.page-link:hover {
  background-color: #e8f5ee !important;
  color: #1a5c3a !important;
}

/* =====================================================================
   13. BADGES / STATUS
   ===================================================================== */
.badge { border-radius: 20px !important; font-weight: 600; padding: 4px 10px !important; }
.bg-label-success { background-color: #d4edda !important; color: #155724 !important; }
.bg-label-danger  { background-color: #fde8ea !important; color: #842029 !important; }
.bg-label-warning { background-color: #fff3cd !important; color: #664d03 !important; }
.bg-label-info    { background-color: #d4f0e7 !important; color: #0d5c40 !important; }
.bg-label-secondary { background-color: #f0f0f0 !important; color: #4a4a4a !important; }

/* =====================================================================
   14. ALERTS
   ===================================================================== */
.alert-success { background-color: #d4edda !important; border-color: #c3e6cb !important; color: #155724 !important; }
.alert-danger  { background-color: #f8d7da !important; border-color: #f5c6cb !important; color: #721c24 !important; }
.alert-warning { background-color: #fff3cd !important; border-color: #ffeeba !important; color: #856404 !important; }
.alert-info    { background-color: #d4f0e7 !important; border-color: #a8dfc8 !important; color: #0d5c40 !important; }

/* =====================================================================
   15. OFFCANVAS
   ===================================================================== */
.offcanvas-header {
  background-color: #0d3b2e !important;
  color: #fff !important;
}
.offcanvas-header .offcanvas-title { color: #fff !important; }
.offcanvas-header .btn-close { filter: invert(1); }

/* =====================================================================
   16. PAGE BACKGROUND + GLOBAL
   ===================================================================== */
.layout-page, .content-wrapper { background-color: #f5faf7 !important; }

/* Page headings */
.container h3, .container-xxl h3,
.container h4, .container-xxl h4 {
  color: #1a2e25;
}
.text-muted { color: #5a7a6a !important; }

/* =====================================================================
   17. SCROLLBAR (global)
   ===================================================================== */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #f5faf7; }
::-webkit-scrollbar-thumb { background: #b7dfc8; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #2d8653; }

/* =====================================================================
   18. MISC COMPONENT FIXES
   ===================================================================== */
/* =====================================================================
   19. GLOBAL STATUS BADGES — Active / Inactive everywhere
   ===================================================================== */
/* Utility classes used across all templates */
.st-active,
span.st-active {
  background: #d4edda !important;
  color: #155724 !important;
  border-radius: 20px !important;
  padding: 3px 11px !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}
.st-inactive,
span.st-inactive {
  background: #fde8ea !important;
  color: #842029 !important;
  border-radius: 20px !important;
  padding: 3px 11px !important;
  font-size: .72rem !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}
.st-active::before  { content: '●'; font-size: .5rem; }
.st-inactive::before { content: '●'; font-size: .5rem; }

/* Ensure plain text-success / text-danger "Active"/"Inactive" labels
   are legible — override Bootstrap's washed-out greens */
.text-success { color: #1a5c3a !important; }
.text-danger  { color: #842029 !important; }


/* Progress bars */
.progress-bar { background-color: #2d8653 !important; }
.progress { background-color: #e8f5ee !important; border-radius: 4px; }

/* Switch/toggle */
.form-switch .form-check-input:checked { background-color: #2d8653 !important; border-color: #2d8653 !important; }

/* List group */
.list-group-item.active {
  background-color: #2d8653 !important;
  border-color: #2d8653 !important;
}
.list-group-item:hover { background-color: #e8f5ee !important; }

/* Breadcrumb */
.breadcrumb-item a { color: #2d8653 !important; }
.breadcrumb-item.active { color: #5a7a6a !important; }

/* Focus outlines */
*:focus-visible {
  outline-color: #2d8653 !important;
}