/**
 * Platform header grammar — manager, marketing, and shared statement headers.
 * Pairs with templates/partials/manager_operator_topbar.html and rmc_brand_mark.
 */

:root {
  --rmc-brand-navy: #002147;
  --rmc-brand-gold: #d4af37;
  /* Gold that is legible as TEXT on a light surface. Same hue (45.9deg) and
     saturation (64.6%) as --rmc-brand-gold; lightness 52.4% -> 30%. Measured
     WCAG 2.1 contrast: 5.11:1 on the marketing cream #FAF7F2, 5.46:1 on
     #FFFFFF, 4.69:1 on #F2EDE4 -- AA (4.5:1) on every light marketing
     surface. --rmc-brand-gold itself is 1.97:1 on that cream, below even the
     3:1 large-text floor, so it can only be used on dark chrome (8.48:1 on the
     marketing dark #1A1715, 7.63:1 on --rmc-brand-navy). */
  --rmc-brand-gold-ink: #7e671b;
  /* Surface-resolved gold for wordmark TEXT. Dark chrome (templates/base.html
     .navbar-dark, .cp-navbar) is the historic default, so this resolves to the
     bright gold; light surfaces re-point it below. */
  --rmc-brand-gold-text: var(--rmc-brand-gold);
  --rmc-manager-header-height: calc(64px * 1.1); /* v4.01.43 +10% platform header band */
  --rmc-platform-header-pad-x: 1.25rem;
  --rmc-header-control-height: 2.375rem;
  --rmc-header-control-radius: 999px;
}

/* === Unified control-plane chrome (topbar + primary nav) ================= */

.rmc-control-plane-chrome {
  position: sticky;
  top: 0;
  z-index: 1030;
  flex-shrink: 0;
}

.rmc-control-plane-chrome .cp-navbar.statement-header {
  min-height: var(--rmc-manager-header-height);
  padding: 0.5rem var(--rmc-platform-header-pad-x);
  border-bottom: 1px solid color-mix(in oklab, var(--color-base-0) 8%, transparent);
}

.rmc-control-plane-chrome .cp-primary-nav {
  padding-block: 0.5rem;
}

.rmc-control-plane-chrome__top {
  display: flex;
  align-items: center;
  width: 100%;
}

/* === Manager topbar layout ================================================= */

.rmc-platform-header {
  display: block;
  width: 100%;
  flex-shrink: 0;
}

.rmc-platform-header__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  width: 100%;
}

.rmc-platform-header__brand {
  flex: 0 0 auto;
  min-width: 0;
  display: flex;
  align-items: center;
}

/* Search + Studio/Config/actions share one horizontal control row (v3.42.6). */
.rmc-platform-header__toolbar {
  display: flex;
  flex: 1 1 12rem;
  align-items: center;
  gap: 0.65rem 0.85rem;
  min-width: 0;
  order: 3;
  width: 100%;
}

.rmc-platform-header__command {
  flex: 1 1 auto;
  min-width: 10rem;
  max-width: none;
  display: flex;
  align-items: center;
  min-height: var(--rmc-header-control-height);
}

.rmc-platform-header__context {
  flex: 0 1 auto;
  min-width: 0;
  align-self: center;
}

.rmc-platform-header__actions {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem 0.45rem;
  flex: 0 0 auto;
  min-height: var(--rmc-header-control-height);
}

@media (min-width: 768px) {
  .rmc-platform-header__inner {
    flex-wrap: nowrap;
    gap: 0 1rem;
  }

  .rmc-platform-header__toolbar {
    order: unset;
    width: auto;
    margin-inline-start: auto;
    justify-content: flex-end;
  }
}

@media (min-width: 992px) {
  .rmc-platform-header__inner {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 0 1.25rem;
  }

  .rmc-platform-header__brand {
    grid-column: 1;
    grid-row: 1;
  }

  .rmc-platform-header__toolbar {
    grid-column: 2;
    grid-row: 1;
    margin-inline-start: 0;
    max-width: none;
  }

  [data-rmc-platform-header="manager"] .rmc-platform-header__command {
    flex: 1 1 auto;
    max-width: min(36rem, 48vw);
    margin-inline-end: 0.25rem;
  }
}

@media (min-width: 1200px) {
  [data-rmc-platform-header="manager"] .rmc-platform-header__command {
    max-width: 40rem;
  }
}

/* Command search — same height + radius family as chips/icon buttons */
.cp-navbar .cp-header-search.cp-topbar-search-wrap {
  width: 100%;
  display: flex;
  align-items: center;
  min-height: var(--rmc-header-control-height);
}

.cp-navbar .cp-topbar-search-input {
  height: var(--rmc-header-control-height);
  min-height: var(--rmc-header-control-height);
  padding: 0 4.25rem 0 1rem;
  border-radius: var(--rmc-header-control-radius);
  font-size: var(--type-size-body-sm, 0.875rem);
  box-sizing: border-box;
  background: rgba(255, 255, 255, 0.06); /* off-token-allow: white-overlay */
  border: 1px solid rgba(255, 255, 255, 0.10); /* off-token-allow: white-overlay */
  color: rgba(255, 255, 255, 0.92); /* off-token-allow: white-overlay */
}

.cp-navbar .cp-topbar-search-input::placeholder {
  color: rgba(255, 255, 255, 0.55); /* off-token-allow: white-overlay */
}

.cp-navbar .cp-topbar-search-input:focus {
  background: rgba(255, 255, 255, 0.10); /* off-token-allow: white-overlay */
  border-color: rgba(129, 140, 248, 0.55); /* off-token-allow: rgba-decorative */
  box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.18);
  outline: none;
  color: #ffffff; /* off-token-allow: hex-literal-decorative */
}

.cp-navbar .cp-search-kbd {
  position: absolute;
  right: 0.5rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0.65rem;
  opacity: 0.72;
  pointer-events: none;
  font-family: var(--bs-font-monospace, ui-monospace, monospace);
  padding: 0.15rem 0.4rem;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.06); /* off-token-allow: white-overlay */
  border: 1px solid rgba(255, 255, 255, 0.14); /* off-token-allow: white-overlay */
  color: rgba(255, 255, 255, 0.78); /* off-token-allow: white-overlay */
  line-height: 1;
  user-select: none;
}

.cp-topbar-search-wrap .cp-topbar-search-input:focus ~ .cp-search-kbd[data-rmc-hide-when-focused] {
  opacity: 0;
}

/* Icon-only utility cluster — v4.01.08: removed `.cp-navbar .cp-topbar-theme-toggle`
   (toggle hoisted to `.rmc-header-theme-chip` in v4.01.07). */
.rmc-platform-header__icon-btn,
.cp-navbar .cp-topbar-bell {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--rmc-header-control-height);
  height: var(--rmc-header-control-height);
  min-height: var(--rmc-header-control-height);
  padding: 0;
  border-radius: var(--rmc-header-control-radius);
  box-sizing: border-box;
}

.rmc-platform-header__icon-btn .bi {
  font-size: 1.05rem;
}

.rmc-platform-header__icon-btn--mfa-warn {
  border-color: color-mix(in oklab, var(--warning) 55%, var(--hairline));
  color: var(--warning);
  box-shadow: 0 0 0 2px color-mix(in oklab, var(--warning) 18%, transparent);
}

.rmc-platform-header__icon-btn--mfa-warn:hover,
.rmc-platform-header__icon-btn--mfa-warn:focus-visible {
  border-color: var(--warning);
  color: var(--warning);
  background: color-mix(in oklab, var(--warning) 12%, transparent);
}

.rmc-platform-header__chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  height: var(--rmc-header-control-height);
  min-height: var(--rmc-header-control-height);
  padding: 0 0.75rem;
  border-radius: var(--rmc-header-control-radius);
  box-sizing: border-box;
  font-size: var(--type-size-caption, 0.8125rem);
  font-weight: 500;
  white-space: nowrap; /* horizontal-overflow-risk-allow: short-pill-content-bounded */
}

/* Compact operator identity pill — aligns with search + utility chips */
.cp-navbar .user-dropdown-wrapper {
  display: flex;
  align-items: center;
  align-self: center;
}

.cp-navbar .user-dropdown-trigger {
  min-height: var(--rmc-header-control-height);
  max-height: calc(var(--rmc-header-control-height) + 0.125rem);
  padding: 0.2rem 0.65rem 0.2rem 0.35rem;
  gap: 0.5rem;
  border-radius: var(--rmc-header-control-radius);
}

.cp-navbar .user-dropdown-trigger .user-avatar,
.cp-navbar .user-dropdown-trigger .user-avatar .avatar-placeholder,
.cp-navbar .user-dropdown-trigger .user-avatar img {
  width: 1.75rem;
  height: 1.75rem;
  min-width: 1.75rem;
  min-height: 1.75rem;
}

.cp-navbar .user-dropdown-trigger .user-info {
  line-height: 1.15;
}

.cp-navbar .user-dropdown-trigger .user-name {
  font-size: var(--type-size-caption, 0.8125rem);
}

.cp-navbar .user-dropdown-trigger .user-role-badge {
  font-size: var(--type-size-micro, 0.6875rem);
}

/* === Manager brand lockup — inline / compact / mark-only =================== */

[data-rmc-platform-header="manager"] .rmc-brand-mark--lockup,
[data-rmc-platform-header="manager"] .rmc-brand-mark--lockup-inline {
  align-items: center;
  gap: 0.65rem;
}

[data-rmc-platform-header="manager"] .rmc-brand-mark__wordmark {
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.5rem;
  line-height: 1;
}

[data-rmc-platform-header="manager"] .rmc-brand-mark__title--platform {
  display: inline-flex;
  align-items: baseline;
  gap: 0;
  font-size: calc(var(--rmc-bm-size, 40px) * 0.42);
  white-space: nowrap; /* horizontal-overflow-risk-allow: short-controlled-content-by-design */
}

[data-rmc-platform-header="manager"] .rmc-brand-mark__badge {
  margin-top: 0;
  align-self: center;
  flex-shrink: 0;
  height: var(--rmc-header-control-height);
  min-height: var(--rmc-header-control-height);
  padding: 0 0.55rem;
  display: inline-flex;
  align-items: center;
  border-radius: var(--rmc-header-control-radius);
  font-size: var(--type-size-micro, 0.6875rem);
  letter-spacing: 0.08em;
}

/* Option B — compact lockup (tablet / small desktop) */
@media (min-width: 768px) and (max-width: 1199.98px) {
  [data-rmc-platform-header="manager"] .rmc-brand-mark {
    --rmc-bm-size: 32px;
  }

  [data-rmc-platform-header="manager"] .rmc-brand-mark__title--platform {
    font-size: 0.95rem;
  }

  [data-rmc-platform-header="manager"] .rmc-brand-mark__badge {
    font-size: 0.625rem;
    padding-inline: 0.45rem;
  }
}

/* Option C — mark + surface badge only (mobile) */
@media (max-width: 767.98px) {
  [data-rmc-platform-header="manager"] .rmc-brand-mark__title--platform {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  [data-rmc-platform-header="manager"] .rmc-brand-mark__wordmark {
    gap: 0.35rem;
  }
}

/* Mobile: stack toolbar — search full width above action chips */
@media (max-width: 767.98px) {
  [data-rmc-platform-header="manager"] .rmc-platform-header__toolbar {
    flex-direction: column;
    align-items: stretch;
    gap: 0.5rem;
  }

  [data-rmc-platform-header="manager"] .rmc-platform-header__actions {
    flex-wrap: wrap;
    width: 100%;
  }
}

/* === Platform wordmark (RUN + MY + CAMPUS) ================================= */

.rmc-brand-mark__title--platform {
  display: inline-flex;
  align-items: baseline;
  gap: 0;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1;
}

.rmc-brand-word--navy {
  color: var(--rmc-brand-navy, #002147);
}

/* The editorial marketing surface paints on cream, where the bright gold
   fails contrast; resolve gold text to the ink variant there. Dark marketing
   (data-resolved-theme="dark", body #1A1715) goes back to the bright gold.
   [data-mkt-edition] sits on BOTH <html> and <body>, so the dark override has
   to name both to beat the body-level declaration. */
[data-mkt-edition] {
  --rmc-brand-gold-text: var(--rmc-brand-gold-ink);
}

html[data-resolved-theme="dark"][data-mkt-edition],
html[data-resolved-theme="dark"] [data-mkt-edition] {
  --rmc-brand-gold-text: var(--rmc-brand-gold);
}

.rmc-brand-word--gold {
  color: var(--rmc-brand-gold-text, var(--rmc-brand-gold, #d4af37));
}

.cp-navbar .rmc-brand-mark__title--platform .rmc-brand-word--navy,
.cp-navbar .rmc-brand-mark__title--platform .rmc-brand-word--gold,
.mkt-navbar .rmc-brand-mark__title--platform .rmc-brand-word--navy,
.mkt-navbar .rmc-brand-mark__title--platform .rmc-brand-word--gold {
  color: inherit;
}

.cp-navbar .rmc-brand-mark__title--platform .rmc-brand-word--navy,
[data-resolved-theme="dark"] .cp-navbar .rmc-brand-mark__title--platform .rmc-brand-word--navy {
  color: color-mix(in oklab, var(--color-base-0) 95%, var(--rmc-brand-navy));
}

.cp-navbar .rmc-brand-mark__title--platform .rmc-brand-word--gold,
[data-resolved-theme="dark"] .cp-navbar .rmc-brand-mark__title--platform .rmc-brand-word--gold {
  color: var(--rmc-brand-gold);
}

.mkt-navbar .rmc-brand-mark__title--platform .rmc-brand-word--navy {
  color: var(--rmc-brand-navy);
}

.mkt-navbar .rmc-brand-mark__title--platform .rmc-brand-word--gold {
  color: var(--rmc-brand-gold-text);
}

html[data-resolved-theme="dark"] .mkt-navbar .rmc-brand-mark__title--platform .rmc-brand-word--navy {
  color: color-mix(in oklab, var(--color-base-0) 92%, var(--rmc-brand-navy));
}

/* Surface badge (Manager / Portal / etc.) — default stacked lockups */
.rmc-brand-mark__badge {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  margin-top: 0.2em;
  padding: 0.12em 0.45em;
  border-radius: 4px;
  font-size: calc(var(--rmc-bm-size, 32px) * 0.28);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  line-height: 1.2;
  background: color-mix(in oklab, var(--rmc-brand-gold) 22%, transparent);
  color: var(--rmc-brand-gold);
  border: 1px solid color-mix(in oklab, var(--rmc-brand-gold) 45%, transparent);
}

.cp-navbar .rmc-brand-mark__badge {
  background: rgba(212, 175, 55, 0.18); /* off-token-allow: brand-gold-tint */
  color: var(--rmc-brand-gold);
  border-color: rgba(212, 175, 55, 0.35); /* off-token-allow: brand-gold-tint */
}

/* Logo image in squircle — full shield reads cleanly */
.rmc-brand-mark--has-image .rmc-brand-mark__squircle {
  padding: calc(var(--rmc-bm-size, 32px) * 0.06);
}

.rmc-brand-mark--has-image .rmc-brand-mark__tenant-logo {
  object-fit: contain;
}

/* Marketing header brand alignment */
.mkt-navbar .rmc-brand-mark--lockup {
  gap: 0.75rem;
}

.mkt-platform-header .mkt-navbar.statement-header {
  background: linear-gradient(
    180deg,
    var(--rmc-brand-navy, #002147) 0%,
    color-mix(in oklab, var(--rmc-brand-navy, #002147) 88%, #000) 100%
  ); /* theme-locked-allow: brand-navy-gradient */
}

/* Marketing footer seal — platform wordmark on cream surface */
.mkt-footer-seal__wordmark--platform {
  display: inline-flex;
  align-items: baseline;
  font-weight: 800;
  letter-spacing: -0.02em;
  font-size: 1.25rem;
  line-height: 1;
}

.mkt-footer-seal__logo {
  object-fit: contain;
}

/* === Unified appearance controls (v4.01.43) ===============================
   Authenticated: profile dropdown via components/user_dropdown.html.
   Anonymous marketing: nav drawer. Anonymous base: palette dropdown.
*/
.rmc-header-theme-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  transition: opacity 200ms var(--lux-spring-curve, cubic-bezier(0.34, 1.56, 0.64, 1));
}

.rmc-header-theme-chip__group {
  display: inline-flex;
  align-items: center;
}

.rmc-header-theme-chip__segmented {
  height: var(--rmc-header-control-height, 2.375rem);
  border-radius: var(--rmc-header-control-radius, 999px);
  overflow: hidden;
}

.rmc-header-theme-chip__segmented .btn {
  height: var(--rmc-header-control-height, 2.375rem);
  min-height: var(--rmc-header-control-height, 2.375rem);
  padding-inline: 0.55rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  transition: background-color 180ms var(--lux-spring-curve, cubic-bezier(0.34, 1.56, 0.64, 1)),
              color 180ms var(--lux-spring-curve, cubic-bezier(0.34, 1.56, 0.64, 1));
}

.rmc-header-theme-chip__segmented .btn .bi {
  font-size: 1rem;
}

/* Manager (dark) header: chip inherits the same overlay rule the legacy
   cp-topbar-theme-toggle used so visual continuity holds on /super/ + /admin/. */
[data-rmc-platform-header="manager"] .rmc-header-theme-chip__segmented .btn {
  background: rgba(255, 255, 255, 0.06); /* off-token-allow: white-overlay */
  border-color: rgba(255, 255, 255, 0.10); /* off-token-allow: white-overlay */
  color: rgba(255, 255, 255, 0.92); /* off-token-allow: white-overlay */
}

[data-rmc-platform-header="manager"] .rmc-header-theme-chip__segmented .btn:hover,
[data-rmc-platform-header="manager"] .rmc-header-theme-chip__segmented .btn:focus-visible,
[data-rmc-platform-header="manager"] .rmc-header-theme-chip__segmented .btn.active {
  background: rgba(255, 255, 255, 0.14); /* off-token-allow: white-overlay */
  color: #ffffff; /* off-token-allow: hex-literal-decorative */
}

/* Hide the aesthetic group on narrow viewports in header context only — dropdown
   and nav-drawer layouts always show the full control set. */
@media (max-width: 991.98px) {
  .rmc-header-theme-chip:not(.rmc-header-theme-chip--dropdown):not(.rmc-header-theme-chip--nav-drawer) .rmc-aesthetic-toggle-row {
    display: none;
  }
}

/* === Profile dropdown appearance panel (v4.01.43) ========================= */
.user-dropdown-menu .user-dropdown-appearance {
  min-width: 15rem;
}

.rmc-header-theme-chip--dropdown,
.rmc-header-theme-chip--nav-drawer {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.5rem;
  width: 100%;
}

.rmc-header-theme-chip--dropdown .rmc-header-theme-chip__group,
.rmc-header-theme-chip--nav-drawer .rmc-header-theme-chip__group {
  width: 100%;
}

.rmc-header-theme-chip--dropdown .rmc-header-theme-chip__segmented,
.rmc-header-theme-chip--nav-drawer .rmc-header-theme-chip__segmented {
  display: flex;
  width: 100%;
}

.rmc-header-theme-chip--dropdown .rmc-header-theme-chip__segmented .btn,
.rmc-header-theme-chip--nav-drawer .rmc-header-theme-chip__segmented .btn {
  flex: 1 1 0;
  min-width: 0;
}

.mkt-nav-appearance .rmc-header-theme-chip--nav-drawer .rmc-header-theme-chip__segmented .btn {
  background: rgba(255, 255, 255, 0.06); /* off-token-allow: white-overlay */
  border-color: rgba(255, 255, 255, 0.10); /* off-token-allow: white-overlay */
  color: rgba(255, 255, 255, 0.92); /* off-token-allow: white-overlay */
}

