/* =========================================================
   NodeGlobalPay – BTCPay Server Custom Theme (LIGHT)
   - Fixes low-contrast menus
   - Hides BTCPay branding text/logo where possible (CSS-only)
   - Uses NodeGlobalPay Blue as accent
   - Optional auto-dark via prefers-color-scheme (minimal)
   ========================================================= */

:root{
  --ngp-blue:#139CFF;          /* primary accent */
  --ngp-blue-2:#0B7FD6;        /* hover/active */
  --ngp-bg:#F6F8FB;            /* app background */
  --ngp-surface:#FFFFFF;       /* cards / panels */
  --ngp-border:#E6EAF0;
  --ngp-text:#0B1220;
  --ngp-muted:#5B677A;
  --ngp-sidebar:#FFFFFF;
  --ngp-sidebar-border:#E6EAF0;
  --ngp-radius:14px;
  --ngp-shadow:0 10px 30px rgba(12, 20, 33, .08);
}

/* ---------- Global base ---------- */
html, body{
  background: var(--ngp-bg) !important;
  color: var(--ngp-text) !important;
}

a{ color: var(--ngp-blue) !important; }
a:hover{ color: var(--ngp-blue-2) !important; }

/* Buttons */
.btn-primary,
button.btn-primary,
input[type="submit"].btn-primary{
  background: var(--ngp-blue) !important;
  border-color: var(--ngp-blue) !important;
  border-radius: 12px !important;
  box-shadow: 0 6px 18px rgba(19,156,255,.22) !important;
}
.btn-primary:hover,
button.btn-primary:hover,
input[type="submit"].btn-primary:hover{
  background: var(--ngp-blue-2) !important;
  border-color: var(--ngp-blue-2) !important;
}

.btn, button, .btn-secondary{
  border-radius: 12px !important;
}

/* Inputs */
.form-control, input, select, textarea{
  border-radius: 12px !important;
  border-color: var(--ngp-border) !important;
}
.form-control:focus, input:focus, select:focus, textarea:focus{
  border-color: rgba(19,156,255,.55) !important;
  box-shadow: 0 0 0 4px rgba(19,156,255,.12) !important;
}

/* Cards / panels */
.card, .panel, .tile, .modal-content, .dropdown-menu{
  border-radius: var(--ngp-radius) !important;
  border-color: var(--ngp-border) !important;
  box-shadow: var(--ngp-shadow) !important;
}

/* ---------- Sidebar / left navigation (fix black-on-black) ---------- */
/* These selectors vary across BTCPay versions; we intentionally cover common ones. */
.sidebar, .side-nav, .navbar-vertical, .main-nav, #sidebar, .btcpay-sidebar{
  background: var(--ngp-sidebar) !important;
  border-right: 1px solid var(--ngp-sidebar-border) !important;
}

/* Nav links */
.sidebar a, .side-nav a, .navbar-vertical a, #sidebar a, .btcpay-sidebar a,
.sidebar .nav-link, .side-nav .nav-link, .navbar-vertical .nav-link, #sidebar .nav-link{
  color: var(--ngp-text) !important;
  opacity: 1 !important;
}

.sidebar a:hover, .side-nav a:hover, .navbar-vertical a:hover, #sidebar a:hover,
.sidebar .nav-link:hover, .side-nav .nav-link:hover, .navbar-vertical .nav-link:hover, #sidebar .nav-link:hover{
  color: var(--ngp-blue-2) !important;
  background: rgba(19,156,255,.08) !important;
  border-radius: 12px !important;
}

.sidebar .nav-link.active,
.side-nav .nav-link.active,
.navbar-vertical .nav-link.active,
#sidebar .nav-link.active{
  color: var(--ngp-blue) !important;
  background: rgba(19,156,255,.12) !important;
  border-radius: 12px !important;
}

/* Section headings in nav */
.sidebar .nav-header, .side-nav .nav-header, .navbar-vertical .nav-header, #sidebar .nav-header,
.sidebar .text-muted, .side-nav .text-muted, .navbar-vertical .text-muted, #sidebar .text-muted{
  color: var(--ngp-muted) !important;
  opacity: 1 !important;
}

/* Top bar */
.navbar, .top-nav, header.navbar{
  background: var(--ngp-surface) !important;
  border-bottom: 1px solid var(--ngp-border) !important;
}

/* ---------- Hide BTCPay branding (CSS-only) ---------- */
/* IMPORTANT: This only hides UI elements. It does NOT remove branding from:
   - emails generated by BTCPay
   - PDFs/receipts you export
   - server title in metadata
   For full removal/white-label you would need to build/modify BTCPay source. */

/* Logo/brand text in sidebar/topbar */
.navbar-brand,
.brand, .brand-logo, .btcpay-brand, .btcpay-logo,
a.navbar-brand, .logo, .site-logo, .app-logo{
  /* keep space minimal */
}

/* Try to hide any visible 'BTCPay' wordmarks */
.navbar-brand span,
.navbar-brand .text,
.brand span, .brand .text,
.btcpay-brand span, .btcpay-brand .text,
.btcpay-logo-text,
#btcpay-logo-text{
  display:none !important;
}

/* If there's a BTCPay logo SVG/image inside brand area, hide it so only your uploaded logo shows */
.navbar-brand svg,
.brand svg,
.btcpay-brand svg{
  display:none !important;
}

/* Public footer links sometimes show BTCPay; hide common footer branding blocks */
footer .btcpay, footer .btcpay-footer, footer .btcpayserver, .footer .btcpay, .footer .btcpayserver{
  display:none !important;
}

/* Login/register page logo area (hide BTCPay default mark; your uploaded logo still shows if set in Branding) */
.auth-logo, .login-logo, .account-logo, .register-logo,
.auth__logo, .login__logo, .register__logo,
#Login .logo, #Register .logo{
  /* nothing */
}
.auth-logo svg, .login-logo svg, .account-logo svg, .register-logo svg,
.auth__logo svg, .login__logo svg, .register__logo svg{
  display:none !important;
}

/* Make auth pages match the light theme */
body.auth, body.login, body.register,
.auth-page, .login-page, .register-page{
  background: var(--ngp-bg) !important;
}
.auth-card, .login-card, .register-card, .auth-container .card{
  border-radius: 18px !important;
  box-shadow: var(--ngp-shadow) !important;
}

/* ---------- Nice touches ---------- */
.badge-primary{ background: rgba(19,156,255,.14) !important; color: var(--ngp-blue-2) !important; }
.progress-bar{ background-color: var(--ngp-blue) !important; }
.alert-success{ border-radius: 12px !important; }
.table{ color: var(--ngp-text) !important; }
.table thead th{ color: var(--ngp-muted) !important; }

/* ---------- Optional auto-dark for users who have dark OS theme ---------- */
/* You said you want LIGHT as default; this keeps light unless the user's system is dark. */
@media (prefers-color-scheme: dark){
  :root{
    --ngp-bg:#0B1220;
    --ngp-surface:#111A2B;
    --ngp-border:#1E2A42;
    --ngp-text:#EAF0FA;
    --ngp-muted:#9FB0C8;
    --ngp-sidebar:#0F1728;
    --ngp-sidebar-border:#1E2A42;
  }
  html, body{ background: var(--ngp-bg) !important; color: var(--ngp-text) !important; }
  .card, .panel, .tile, .modal-content, .dropdown-menu{ box-shadow: 0 10px 30px rgba(0,0,0,.35) !important; }
  .sidebar a, .side-nav a, .navbar-vertical a, #sidebar a,
  .sidebar .nav-link, .side-nav .nav-link, .navbar-vertical .nav-link, #sidebar .nav-link{
    color: var(--ngp-text) !important;
  }
}