/* Alfa-ESS brand layer for telemetry UI (loads after hitech-theme.css or inline styles) */

:root {
  --brand-gold: #e8b923;
  --brand-gold-soft: rgba(232, 185, 35, 0.12);
  --brand-gold-glow: rgba(232, 185, 35, 0.14);
  --brand-bar-bg: #080808;
  --accent: var(--brand-gold);
  --accent-soft: var(--brand-gold-soft);
  --accent-glow: var(--brand-gold-glow);
  --border: rgba(232, 185, 35, 0.18);
  --border-accent: rgba(232, 185, 35, 0.32);
  --link: #f0c94a;
  --input-border: rgba(232, 185, 35, 0.22);
  --panel-glow: 0 0 32px rgba(232, 185, 35, 0.08);
}

:root[data-theme="light"] {
  --accent: #c8960f;
  --accent-soft: rgba(200, 150, 15, 0.1);
  --border: rgba(200, 150, 15, 0.22);
  --border-accent: rgba(200, 150, 15, 0.34);
  --link: #9a7200;
  --input-border: rgba(200, 150, 15, 0.28);
}

.alfa-brand-bar {
  position: sticky;
  top: 0;
  z-index: 120;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  width: 100%;
  padding: 10px 20px;
  background: var(--brand-bar-bg);
  border-bottom: 1px solid rgba(232, 185, 35, 0.24);
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28);
}

/* Full-width bar even when nested inside padded shells (dev-ui cabinet/public). */
.app-shell > .alfa-brand-bar,
.public-shell > .alfa-brand-bar,
.page > .alfa-brand-bar,
.shell > .alfa-brand-bar {
  width: calc(100% + 56px);
  max-width: none;
  margin: -28px -28px 0;
}

.alfa-brand-bar__logo {
  display: inline-flex;
  align-items: center;
  flex: 0 1 auto;
  min-width: 0;
  line-height: 0;
}

.alfa-brand-bar__logo img {
  display: block;
  height: 34px;
  width: auto;
  max-width: min(300px, 58vw);
  object-fit: contain;
  object-position: left center;
}

.alfa-brand-bar__meta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
  min-width: 0;
  text-align: right;
}

.alfa-brand-bar__tagline {
  font-family: var(--font-mono, "JetBrains Mono", ui-monospace, monospace);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.58);
}

.alfa-brand-bar__caption {
  font-size: 12px;
  color: rgba(255, 255, 255, 0.42);
}

.auth-brand-logo {
  display: inline-flex;
  align-items: center;
  width: auto;
  max-width: min(300px, 100%);
  line-height: 0;
}

.auth-brand-logo img {
  display: block;
  height: 34px;
  width: auto;
  max-width: min(300px, 58vw);
  object-fit: contain;
  object-position: left center;
}

.panel-tag,
.hero-eyebrow,
.auth-hud {
  color: rgba(232, 185, 35, 0.72);
}

:root[data-theme="light"] .panel-tag,
:root[data-theme="light"] .hero-eyebrow,
:root[data-theme="light"] .auth-hud {
  color: rgba(154, 114, 0, 0.82);
}

.hero h1,
.panel h1,
.app-title h1 {
  background: linear-gradient(135deg, #fff8e7 0%, #f0c94a 52%, #e8b923 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

:root[data-theme="light"] .hero h1,
:root[data-theme="light"] .panel h1,
:root[data-theme="light"] .app-title h1 {
  background: linear-gradient(135deg, #1a1408 0%, #9a7200 58%, #c8960f 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.brand-badge {
  border-color: rgba(232, 185, 35, 0.35);
  color: #f0c94a;
  background: rgba(20, 16, 8, 0.72);
  box-shadow: inset 0 0 20px rgba(232, 185, 35, 0.06);
}

:root[data-theme="light"] .brand-badge {
  color: #9a7200;
  background: rgba(255, 248, 230, 0.92);
  border-color: rgba(200, 150, 15, 0.28);
}

.auth-hud-dot {
  background: #e8b923;
  box-shadow: 0 0 10px rgba(232, 185, 35, 0.75);
}

:root[data-theme="light"] .auth-hud-dot {
  background: #c8960f;
  box-shadow: 0 0 8px rgba(200, 150, 15, 0.45);
}

@media (max-width: 720px) {
  .alfa-brand-bar {
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
  }

  .alfa-brand-bar__meta {
    align-items: center;
    text-align: center;
  }

  .app-shell > .alfa-brand-bar,
  .public-shell > .alfa-brand-bar,
  .page > .alfa-brand-bar,
  .shell > .alfa-brand-bar {
    width: calc(100% + 32px);
    margin: -16px -16px 0;
  }
}