/* ProfitPal Brand Tokens (global) */
:root {
  --profitpal-primary: #32cd32;
  --profitpal-bg: #0a0e27;
  --profitpal-text: #ffffff;
}

/* ============================================================================
   ProfitPal Logo Styling (centralized)
   - Only swap /static/brand/logo.svg to change the logo everywhere
   ============================================================================ */

#pp-logo, .pp-logo, .logo-container {
  display: inline-block;
  line-height: 0;
}

#pp-logo svg, .pp-logo svg, .logo-container svg {
  display: block;
  width: 100%;
  max-width: 180px;
  height: auto;
  transition: transform 160ms ease, filter 220ms ease, opacity 160ms ease;
  will-change: transform, filter;
}

/* Slightly smaller inside tight headers */
.header #pp-logo svg,
.header .pp-logo svg,
.nav-header #pp-logo svg,
.nav-header .pp-logo svg {
  max-width: 160px;
}

/* Hover glow */
#pp-logo:hover svg,
.pp-logo:hover svg,
.logo-container:hover svg {
  transform: translateY(-1px);
  filter: drop-shadow(0 0 10px rgba(255, 215, 0, 0.55));
}

/* Mobile */
@media (max-width: 768px) {
  #pp-logo svg, .pp-logo svg, .logo-container svg { max-width: 140px; }
}
@media (max-width: 480px) {
  #pp-logo svg, .pp-logo svg, .logo-container svg { max-width: 120px; }
}


/* ------------------------------------------------------------
   Global top offset (fixed banners)
   brand.js sets --pp-top-offset to banner height automatically
------------------------------------------------------------ */
:root { --pp-top-offset: 0px; }

/* Most pages already use padding-top:60px; this keeps it and adds banner offset */
body { padding-top: calc(60px + var(--pp-top-offset)) !important; }

/* Public pages unified topbar (if inserted) */
.pp-public-topbar{
  position: fixed;
  left: 0; right: 0;
  top: var(--pp-top-offset);
  height: 60px;
  z-index: 3000;
  display: flex;
  align-items: center;
  padding: 0 18px;
  backdrop-filter: blur(10px);
}
.pp-public-topbar .logo-container{ width: 170px; height: 40px; }

/* ============================================================================

/* ============================================================================
   SVG Color Control via CSS
   ============================================================================ */

/* Красим текстовые path (БЕЗ fill="white") через CSS */
#pp-logo svg path:not([fill="white"]),
.pp-logo svg path:not([fill="white"]),
.logo-container svg path:not([fill="white"]) {
  fill: var(--profitpal-primary) !important;
}