/* Conjurly UI BuddyBoss Layer
   BuddyBoss/BuddyPress-specific UI ownership only.
   v0.1.4
*/

/* Map BuddyBoss CSS variables to Conjurly tokens */
body{
  --bb-block-radius: var(--cj-radius-card) !important;
  --bb-content-border-color: var(--cj-border-light) !important;
  --bb-content-background-color: var(--cj-surface-card, #fff) !important;
}

/* =========================================================
   BuddyPress / BuddyBoss — Vertical Profile Nav
   ========================================================= */
.buddypress nav#object-nav.bb-single-main-nav--vertical{
  background: var(--bb-content-background-color) !important;
  border: 1px solid var(--bb-content-border-color) !important;
  border-radius: var(--bb-block-radius) !important;
  overflow: hidden;
  margin-top: 0 !important;
  padding: 14px 14px 12px 0 !important;
}

.buddypress nav#object-nav.bb-single-main-nav--vertical li{
  border: 0 !important;
}

.buddypress nav#object-nav.bb-single-main-nav--vertical li a{
  margin: 0 !important;
  border-left: 0 !important;
  border-radius: 0 var(--bb-block-radius) var(--bb-block-radius) 0 !important;
}

.buddypress nav#object-nav.bb-single-main-nav--vertical li.current > a,
.buddypress nav#object-nav.bb-single-main-nav--vertical li.selected > a,
.buddypress nav#object-nav.bb-single-main-nav--vertical li.current-menu-item > a{
  border-left: 0 !important;
  border-radius: 0 var(--bb-block-radius) var(--bb-block-radius) 0 !important;
}

/* =========================================================
   Profile Cover / Header
   ========================================================= */
.buddypress #cover-image-container{
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  margin-bottom: var(--conjurly-cover-gap-after) !important;
  padding: 0 !important;
}

.buddypress #cover-image-container #header-cover-image{
  width: 100%;
  height: 340px !important;
  min-height: 0 !important;
  overflow: hidden !important;
  margin: 0 !important;
}

.buddypress #cover-image-container #header-cover-image > img.header-cover-img{
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  display: block;
  object-fit: unset !important;
  object-position: unset !important;
}

.buddypress #cover-image-container #item-header-cover-image{
  position: relative !important;
  top: auto !important;
  bottom: auto !important;
  transform: none !important;
  margin: 0 !important;
  padding-left: var(--cj-space-card) !important;
  padding-right: var(--cj-space-card) !important;
  padding-bottom: var(--conjurly-cover-header-pad-bottom) !important;
  z-index: 2;
}

.buddypress #item-body,
.buddypress .bp-profile-wrapper #item-body{
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body #buddypress .users-header #header-cover-image.width-default,
body #buddypress #header-cover-image.cover-large{
  margin: 0 !important;
}

@media (max-width: 768px){
  .buddypress #cover-image-container #header-cover-image{
    height: 240px !important;
  }

  /* BuddyBoss sometimes outputs duplicate cover markup on mobile. */
  .buddypress #cover-image-container{
    display: none !important;
  }

  .buddypress #buddypress #item-header #cover-image-container{
    display: block !important;
  }

  .buddypress #buddypress #item-header #cover-image-container #header-cover-image{
    height: 240px !important;
    overflow: hidden !important;
    margin: 0 !important;
  }

  .buddypress #buddypress #item-header #header-cover-image > img.header-cover-img[style*="top: -"]{
    top: 0 !important;
  }
}

/* Optional fit mode for square/portrait uploads */
.buddypress #cover-image-container #header-cover-image.cj-cover-fit{
  position: relative !important;
  background: rgba(0,0,0,.05);
}

.buddypress #cover-image-container #header-cover-image.cj-cover-fit::before{
  content: "";
  position: absolute;
  inset: 0;
  background-image: var(--cj-cover-url);
  background-size: cover;
  background-position: center;
  filter: blur(22px);
  transform: scale(1.18);
  opacity: 0.92;
}

.buddypress #cover-image-container #header-cover-image.cj-cover-fit > img.header-cover-img{
  position: relative;
  z-index: 1;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

body.bp-cover-image-repositioning .buddypress #cover-image-container #header-cover-image.cj-cover-fit::before,
body.repositioning-cover-image .buddypress #cover-image-container #header-cover-image.cj-cover-fit::before,
body.bb-cover-repositioning .buddypress #cover-image-container #header-cover-image.cj-cover-fit::before{
  display: none !important;
}

/* =========================================================
   Activity feed
   ========================================================= */

/* Card-level shadow */
#buddypress .activity-list.bp-list .activity-item {
  box-shadow: var(--cj-shadow-card) !important;
}

/* Head bar (activity post box) */
.activity .activity-head-bar {
  background: var(--bb-content-background-color);
  border: 1px solid var(--bb-content-border-color);
  border-radius: var(--bb-block-radius);
  padding: 10px 12px;
  margin-bottom: 16px;
}

/* Avatar + meta row */
.activity-list .bp-activity-head {
  margin-right: 35px;
  margin-bottom: 0;
}

/* Activity inner — top/bottom dividers, spacing reset */
#buddypress .activity-item .activity-inner {
  margin-top: 1rem;
  padding-top: 0;
  padding-bottom: 0;
  border-radius: 0;
  border-top: 1px solid var(--cj-divider) !important;
  border-bottom: 1px solid var(--cj-divider) !important;
}

/* Activity content — bottom divider only */
#buddypress .activity-item .activity-content {
  border: none !important;
  border-bottom: 1px solid var(--cj-divider) !important;
  padding-bottom: 1rem;
}

/* First paragraph — breathing room above */
#buddypress .activity-item .activity-inner > p:first-of-type,
#buddypress .activity-item .activity-content .activity-inner > p:first-of-type {
  margin-top: 0.75rem !important;
}

/* State label (e.g. "posted an update") */
.activity-list .activity-item .activity-content .activity-state {
  color: var(--bb-alternate-text-color);
  margin: 10px 0 0;
}

/* Activity meta bar — no borders */
#buddypress .activity-item .activity-meta {
  border-top: none !important;
  border-bottom: none !important;
}

/* Dividers on elements adjacent to meta bar and update form */
#buddypress .activity-item .activity-meta + *,
#buddypress .activity-update-form {
  border-top: 1px solid var(--cj-divider) !important;
  border-bottom-color: var(--cj-divider) !important;
}

/* Titles */
.activity-list .activity-item .activity-title h2 {
  margin-top: 0.6rem !important;
  margin-bottom: 0 !important;
}

body.buddypress .buddypress-wrap h2 {
  padding-top: 0.15rem;
}

/* Comments — dividers and spacing */
.buddypress-wrap .activity-comments ul li {
  border-bottom: 1px solid var(--cj-divider) !important;
  padding-top: 1rem;
}

/* Touch devices — always-visible meta bar */
@media (hover: none) and (pointer: coarse) {
  #buddypress .activity-item .activity-meta,
  #buddypress .activity-item .activity-meta.action,
  #buddypress .activity-item .activity-meta.activity-meta-action,
  #buddypress .activity-item .bp-generic-meta,
  #buddypress .activity-item .activity-meta.activity-meta {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    max-height: none !important;
  }
}

@media (max-width: 767px) {
  .activity-item .activity-comments {
    display: block !important;
  }
}

/* =========================================================
   Guest action bar
   ========================================================= */
.cj-guest-actionbar{
  display: flex;
  gap: 10px;
  align-items: center;
  padding-top: 10px;
  color: rgba(0,0,0,.60);
  font-weight: 600;
  cursor: pointer;
  user-select: none;
}

.cj-guest-actionbar:hover{ color: var(--cj-link); }
.cj-guest-dot{ color: rgba(0,0,0,.35); font-weight: 400; }

/* =========================================================
   Auth modal
   ========================================================= */
#cj-auth-modal[aria-hidden="true"]{ display: none; }
#cj-auth-modal[aria-hidden="false"]{ display: block; }

.cj-auth-modal{
  position: fixed;
  inset: 0;
  z-index: 999999;
}
.cj-auth-modal__backdrop{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.35);
}
.cj-auth-modal__dialog{
  position: relative;
  width: min(520px, calc(100vw - 24px));
  margin: 12vh auto 0;
  background: var(--cj-surface-card, #fff);
  border-radius: var(--cj-radius-modal, 16px);
  box-shadow: var(--cj-shadow-modal, 0 12px 32px rgba(0,0,0,.12));
  padding: 18px 18px 16px;
}
.cj-auth-modal__close{
  position: absolute;
  top: 10px;
  right: 12px;
  width: 40px;
  height: 40px;
  border: 0;
  background: transparent;
  font-size: 28px;
  line-height: 40px;
  cursor: pointer;
  opacity: .6;
}
.cj-auth-modal__close:hover{ opacity: .85; }
.cj-auth-modal__title{ margin: 4px 0 8px; font-size: 18px; }
.cj-auth-modal__text{ margin: 0 0 14px; color: rgba(0,0,0,.62); }
.cj-auth-modal__actions{ display: flex; gap: 10px; flex-wrap: wrap; }
.cj-auth-modal-open{ overflow: hidden; }
#cj-cover-help-modal[aria-hidden="true"]{ display: none; }
#cj-cover-help-modal[aria-hidden="false"]{ display: block; }
.cj-cover-help__hint{ margin: 10px 0 0; font-size: 13px; color: rgba(0,0,0,.55); }


/* =========================================================
   Magic News page (page-id-2778) — Indigo title card treatment
   Native h1.entry-title IS the visible section header.
   Plugin shortcode must use show_header="no" (or no title attr)
   so it does not render a competing h1.
   Customizer CSS for this page should be cleared entirely.
   ========================================================= */

/* Strip the article card wrapper */
.page-id-2778 #primary .site-main article.page,
.page-id-2778 #primary .site-main article.type-page {
  background: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

/* Zero out entry-content so filter card sits flush below title */
.page-id-2778 .entry-content {
  padding: 0 !important;
  margin: 0 !important;
}

/* Native h1 — accessible hiding: present in DOM for SEO, invisible to users.
   Not display:none — Google recognises this as the standard screen-reader
   pattern and does not discount it. Plugin shortcode renders the visible h1
   inside the section card header, correctly contained within the content column. */
.page-id-2778 article.page > .entry-header .entry-title,
.page-id-2778 article.type-page > .entry-header .entry-title {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Entry-header: stays in DOM, zero visual footprint */
.page-id-2778 article.page > .entry-header,
.page-id-2778 article.type-page > .entry-header {
  display: block !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
}


/* =========================================================
   News single + News Watch single — headline and image fixes
   BuddyBoss template: .bb-template-v2.single
   ========================================================= */

/* Headline on news singles — scoped to Conjurly news CPTs only */
.single-cnjrly_news .entry-title,
.single-cnjrly_news_watch .entry-title {
  font-family: "IBM Plex Serif", serif;
  font-weight: 600;
  font-size: clamp(1.75rem, 2.2vw, 2.15rem);
  line-height: 1.06;
  margin-bottom: 20px;
  letter-spacing: -0.016em;
  color: rgba(0, 0, 0, 0.88);
}

/* Remove radius and bottom margin on featured image in BuddyBoss v2 template */
.bb-template-v2.single-cnjrly_news .default-fi .entry-img,
.bb-template-v2.single-cnjrly_news_watch .default-fi .entry-img {
  border-radius: 0;
  margin-bottom: 0;
}




/* =========================================================
   Community Activity Feed (post-10) — Indigo title card
   CSS-only: preserves BuddyBoss three-column layout entirely.
   Note: body does not receive page-id-10 class on BuddyPress
   activity pages — article#post-10 is the reliable hook.
   ========================================================= */

#post-10 .entry-title,
#post-10 .bb-page-header h1,
#post-10 .bb-title {
  background: var(--cj-indigo, #4c187e) !important;
  color: var(--cj-text-on-accent) !important;
  font-family: var(--cj-font-headline) !important;
  font-size: var(--cj-page-header-title-size, 2rem) !important;
  font-weight: var(--cj-page-header-title-weight, 500) !important;
  line-height: var(--cj-heading-line-height-tight, 1.1);
  letter-spacing: var(--cj-heading-letter-spacing-tight, -0.01em);
  margin: 0 !important;
  padding: 14px 18px 15px !important;
  border-radius: var(--cj-radius-card, 14px);
}


/* =========================================================
   Conjurly — BuddyBoss Activity Video Pass v1
   First pass: portrait video in feed
   ========================================================= */

/* Shared shell cleanup */
.activity-content.video-activity-wrap .bb-activity-video-wrap {
  background: transparent;
}

.activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem {
  border-radius: var(--cj-radius-card);
  overflow: hidden;
}

/* Keep action menu layered correctly */
.activity-content.video-activity-wrap .bb-activity-video-wrap .video-action-wrap {
  z-index: 5;
}

/* Portrait videos */
.activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-vertical-layout {
  display: flex;
  justify-content: center;
  align-items: stretch;
  background: #000;
  width: fit-content;
  max-width: min(400px, calc(100vw - 48px));
  margin: 0 auto;
  box-shadow: var(--cj-shadow-card);
  border: 1px solid var(--cj-border-light);
}

.activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-vertical-layout .video-js.single-activity-video {
  display: block;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 100% !important;
  aspect-ratio: 9 / 16;
  background: #000;
  margin: 0 auto;
}

.activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-vertical-layout .video-js.single-activity-video .vjs-tech,
.activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-vertical-layout .video-js.single-activity-video video,
.activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-vertical-layout .video-js.single-activity-video .vjs-poster,
.activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-vertical-layout .video-js.single-activity-video .vjs-poster img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}

.activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-vertical-layout .video-js.vjs-fluid:not(.vjs-audio-only-mode) {
  padding-top: 0 !important;
}

.activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-vertical-layout .video-js .vjs-control-bar {
  font-size: 0.92rem;
}

.activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-vertical-layout .bb-video-duration {
  right: 10px;
  bottom: 10px;
  left: auto;
  background: rgba(0,0,0,0.68);
  border-radius: 999px;
  padding: 0.2rem 0.45rem;
  font-size: 0.78rem;
  line-height: 1;
}

/* Horizontal videos */
.activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-horizontal-layout {
  max-width: none;
  margin: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-horizontal-layout .video-js.single-activity-video {
  max-width: none;
  aspect-ratio: auto;
}

@media (max-width: 767px) {
  .activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-vertical-layout {
    max-width: min(400px, calc(100vw - 48px));
  }

  .activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-vertical-layout .video-js.single-activity-video {
    max-width: min(400px, calc(100vw - 48px));
  }
}

@media (max-width: 430px) {
  .activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-vertical-layout,
  .activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-vertical-layout .video-js.single-activity-video {
    max-width: min(400px, calc(100vw - 48px));
    border-radius: var(--cj-radius-card);
  }
}


/* Desktop portrait controls: mirror the reduced mobile set */
@media (min-width: 768px) {
  .activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-vertical-layout .video-js .vjs-control-bar {
    font-size: 0.9rem;
    padding-left: 0.15rem;
    padding-right: 0.15rem;
    gap: 2px;
  }

  .activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-vertical-layout .video-js .vjs-control {
    width: 2.2em;
  }

  .activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-vertical-layout .video-js .vjs-volume-panel {
    width: 4.5em;
    min-width: 4.5em;
    margin-right: 0.1rem;
  }

  .activity-content.video-activity-wrap .bb-activity-video-wrap .bb-activity-video-elem.bb-vertical-layout .video-js .vjs-progress-control {
    flex: 1 1 auto;
    min-width: 0;
  }
}

@media (min-width: 768px) {
  .bb-activity-video-elem.bb-vertical-layout .video-js .vjs-picture-in-picture-control {
    display: none !important;
  }
}


/* ============================================================
   Conjurly Nav Drawer — BuddyBoss mobile header integration
   Suppresses BB's native mobile trigger; our hamburger button
   (injected by nav-menu.js into .bb-left-panel-icon-wrap)
   takes its place.
   BuddyBoss mobile header is active at ≤960px.
   ============================================================ */

/* Hide BB's sidebar trigger link — our button replaces it */
@media (max-width: 960px) {
  .bb-left-panel-icon-wrap .bb-left-panel-mobile {
    display: none !important;
  }
}

/* Ensure the wrap itself stays flex and sized correctly for our button */
@media (max-width: 960px) {
  .bb-left-panel-icon-wrap {
    display: flex;
    align-items: center;
  }
}

/* ── Desktop nav suppression (>960px) ── */
/* BuddyBoss full nav replaced by Conjurly hamburger drawer on desktop.
   Our button is injected before #site-navigation by nav-menu.js.
   The BuddyBoss desktop sidebar toggle (bb-toggle-panel) is also hidden. */
@media (min-width: 961px) {
  nav#site-navigation.main-navigation {
    display: none !important;
  }
  a.bb-toggle-panel {
    display: none !important;
  }
}


/* ── Mobile header: logo left-aligned after hamburger ───────────────────────
   Removes BuddyBoss's flex-1 centering on the logo wrapper so the logo
   sits left with breathing room after the hamburger button.
   .header-aside gets margin-left: auto to stay pinned right. */
@media (max-width: 960px) {
  .bb-mobile-header .mobile-logo-wrapper {
    flex: 0 0 auto;
    margin-left: 14px;
  }

  .bb-mobile-header .header-aside {
    margin-left: auto;
  }
}


/* ── Fix: .avatar span bleeds onto .bb-separator turning it into a circle ──
   #header-aside has class .avatar which causes .avatar i, .avatar span to
   apply border-radius: 50% + fixed dimensions to the separator span.
   Restore BuddyBoss's original separator geometry. */
#header-aside .bb-separator {
  border-radius: 0 !important;
  width: 1px !important;
  height: 24px !important;
  display: inline-block !important;
  padding: 0 !important;
}


/* ── Desktop logo + tagline grouping ── */
/* Keep the brand block together: hamburger, then logo, then divider, then tagline.
   The right-side utilities are pushed away with auto margin on #header-aside. */
@media (min-width: 961px) {
  #cnjrly-site-header .site-header-container {
    display: flex;
    align-items: center;
  }

  #cnjrly-site-header .header-2 .site-branding,
  #cnjrly-site-header .site-branding {
    margin-left: 22px;
    margin-right: 0;
    flex: 0 0 auto;
  }

  #cnjrly-site-header #header-aside,
  #cnjrly-site-header .header-aside {
    margin-left: auto;
  }

  .cj-nav-toggle {
    margin-top: 0.1rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    width: 20px;
    height: 14px;
    padding: 0;
    background: none;
    border: none;
    cursor: pointer;
    flex-shrink: 0;
    color: var(--cj-indigo, #4c187e);
    position: relative;
  }

  .header-aside > *:last-child {
    margin-top: 0.33rem;
    padding-right: 0;
  }
}


/* ── Desktop header tagline ── */
/* Direct flex child of .site-header-container in our PHP header.
   IBM Plex Sans italic, Indigo, desktop only. */
@media (min-width: 961px) {
  .cj-header-tagline {
    display: flex;
    align-items: center;
    flex-shrink: 0;
  }

  .cj-header-tagline::before {
    content: '';
    display: block;
    width: 1px;
    height: 2.1rem;
    background: var(--cj-indigo, #4c187e);
    opacity: 0.25;
    flex-shrink: 0;
    align-self: center;
    margin-left: 9px;
    margin-right: 14px;
  }

  .cj-header-tagline__text {
    font-family: var(--cj-font-sans);
    font-style: italic;
    font-weight: 500;
    font-size: 1.1rem;
    color: var(--cj-indigo, #4c187e);
    opacity: 0.75;
    white-space: nowrap;
    letter-spacing: 0.01em;
    line-height: 1;
    transform: translateY(-1px);
    margin-top: 0.29rem;
  }
}

/* Hidden on mobile */
@media (max-width: 960px) {
  .cj-header-tagline {
    display: none !important;
  }
}


/* ── Desktop brand spacing ── */
/* Keep logo/divider/tagline spacing balanced. Extra air is handled on the
   site-branding block, not by pushing the logo image itself. */
@media (min-width: 961px) {
  #cnjrly-site-header #site-logo .site-title,
  #cnjrly-site-header #site-logo .site-title .bb-logo-wrap {
    display: flex;
    align-items: center;
  }

  #cnjrly-site-header #site-logo .site-title .bb-logo img,
  #cnjrly-site-header #site-logo .site-title img.bb-logo {
    margin-left: 0;
  }
}


/* ── Desktop: Sign In rightmost, Sign Up before it ── */
/* Users sign in far more than they sign up — Sign In gets prime position. */
@media (min-width: 961px) {
  .bb-header-buttons {
    display: flex;
    flex-direction: row-reverse;
    gap: 8px;
    margin-left: 16px;
  }
}



/* ── Mobile logged-out auth bar buttons ─────────────────────────────────────
   Custom top mobile auth bar sits on an Indigo surface. Keep the actions
   inverted and calm: Sign In is the primary white button; Sign Up is the
   secondary outline button. No Ember in this structural auth bar. */
@media (max-width: 960px) {
  .bb-mobile-header .bb-header-buttons,
  .site-header .bb-mobile-header .bb-header-buttons {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
  }

  .bb-mobile-header .bb-header-buttons a.signin-button,
  .bb-mobile-header .bb-header-buttons a.signin-button:link,
  .bb-mobile-header .bb-header-buttons a.signin-button:visited,
  .bb-mobile-header .bb-header-buttons a.signup,
  .bb-mobile-header .bb-header-buttons a.signup:link,
  .bb-mobile-header .bb-header-buttons a.signup:visited {
    min-width: 92px;
    height: 34px;
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1;
    padding: 0 14px;
    border-radius: var(--cj-radius-btn, 10px);
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none !important;
    box-sizing: border-box;
    box-shadow: none !important;
  }

  .bb-mobile-header .bb-header-buttons a.signin-button,
  .bb-mobile-header .bb-header-buttons a.signin-button:link,
  .bb-mobile-header .bb-header-buttons a.signin-button:visited {
    background: #fff !important;
    border: 1px solid #fff !important;
    color: var(--cj-indigo, #4c187e) !important;
  }

  .bb-mobile-header .bb-header-buttons a.signin-button:hover,
  .bb-mobile-header .bb-header-buttons a.signin-button:focus {
    background: rgba(255, 255, 255, 0.92) !important;
    border-color: rgba(255, 255, 255, 0.92) !important;
    color: var(--cj-indigo, #4c187e) !important;
  }

  .bb-mobile-header .bb-header-buttons a.signup,
  .bb-mobile-header .bb-header-buttons a.signup:link,
  .bb-mobile-header .bb-header-buttons a.signup:visited {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.72) !important;
    color: #fff !important;
  }

  .bb-mobile-header .bb-header-buttons a.signup:hover,
  .bb-mobile-header .bb-header-buttons a.signup:focus {
    background: rgba(255, 255, 255, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.9) !important;
    color: #fff !important;
  }
}

/* ── Desktop auth buttons: Sign In primary, Sign Up secondary ── */
@media (min-width: 961px) {
  .bb-header-buttons a.signup,
  .bb-header-buttons a.signup:link,
  .bb-header-buttons a.signup:visited,
  .bb-header-buttons a.signin-button,
  .bb-header-buttons a.signin-button:link,
  .bb-header-buttons a.signin-button:visited {
    width: 110px;
    min-width: 110px;
    height: 38px;
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1;
    padding: 0 16px;
    border-radius: var(--cj-btn-radius, var(--cj-radius-btn, 10px));
    font-size: var(--cj-btn-font-size, 0.95rem);
    font-weight: var(--cj-btn-font-weight, 500);
    text-decoration: none !important;
    box-sizing: border-box;
  }

  .bb-header-buttons a.signup,
  .bb-header-buttons a.signup:link,
  .bb-header-buttons a.signup:visited {
    background: #fff !important;
    border: 1px solid var(--cj-indigo, #4c187e) !important;
    color: var(--cj-indigo, #4c187e) !important;
  }

  .bb-header-buttons a.signup:hover,
  .bb-header-buttons a.signup:focus {
    background: var(--cj-link-hover, #5A22B8) !important;
    border-color: var(--cj-link-hover, #5A22B8) !important;
    color: var(--cj-surface-primary-text, #fff) !important;
  }

  .bb-header-buttons a.signin-button,
  .bb-header-buttons a.signin-button:link,
  .bb-header-buttons a.signin-button:visited {
    background: var(--cj-indigo, #4c187e) !important;
    border: 1px solid var(--cj-indigo, #4c187e) !important;
    color: var(--cj-surface-primary-text, #fff) !important;
  }

  .bb-header-buttons a.signin-button:hover,
  .bb-header-buttons a.signin-button:focus {
    background: var(--cj-link-hover, #5A22B8) !important;
    border-color: var(--cj-link-hover, #5A22B8) !important;
    color: var(--cj-surface-primary-text, #fff) !important;
  }
}


/* ── Desktop auth button token enforcement ────────────────────────────────
   BuddyBoss template v2 ships a more specific outline rule:
   .bb-template-v2 .bb-header-buttons a.button.outline { font-weight: 600; }
   Keep layout intact, but force header auth typography/radius back to Core UI
   button tokens so Sign Up and Sign In match. */
@media (min-width: 961px) {
  .bb-template-v2 #cnjrly-site-header .bb-header-buttons a.button.outline,
  .bb-template-v2 #cnjrly-site-header .bb-header-buttons a.signup,
  .bb-template-v2 #cnjrly-site-header .bb-header-buttons a.signin-button {
    font-size: var(--cj-btn-font-size, 0.95rem);
    font-weight: var(--cj-btn-font-weight, 500);
    line-height: var(--cj-btn-line-height, 1.15);
    border-radius: var(--cj-btn-radius, var(--cj-radius-btn, 10px));
  }
}


/* ── BuddyBoss template v2 exact outline button override ─────────────────────
   Beats BuddyBoss' late-loading hardcoded 600 weight without changing header
   layout, hamburger/menu behavior, sizing, colors, or mobile styles. */
@media (min-width: 961px) {
  .bb-template-v2 .bb-header-buttons a.button.outline {
    font-weight: var(--cj-btn-font-weight, 500) !important;
  }
}


/* ── Hide BuddyBoss native header on desktop — replaced by our PHP header ── */
@media (min-width: 961px) {
  .site-header.site-header--bb:not(#cnjrly-site-header) {
    display: none !important;
  }
}

/* ── Conjurly custom logged-out mobile auth bar ─────────────────────────────
   This is the custom top auth bar rendered outside BuddyBoss' native
   .bb-mobile-header button group. Keep the surface token-driven so it follows
   the structural Indigo system instead of any hardcoded legacy background. */
@media (max-width: 960px) {
  .cnjrly-mobile-auth-bar,
  #cnjrly-mobile-auth-bar {
    background: var(--cj-indigo, #4c187e) !important;
  }

  .cnjrly-mobile-auth-bar .cnjrly-auth-btn {
    border-radius: var(--cj-radius-btn, 10px);
    font-weight: 600;
    text-decoration: none !important;
    box-shadow: none !important;
  }

  .cnjrly-mobile-auth-bar .cnjrly-auth-login,
  .cnjrly-mobile-auth-bar .cnjrly-auth-login:link,
  .cnjrly-mobile-auth-bar .cnjrly-auth-login:visited {
    background: transparent !important;
    border-color: rgba(255, 255, 255, 0.82) !important;
    color: var(--cj-text-on-accent, #ffffff) !important;
  }

  .cnjrly-mobile-auth-bar .cnjrly-auth-login:hover,
  .cnjrly-mobile-auth-bar .cnjrly-auth-login:focus {
    background: rgba(255, 255, 255, 0.1) !important;
    border-color: rgba(255, 255, 255, 0.95) !important;
    color: var(--cj-text-on-accent, #ffffff) !important;
  }
}

/* =========================================================
   BuddyBoss registration legal modal fallback
   ========================================================= */
.cj-legal-popup-fallback {
  font-size: 1rem;
  line-height: 1.55;
}

.cj-legal-popup-fallback p {
  margin: 0 0 1rem;
}

.cj-legal-popup-fallback__button,
.cj-legal-popup-fallback__button.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--cj-radius-btn, 10px);
  font-weight: 500;
  text-decoration: none !important;
}

.cj-legal-popup-fallback__note {
  color: var(--bb-body-text-color, #444);
  opacity: 0.78;
  font-size: 0.95rem;
}