/* BatteryRealData shared public header v1 */
:root {
  --brd-header-bg: #050b15;
  --brd-header-surface: #0b1727;
  --brd-header-border: #203851;
  --brd-header-text: #f4f8ff;
  --brd-header-muted: #aebbd0;
  --brd-header-cyan: #70dbef;
  --brd-header-green: #73e6b1;
  --brd-header-live: #ff6a3d;
  --brd-header-max: 1600px;
  --brd-header-logo-width: 300px;
  --brd-header-logo-height: 64px;
}

.site-header,
.app-header,
.advanced-header,
.report-header,
.brd-site-header {
  background: var(--brd-header-bg) !important;
  border-color: var(--brd-header-border) !important;
  color: var(--brd-header-text) !important;
  font-family: Inter, "Segoe UI", Arial, sans-serif !important;
  letter-spacing: 0 !important;
  box-sizing: border-box !important;
}

.site-header *,
.app-header *,
.advanced-header *,
.report-header *,
.brd-site-header * {
  box-sizing: border-box;
  letter-spacing: 0 !important;
}

/* The Live page is mounted inside an older dashboard shell. Neutralize only
   the legacy wrapper and inherited Arial rules so its header matches the site. */
body.brd-live-public-page,
body.brd-live-public-page #brd-live-command-center {
  font-family: Inter, "Segoe UI", Arial, sans-serif !important;
}

body.brd-live-public-page .brd-site-header {
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 14px !important;
}

.site-header .nav,
.app-header,
.advanced-header,
.report-header,
.brd-site-header .brd-site-nav {
  width: calc(100% - 32px) !important;
  max-width: var(--brd-header-max) !important;
  min-height: 84px !important;
  margin: 0 auto !important;
  padding: 10px 0 !important;
  align-items: center !important;
  column-gap: 18px !important;
  row-gap: 10px !important;
}

.site-header .nav,
.app-header,
.advanced-header,
.brd-site-header .brd-site-nav {
  display: grid !important;
  grid-template-columns: var(--brd-header-logo-width) minmax(0, 1fr) auto !important;
}

body.brd-live-public-page .brd-site-header .brd-site-links,
body.brd-live-public-page .brd-site-header .brd-site-links > a {
  position: static !important;
  inset: auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
}

.report-header {
  display: grid !important;
  grid-template-columns: var(--brd-header-logo-width) minmax(0, 1fr) auto !important;
}

/* The approved source image contains intentional empty canvas above and below
   the artwork. This frame removes only that empty canvas without stretching it. */
.site-header .brand.brd-canonical-wordmark,
.site-header .brand.brd-brand-wordmark,
.app-header .app-brand,
.advanced-header .advanced-brand,
.report-header .brand.brd-canonical-wordmark,
.brd-site-header .brd-site-brand.brd-canonical-wordmark {
  position: relative !important;
  display: block !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: var(--brd-header-logo-width) !important;
  min-width: var(--brd-header-logo-width) !important;
  max-width: var(--brd-header-logo-width) !important;
  height: var(--brd-header-logo-height) !important;
  min-height: var(--brd-header-logo-height) !important;
  max-height: var(--brd-header-logo-height) !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(112, 219, 239, 0.18) !important;
  border-radius: 8px !important;
  background: #040912 !important;
  flex: 0 0 var(--brd-header-logo-width) !important;
  box-shadow: none !important;
}

.site-header .brand.brd-canonical-wordmark > img,
.site-header .brand.brd-brand-wordmark > img,
.app-header .app-brand > img,
.advanced-header .advanced-brand > img,
.report-header .brand.brd-canonical-wordmark > img,
.brd-site-header .brd-site-brand.brd-canonical-wordmark > img {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  display: block !important;
  width: var(--brd-header-logo-width) !important;
  min-width: var(--brd-header-logo-width) !important;
  max-width: none !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: initial !important;
  object-position: initial !important;
  transform: translateY(-24px) !important;
}

.site-header .brand.brd-canonical-wordmark > span,
.site-header .brand.brd-brand-wordmark > span,
.report-header .brand.brd-canonical-wordmark > span,
.report-header .brand.brd-canonical-wordmark > strong,
.brd-site-header .brd-site-brand.brd-canonical-wordmark > span {
  display: none !important;
}

.site-header .nav-links,
.app-header .compare-primary-nav,
.advanced-header .advanced-site-nav,
.report-header > nav,
.brd-site-header .brd-site-links {
  position: static !important;
  inset: auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  min-width: 0 !important;
  gap: 2px !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.site-header .nav-links > a,
.app-header .compare-primary-nav > a,
.advanced-header .advanced-site-nav > a,
.report-header > nav > a,
.brd-site-header .brd-site-links > a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 8px 8px !important;
  border: 1px solid transparent !important;
  border-radius: 7px !important;
  color: var(--brd-header-muted) !important;
  background: transparent !important;
  font-family: Inter, "Segoe UI", Arial, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  box-shadow: none !important;
}

.site-header .nav-links > a:hover,
.app-header .compare-primary-nav > a:hover,
.advanced-header .advanced-site-nav > a:hover,
.report-header > nav > a:hover,
.brd-site-header .brd-site-links > a:hover {
  color: var(--brd-header-text) !important;
  border-color: rgba(112, 219, 239, 0.32) !important;
  background: #0d1a2c !important;
}

.site-header .nav-links > a.active,
.site-header .nav-links > a[aria-current="page"],
.app-header .compare-primary-nav > a.active,
.app-header .compare-primary-nav > a[aria-current="page"],
.advanced-header .advanced-site-nav > a.active,
.advanced-header .advanced-site-nav > a[aria-current="page"],
.report-header > nav > a.active,
.report-header > nav > a[aria-current="page"],
.brd-site-header .brd-site-links > a.active,
.brd-site-header .brd-site-links > a[aria-current="page"] {
  color: var(--brd-header-text) !important;
  border-color: #355474 !important;
  background: #11223a !important;
}

.site-header .nav-links > a.nav-live,
.site-header .nav-links > a.live,
.app-header .compare-primary-nav > a.live,
.advanced-header .advanced-site-nav > a.live,
.report-header > nav > a.live,
.report-header > nav > a.nav-live,
.brd-site-header .brd-site-links > a.live,
.brd-site-header .brd-site-links > a.nav-live {
  color: #ffffff !important;
  border-color: #ff7147 !important;
  background: linear-gradient(135deg, #f05343, #ff7a18) !important;
  box-shadow: 0 0 18px rgba(255, 92, 45, 0.24) !important;
}

.site-header .brd-reader-bar,
.report-header .brd-reader-bar,
.brd-site-header .brd-reader-bar {
  grid-column: 3 !important;
  grid-row: 1 !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
}

.brd-reader-switch,
.view-mode-switch {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  min-height: 42px !important;
  padding: 4px !important;
  margin: 0 !important;
  border: 1px solid #294762 !important;
  border-radius: 8px !important;
  background: #091423 !important;
  box-shadow: 0 0 16px rgba(72, 209, 225, 0.08) !important;
}

.brd-reader-switch-label {
  padding: 0 8px !important;
  color: var(--brd-header-muted) !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

.brd-reader-button,
.view-mode-switch > a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 74px !important;
  min-height: 32px !important;
  padding: 7px 10px !important;
  border: 0 !important;
  border-radius: 6px !important;
  color: var(--brd-header-muted) !important;
  background: #0d1928 !important;
  font-family: Inter, "Segoe UI", Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  box-shadow: none !important;
}

.brd-reader-button.active,
.brd-reader-button[aria-pressed="true"],
.view-mode-switch > a.is-active,
.view-mode-switch > a[aria-current="page"] {
  color: #04121e !important;
  background: linear-gradient(135deg, var(--brd-header-cyan), var(--brd-header-green)) !important;
  box-shadow: 0 0 14px rgba(112, 219, 239, 0.22) !important;
}

.app-header .compare-header-actions,
.advanced-header .advanced-actions {
  grid-column: 3 !important;
  grid-row: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  min-width: max-content !important;
  margin: 0 !important;
}

.app-header .view-mode-switch,
.advanced-header .view-mode-switch {
  position: static !important;
  inset: auto !important;
  transform: none !important;
}

.brd-lang-control {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  gap: 5px !important;
  min-height: 34px !important;
  margin: 0 0 0 3px !important;
  padding: 3px 4px 3px 8px !important;
  border: 1px solid #2a5362 !important;
  border-radius: 7px !important;
  color: var(--brd-header-muted) !important;
  background: #081523 !important;
  font-family: Inter, "Segoe UI", Arial, sans-serif !important;
  font-size: 10px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

.report-header > nav .brd-lang-control {
  margin-left: 4px !important;
}

.brd-lang-select {
  min-width: 54px !important;
  height: 28px !important;
  margin: 0 !important;
  padding: 2px 22px 2px 8px !important;
  border: 0 !important;
  border-radius: 6px !important;
  color: #04131d !important;
  background-color: #7ee6d0 !important;
  font-family: Inter, "Segoe UI", Arial, sans-serif !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
}

.nav-menu-toggle,
.brd-site-menu-toggle,
.report-menu-toggle,
.app-header #openMenu,
.advanced-menu-toggle {
  min-width: 68px !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 8px 12px !important;
  border: 1px solid #34526f !important;
  border-radius: 7px !important;
  color: var(--brd-header-text) !important;
  background: #0d1a2b !important;
  font-family: Inter, "Segoe UI", Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  box-shadow: none !important;
}

.nav-menu-toggle,
.brd-site-menu-toggle,
.report-menu-toggle,
.app-header #openMenu,
.advanced-menu-toggle {
  display: none !important;
}

@media (min-width: 1461px) and (max-width: 1650px) {
  .site-header .nav,
  .app-header,
  .advanced-header,
  .report-header,
  .brd-site-header .brd-site-nav {
    column-gap: 12px !important;
  }

  .site-header .nav-links,
  .app-header .compare-primary-nav,
  .advanced-header .advanced-site-nav,
  .report-header > nav,
  .brd-site-header .brd-site-links {
    gap: 1px !important;
  }

  .site-header .nav-links > a,
  .app-header .compare-primary-nav > a,
  .advanced-header .advanced-site-nav > a,
  .report-header > nav > a,
  .brd-site-header .brd-site-links > a {
    padding-inline: 5px !important;
    font-size: 12px !important;
  }

  .brd-lang-caption {
    display: none !important;
  }

  .brd-lang-control {
    margin-left: 0 !important;
    padding: 3px !important;
  }
}

@media (max-width: 1460px) {
  .site-header .nav,
  .app-header,
  .advanced-header,
  .report-header,
  .brd-site-header .brd-site-nav {
    grid-template-columns: var(--brd-header-logo-width) minmax(0, 1fr) auto !important;
  }

  .site-header .nav-links,
  .app-header .compare-primary-nav,
  .advanced-header .advanced-site-nav,
  .report-header > nav,
  .brd-site-header .brd-site-links {
    display: none !important;
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    padding: 10px !important;
    border: 1px solid var(--brd-header-border) !important;
    border-radius: 8px !important;
    background: #081322 !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 6px !important;
  }

  .site-header.nav-open .nav-links,
  .site-header .nav.nav-open .nav-links,
  .report-header.report-nav-open > nav,
  .brd-site-header.brd-site-nav-open .brd-site-links,
  .brd-site-header .brd-site-nav.brd-site-nav-open .brd-site-links,
  .advanced-header.is-menu-open .advanced-site-nav {
    display: grid !important;
  }

  .app-header .compare-primary-nav {
    display: none !important;
  }

  .site-header .brd-reader-bar,
  .report-header .brd-reader-bar,
  .brd-site-header .brd-reader-bar {
    grid-column: 2 !important;
    grid-row: 1 !important;
  }

  .site-header .nav-menu-toggle,
  .brd-site-header .brd-site-menu-toggle,
  .report-header .report-menu-toggle,
  .app-header #openMenu,
  .advanced-menu-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    grid-column: 3 !important;
    grid-row: 1 !important;
  }

  .site-header .nav-links > a,
  .app-header .compare-primary-nav > a,
  .advanced-header .advanced-site-nav > a,
  .report-header > nav > a,
  .brd-site-header .brd-site-links > a {
    width: 100% !important;
    min-height: 42px !important;
    border-color: #1d344b !important;
    background: #0b1929 !important;
  }

  .app-header .compare-header-actions,
  .advanced-header .advanced-actions {
    grid-column: 2 / 4 !important;
    justify-content: flex-end !important;
  }
}

@media (max-width: 700px) {
  :root {
    --brd-header-logo-width: 220px;
    --brd-header-logo-height: 48px;
  }

  .site-header .nav,
  .app-header,
  .advanced-header,
  .report-header,
  .brd-site-header .brd-site-nav {
    width: calc(100% - 20px) !important;
    min-height: 68px !important;
    padding: 9px 0 !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    column-gap: 8px !important;
    row-gap: 8px !important;
  }

  .site-header .brand.brd-canonical-wordmark,
  .site-header .brand.brd-brand-wordmark,
  .app-header .app-brand,
  .advanced-header .advanced-brand,
  .report-header .brand.brd-canonical-wordmark,
  .brd-site-header .brd-site-brand.brd-canonical-wordmark {
    grid-column: 1 !important;
    width: var(--brd-header-logo-width) !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: var(--brd-header-logo-height) !important;
    min-height: var(--brd-header-logo-height) !important;
    max-height: var(--brd-header-logo-height) !important;
  }

  .site-header .brand.brd-canonical-wordmark > img,
  .site-header .brand.brd-brand-wordmark > img,
  .app-header .app-brand > img,
  .advanced-header .advanced-brand > img,
  .report-header .brand.brd-canonical-wordmark > img,
  .brd-site-header .brd-site-brand.brd-canonical-wordmark > img {
    width: var(--brd-header-logo-width) !important;
    min-width: var(--brd-header-logo-width) !important;
    transform: translateY(-17px) !important;
  }

  .site-header .nav-menu-toggle,
  .brd-site-header .brd-site-menu-toggle,
  .report-header .report-menu-toggle,
  .app-header #openMenu,
  .advanced-menu-toggle {
    grid-column: 2 !important;
    grid-row: 1 !important;
    min-width: 48px !important;
    width: 48px !important;
    padding: 8px !important;
  }

  .site-header .brd-reader-bar,
  .report-header .brd-reader-bar,
  .brd-site-header .brd-reader-bar,
  .app-header .compare-header-actions,
  .advanced-header .advanced-actions {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    justify-content: flex-end !important;
  }

  .site-header .nav-links,
  .advanced-header .advanced-site-nav,
  .report-header > nav,
  .brd-site-header .brd-site-links {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .brd-reader-switch,
  .view-mode-switch {
    width: 100% !important;
  }

  .brd-reader-button,
  .view-mode-switch > a {
    flex: 1 1 0 !important;
  }

  .app-header .compare-header-actions,
  .advanced-header .advanced-actions {
    min-width: 0 !important;
  }

  .app-header .compare-header-actions .brd-lang-control,
  .advanced-header .advanced-actions .brd-lang-control {
    margin-left: auto !important;
  }
}

@media (max-width: 420px) {
  :root {
    --brd-header-logo-width: 196px;
    --brd-header-logo-height: 44px;
  }

  .site-header .brand.brd-canonical-wordmark > img,
  .site-header .brand.brd-brand-wordmark > img,
  .app-header .app-brand > img,
  .advanced-header .advanced-brand > img,
  .report-header .brand.brd-canonical-wordmark > img,
  .brd-site-header .brd-site-brand.brd-canonical-wordmark > img {
    transform: translateY(-15px) !important;
  }

  .brd-reader-switch-label {
    display: none !important;
  }
}
