/* ============================================================
   Beside · BuddyBoss component overrides
   ------------------------------------------------------------
   Most BuddyBoss components re-skin themselves automatically
   once we re-bind --bb-* variables in tokens.css. This file
   handles the residual cases where BuddyBoss either:
     a) hard-codes a style that ignores its own variables, or
     b) has structural CSS we want to override (density, radii,
        avatar treatments, hero photos, etc).
   ------------------------------------------------------------
   NOTE: BuddyBoss class names occasionally change between
   major versions. Verify selectors against your installed
   version with DevTools before assuming a rule has no effect.
   ============================================================ */

/* ============================================================
   1. ACTIVITY FEED — entry cards
   ============================================================ */

#buddypress .activity-list .activity-item,
.bb-activity-content-wrap {
  background: var(--bg-primary);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  box-shadow: none;
  padding: 22px 24px;
  margin-bottom: 14px;
}

#buddypress .activity-list .activity-content .activity-header,
.bb-activity-content-wrap .activity-header {
  font-family: var(--font-body);
}

#buddypress .activity-list .activity-content .activity-header a:first-child {
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 600;
  color: var(--text-primary);
}

/* Hide reaction (like) counts per spec — replies only */
.bb-activity-reactions,
.activity-state-likes,
.activity-state-reactions {
  display: none !important;
}

/* Comment count → "n replies" plain text styling */
.activity-state-comments a {
  color: var(--text-primary);
  font-weight: 600;
  text-decoration: none;
}

/* ============================================================
   2. ACTIVITY POST FORM (composer)
   ============================================================ */

#whats-new-form,
.bb-activity-post-form {
  background: var(--bg-primary);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  padding: 16px 18px;
}

#whats-new {
  border: 0 !important;
  background: transparent !important;
  font-family: var(--font-body);
  font-size: 15px;
}

/* Hide media / GIF / poll toolbar — out of scope */
.activity-toolbar-buttons,
.bb-activity-toolbar,
#whats-new-toolbar { display: none; }

/* ============================================================
   3. MEMBERS — directory & header
   ============================================================ */

/* Member header — kill cover image, switch to single-column layout */
#item-header-cover-image,
.bb-cover-photo-wrapper { display: none !important; }

#item-header,
.bb-member-header {
  background: var(--bg-primary);
  border-bottom: 1px solid var(--border);
  padding: 48px 0;
}

#item-header-content {
  display: flex;
  gap: var(--space-3);
  align-items: flex-start;
  max-width: var(--content-wide);
  margin-inline: auto;
  padding-inline: var(--space-4);
}

#item-header h2,
.bb-member-name {
  font-family: var(--font-display);
  font-size: var(--fs-h1);
  font-weight: 500;
  letter-spacing: var(--tracking-tight);
  color: var(--text-primary);
  margin: 0 0 var(--space-1);
}

/* Member directory — single-column hairline rows */
#members-list .item-entry,
.bb-members-list .item-entry,
.bp-members-list li {
  border-bottom: 1px solid var(--border);
  padding: 18px 0;
  display: flex;
  gap: 14px;
  background: transparent;
  border-radius: 0;
}

/* Hide last names — peers use first-name only.
   Add data-show-surname="1" on a wrapper to opt back in. */
.bb-member-name [data-surname],
.member-name-surname { display: none; }

/* ============================================================
   4. GROUPS — header
   ============================================================ */

.bb-group-header,
#item-header.group-header {
  background: var(--bg-secondary);
  border-bottom: 1px solid var(--border);
  padding: 48px 0 0;
}

.bb-group-header__emblem,
.group-avatar img {
  border-radius: var(--radius-card);
  background: var(--bg-primary);
  border: 1px solid var(--border);
}

.bb-group-tabs,
#object-nav.group-subnav ul {
  display: flex;
  gap: 32px;
  border-bottom: 0;
}

.bb-group-tabs a,
#object-nav.group-subnav li a {
  padding: 14px 0;
  border-bottom: 2px solid transparent;
  background: transparent !important;
  color: var(--text-secondary);
  font-weight: 500;
  border-radius: 0 !important;
}

.bb-group-tabs a.is-active,
#object-nav.group-subnav li.current a,
#object-nav.group-subnav li.selected a {
  color: var(--text-primary);
  border-bottom-color: var(--accent);
  font-weight: 600;
}

/* ============================================================
   5. GROUPS — right sidebar widgets
   ============================================================ */

.bb-group-sidebar .widget,
#sidebar .widget {
  background: var(--bg-primary);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  padding: 22px;
  margin-bottom: 16px;
  box-shadow: none;
}

.bb-group-sidebar .widget-title,
#sidebar .widget h3 {
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 10px;
  color: var(--text-primary);
}

/* ============================================================
   6. MESSAGES
   ============================================================ */

.bb-message-thread-list .message-item,
.messages-notices li {
  background: var(--bg-primary);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  padding: 18px 22px;
  margin-bottom: 10px;
}

.bb-message-compose-button,
#user-messages-compose-button { display: none; } /* moved into top bar */

/* ============================================================
   7. NOTIFICATIONS
   ============================================================ */

.notification-wrap,
.bb-notifications-list .notification {
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--border);
  border-radius: 0;
  padding: 16px 4px;
  box-shadow: none;
}

/* Strip BuddyBoss's grouped notification pile — render flat */
.bb-grouped-notifications .grouped-notification-bg { display: none; }

/* ============================================================
   8. GLOBAL HEADER / NAV
   ============================================================ */

#header-aside,
.site-header-container {
  background: var(--bg-primary);
  border-bottom: 1px solid var(--border);
  box-shadow: none;
}

.site-header-container .site-title a,
.bb-logo-text {
  font-family: var(--font-display);
  font-size: 24px;
  font-weight: 600;
  color: var(--accent);
  letter-spacing: -0.01em;
}

/* Search input in header */
#search-form input[type="text"],
.bb-search-form input {
  background: var(--bg-secondary);
  border: 1px solid var(--border);
  border-radius: var(--radius-button);
  font-size: var(--fs-small);
  color: var(--text-secondary);
}

/* ============================================================
   9. BUTTONS — normalise BB's variations
   ============================================================ */

.bp-button,
.button.bp-secondary-action,
.bp-feedback .button,
#buddypress .standard-form button,
#buddypress .generic-button a {
  font-family: var(--font-body);
  font-weight: 500;
  border-radius: var(--radius-button);
  padding: 10px 18px;
  background: var(--accent);
  color: var(--white);
  border: 1px solid transparent;
  transition: background 0.15s ease;
}

.bp-button:hover,
.button.bp-secondary-action:hover {
  background: var(--accent-dark);
  color: var(--white);
}

/* Secondary/ghost variation */
.bp-button.outline,
.button.outline {
  background: transparent;
  color: var(--accent);
  border-color: var(--accent);
}
.bp-button.outline:hover { background: var(--accent-light); }

/* ============================================================
   PUBLIC MARKETING PAGES — hide all BuddyBoss chrome
   Applied on body.bh-public (homepage, how-it-works, etc.)
   ============================================================ */

body.bh-public header#masthead,
body.bh-public .bb-rl-header,
body.bh-public #buddypress-panel,
body.bh-public .bb-readylaunch-panel,
body.bh-public .bb-panel,
body.bh-public #bb-readylaunch-left-panel { display: none !important; }

body.bh-public #page { padding: 0 !important; margin: 0 !important; }
body.bh-public .bb-readylaunch { padding-inline-start: 0 !important; }

/* ============================================================
   READYLAUNCH PLATFORM PAGES — Beside chrome overrides
   Applied on body.bh-app-platform (messages, profiles, etc.)
   ============================================================ */

/* Hide BuddyBoss left navigation panel — Beside uses its own topbar nav */
body.bh-app-platform #buddypress-panel,
body.bh-app-platform .bb-readylaunch-panel,
body.bh-app-platform .bb-panel,
body.bh-app-platform #bb-readylaunch-left-panel { display: none !important; }

/* Remove page padding-left that ReadyLaunch adds for the left panel */
body.bh-app-platform #page { padding-left: 0 !important; margin-left: 0 !important; }
body.bh-app-platform .bb-readylaunch { padding-inline-start: 0 !important; }

/* Suppress BuddyBoss's own header (in case it still renders) */
body.bh-app-platform header#masthead.bb-rl-header { display: none !important; }

/* Container — full width, sensible max */
body.bh-app-platform .bb-rl-container { max-width: 1100px; padding: 0 32px; }

/* Messages interface */
body.bh-app-platform #buddypress .messages-header { background: var(--bg-secondary); border: 1px solid var(--border); border-radius: var(--radius-card); padding: 20px 24px; margin-bottom: 16px; }
body.bh-app-platform #buddypress .message-search input { border: 1px solid var(--border); border-radius: var(--radius-button); background: var(--bg-primary); font-family: var(--font-body); }
body.bh-app-platform #buddypress #message-threads .message-box { border: 1px solid var(--border); border-radius: var(--radius-card); background: var(--bg-primary); box-shadow: none; }
body.bh-app-platform #buddypress #message-threads .message-box:hover { border-color: var(--accent); }
body.bh-app-platform #buddypress #message-threads .message-box.selected { border-color: var(--accent); background: var(--accent-light); }
body.bh-app-platform #buddypress .message-metadata .message-from a { font-weight: 600; color: var(--text-primary); }
body.bh-app-platform #buddypress .message-content .message-subject { font-family: var(--font-display); font-weight: 600; color: var(--text-primary); }
body.bh-app-platform #buddypress #send_message_form textarea,
body.bh-app-platform #buddypress #compose-form textarea { border: 1px solid var(--border); border-radius: var(--radius-card); background: var(--bg-primary); font-family: var(--font-body); font-size: var(--fs-body); padding: 16px; }
body.bh-app-platform #buddypress #send_message_form input[type=submit],
body.bh-app-platform #buddypress .generic-button a,
body.bh-app-platform #buddypress input[type=submit] { background: var(--accent); color: var(--white); border: none; border-radius: var(--radius-button); font-family: var(--font-body); font-weight: 500; }
body.bh-app-platform #buddypress #send_message_form input[type=submit]:hover,
body.bh-app-platform #buddypress input[type=submit]:hover { background: var(--accent-dark); }

/* Member profile pages */
body.bh-app-platform #buddypress #item-header { background: var(--bg-secondary); border-bottom: 1px solid var(--border); padding: 32px; }
body.bh-app-platform #buddypress #item-nav { border-bottom: 1px solid var(--border); background: var(--bg-primary); }
body.bh-app-platform #buddypress #item-nav ul.item-list li a { font-family: var(--font-body); color: var(--text-secondary); }
body.bh-app-platform #buddypress #item-nav ul.item-list li.current a { color: var(--accent); border-bottom: 2px solid var(--accent); }

@media (max-width: 800px) {
  body.bh-app-platform .bb-rl-container { padding: 0 16px; }
}

/* ============================================================
   10. READYLAUNCH — member profile pages
   ============================================================ */

/* ── Profile header band ─────────────────────────────────── */
body.bh-app-platform #bb-rl-profile-container {
  background: var(--bg-secondary);
  border-bottom: 1px solid var(--border);
  padding: 40px 0;
  margin: 0;
}

/* Kill cover photo */
body.bh-app-platform .bb-rl-profile-cover,
body.bh-app-platform .bb-cover-photo-wrapper,
body.bh-app-platform #item-header-cover-image { display: none !important; }

body.bh-app-platform #bb-rl-profile-item-header {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 32px;
  gap: 24px;
  align-items: center;
}

/* Avatar */
body.bh-app-platform .bb-rl-profile-avatar img,
body.bh-app-platform #bb-rl-item-header-avatar img {
  width: 80px !important;
  height: 80px !important;
  border-radius: 50% !important;
  border: 2px solid var(--border) !important;
  object-fit: cover;
}

/* Name */
body.bh-app-platform h2.user-nicename {
  font-family: var(--font-display) !important;
  font-size: 26px !important;
  font-weight: 600 !important;
  color: var(--text-primary) !important;
  letter-spacing: -0.015em !important;
  margin: 0 0 4px !important;
  line-height: 1.2 !important;
}

/* Handle / joined / last-active meta row */
body.bh-app-platform .item-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: var(--text-secondary);
  margin-top: 4px;
}
body.bh-app-platform .item-meta .mention-name { color: var(--accent); font-weight: 500; }
body.bh-app-platform .item-meta .separator { color: var(--border); }

/* Member type badge */
body.bh-app-platform .member-type {
  display: inline-block;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--sage);
  background: var(--sage-light);
  padding: 2px 8px;
  border-radius: 4px;
  margin-bottom: 8px;
}

/* ── Action buttons ──────────────────────────────────────── */
body.bh-app-platform .bb-rl-member-header-actions-wrap { margin-top: 16px; }

body.bh-app-platform .bb-rl-member-header-actions button,
body.bh-app-platform .bb-rl-member-header-actions a.button,
body.bh-app-platform .bb-rl-member-header-actions .generic-button a {
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  border-radius: 8px !important;
  padding: 9px 16px !important;
  border: 1px solid var(--border) !important;
  background: var(--bg-primary) !important;
  color: var(--text-primary) !important;
  box-shadow: none !important;
  cursor: pointer;
  transition: all 0.15s;
}
body.bh-app-platform .bb-rl-member-header-actions button:hover,
body.bh-app-platform .bb-rl-member-header-actions a.button:hover {
  background: var(--bg-secondary) !important;
  border-color: var(--text-secondary) !important;
}

/* Primary actions — message + connect */
body.bh-app-platform .bb-rl-member-header-actions .send-message a,
body.bh-app-platform .bb-rl-member-header-actions .add-friend a {
  background: var(--accent) !important;
  color: var(--white) !important;
  border-color: transparent !important;
}
body.bh-app-platform .bb-rl-member-header-actions .send-message a:hover,
body.bh-app-platform .bb-rl-member-header-actions .add-friend a:hover {
  background: var(--accent-dark) !important;
}

/* More options ("…") button */
body.bh-app-platform .bb-rl-more_options_action {
  border: 1px solid var(--border) !important;
  border-radius: 8px !important;
  background: var(--bg-primary) !important;
  color: var(--text-secondary) !important;
  width: 36px !important;
  height: 36px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* ── Profile nav tabs ────────────────────────────────────── */
body.bh-app-platform .bb-rl-primary-container > #item-header { display: none !important; }

body.bh-app-platform .bp-navs.bp-main-nav,
body.bh-app-platform #item-nav { background: var(--bg-primary) !important; border-bottom: 1px solid var(--border) !important; }

body.bh-app-platform .bp-navs.bp-main-nav ul,
body.bh-app-platform #item-nav ul.item-list {
  display: flex !important;
  gap: 0 !important;
  list-style: none !important;
  padding: 0 32px !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
}

body.bh-app-platform .bp-navs li a,
body.bh-app-platform #item-nav ul.item-list li a {
  display: block;
  padding: 13px 16px !important;
  font-family: var(--font-body) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--text-secondary) !important;
  border-bottom: 2px solid transparent !important;
  background: transparent !important;
  border-radius: 0 !important;
  text-decoration: none !important;
  transition: color 0.15s, border-color 0.15s;
}
body.bh-app-platform .bp-navs li.current a,
body.bh-app-platform #item-nav ul.item-list li.current a,
body.bh-app-platform #item-nav ul.item-list li.selected a {
  color: var(--accent) !important;
  border-bottom-color: var(--accent) !important;
  font-weight: 600 !important;
}
body.bh-app-platform .bp-navs li a:hover,
body.bh-app-platform #item-nav ul.item-list li a:hover {
  color: var(--text-primary) !important;
  background: transparent !important;
}

/* ── Profile content area ────────────────────────────────── */
body.bh-app-platform .bb-rl-content-wrapper {
  max-width: 1100px;
  margin: 0 auto;
  padding: 32px;
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 32px;
  align-items: start;
}

body.bh-app-platform #item-body { background: transparent !important; box-shadow: none !important; border: none !important; }

/* Profile fields */
body.bh-app-platform .bp-profile-field,
body.bh-app-platform div.data { padding: 16px 0; border-bottom: 1px solid var(--border); }
body.bh-app-platform .bp-profile-field:last-child,
body.bh-app-platform div.data:last-child { border-bottom: 0; }

body.bh-app-platform .bp-profile-field p.field-label,
body.bh-app-platform .bp-profile-field h3.field-label {
  font-size: 11px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--text-secondary) !important;
  font-weight: 600 !important;
  font-family: var(--font-body) !important;
  margin-bottom: 4px !important;
}
body.bh-app-platform .bp-profile-field .field-content,
body.bh-app-platform .bp-profile-field dd {
  font-size: 15px !important;
  color: var(--text-primary) !important;
  line-height: 1.6 !important;
  font-family: var(--font-body) !important;
}

/* Right sidebar on profile page */
body.bh-app-platform .bb-rl-secondary-container { min-width: 0; }
body.bh-app-platform .bb-rl-secondary-container .widget,
body.bh-app-platform .bb-rl-secondary-container .card {
  background: var(--bg-secondary) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  padding: 20px !important;
  box-shadow: none !important;
  margin-bottom: 16px;
}

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 900px) {
  body.bh-app-platform #bb-rl-profile-item-header { padding: 0 20px; }
  body.bh-app-platform .bb-rl-content-wrapper { grid-template-columns: 1fr; padding: 24px 20px; }
  body.bh-app-platform .bp-navs.bp-main-nav ul,
  body.bh-app-platform #item-nav ul.item-list { padding: 0 20px !important; overflow-x: auto; }
}
