/**
 * Site header: styling this module owns via render-time injection
 * (Agarwal_Header_CTA rewrites the primary "Join Community" button;
 * Agarwal_Header_Secondary_CTA un-hides + rewrites the secondary
 * "Log in" / "Membership" button) rather than editing the stored Bricks
 * header template.
 *
 * The primary button ships visible, so it already gets its look from
 * Bricks' own generated CSS. The secondary button ships in the template
 * with `_hideElementFrontend: true`, so Bricks' CSS generator skips its
 * stored style rules even once the render-time filter forces it to
 * display — these rules give it its look instead.
 *
 * Selectors are ID-based (`#brxe-<element id>`), matching how Bricks
 * actually renders these elements — a plain `class="brxe-<element id>"` (as
 * an earlier version of this file assumed) is NOT applied to a "button" /
 * "block" element; only `id="brxe-<element id>"` is (its class list is the
 * generic `brxe-button bricks-button …` / `brxe-block …`). Confirmed via
 * getComputedStyle() in a live browser session.
 */

/* Secondary button ("Log in" / "Membership") — outline style: black text,
   no fill, border color matches the PRIMARY button's own background
   (#650816), everything else (padding, font, radius) copied from the
   primary button's live computed style so the two sit visually level. */
#brxe-ykecaa {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: none;
  color: #000;
  border: 1px solid #650816;
  border-radius: 10px;
  padding: 8px 16px;
  font-family: "Poppins", inherit;
  font-size: 16px;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
  transition:
    background 0.15s ease,
    color 0.15s ease;
}

#brxe-ykecaa:hover,
#brxe-ykecaa:focus {
  background: #650816;
  color: #fff;
}

@media (max-width: 478px) {
  #brxe-ykecaa {
    font-size: 14px;
  }
}

/* Fix #10 — defensive wrap allowance: if the header's nav-menu + button row
   ever runs out of horizontal room (a longer label, a narrower viewport,
   or the extra Directory item), let it wrap onto a new line cleanly
   instead of overlapping. Not a full responsive nav redesign. */
#brxe-uukvgo {
  flex-wrap: wrap;
  row-gap: 8px;
}
