/* =========================================
   WGI global vars
   ========================================= */
:root{
  /* Your brand green (header color) */
  --wgi-brand-green: #084a1e;
}

/* =========================================
   Small UI tweaks previously inline
   ========================================= */
.bp-invite, .invite-members, .bb-invite { display:none !important; }
.delete-group { display:none !important; } /* hide broken Delete button */

.bp-group-create-form {
  max-width:700px;
  margin:20px auto;
  padding:20px;
  border-radius:8px;
  background:#fafafa;
}

.wgi-google-drive {
  margin:30px 0;
  padding:20px;
  background:#f4f8f4;
  border:1px solid #d3e0d3;
  border-radius:8px;
}

.wgi-back-to-groups .button {
  display:inline-block;
  padding:8px 12px;
  background:#0073aa;
  color:#fff;
  border-radius:4px;
  text-decoration:none;
}
.wgi-back-to-groups .button:hover { background:#005177; }

/* Ensure RL left panel is visible on desktop */
@media (min-width: 1024px){
  #secondary.bb-rl-left-panel{ display:block !important; visibility:visible !important; }
}

/* Hide any stray BuddyBoss “Messages” tab (safety) */
#messages-personal-li{display:none!important;}

/* My Groups list base (transition + padding so the hover shows) */
.bb-rl-list .bb-rl-item-list > li{
  transition: background .15s ease, box-shadow .15s ease;
  border-radius:8px;
  padding:6px;
}

/* =========================================
   ReadyLaunch Color Skin (Header/Left Panel)
   ========================================= */
header#masthead.bb-rl-header {
  background:var(--wgi-brand-green) !important;
  color:#fff !important;
  border-bottom:none !important;
}
header#masthead.bb-rl-header a,
header#masthead.bb-rl-header .bb-rl-logo-wrap,
header#masthead.bb-rl-header .bb-readylaunch-menu a {
  color:#fff !important;
}

/* Header icons (they use currentColor) */
header#masthead.bb-rl-header i,
header#masthead.bb-rl-header [class^="bb-icons-rl-"],
header#masthead.bb-rl-header [class*=" bb-icons-rl-"] {
  color:#fff !important;
  fill:#fff !important;
}

/* Top nav hover/active */
header#masthead.bb-rl-header .bb-readylaunch-menu > li > a {
  border-radius:6px !important;
  padding:6px 10px !important;
}
header#masthead.bb-rl-header .bb-readylaunch-menu > li.current-menu-item > a,
header#masthead.bb-rl-header .bb-readylaunch-menu > li > a:hover,
header#masthead.bb-rl-header .bb-readylaunch-menu > li > a:focus {
  background:rgba(255,255,255,0.14) !important;
  color:#fff !important;
}

/* Header search */
header#masthead.bb-rl-header .bp-search input[type="search"] {
  background:#fff !important;
  color:var(--wgi-brand-green) !important;
  border:1px solid rgba(255,255,255,0.3) !important;
}
header#masthead.bb-rl-header .bp-search .search-form_submit,
header#masthead.bb-rl-header .bp-search .search-form_reset {
  background:#fff !important;
  color:var(--wgi-brand-green) !important;
  border:1px solid transparent !important;
}
header#masthead.bb-rl-header .bp-search .search-form_submit:hover,
header#masthead.bb-rl-header .bp-search .search-form_reset:hover {
  background:rgba(255,255,255,0.92) !important;
  color:var(--wgi-brand-green) !important;
}

/* Header dropdown "View All" button */
header#masthead.bb-rl-header .bb-rl-button.bb-rl-button--secondaryFill {
  background:#fff !important;
  color:var(--wgi-brand-green) !important;
  border-color:#fff !important;
}

/* Mobile ReadyLaunch menu wrapper */
.bb-readylaunch-mobile-menu__wrap {
  background:var(--wgi-brand-green) !important;
}
.bb-readylaunch-mobile-menu__wrap a { color:#fff !important; }
.bb-readylaunch-mobile-menu__wrap .bb-readylaunch-mobile-menu > li > a:hover {
  background:rgba(255,255,255,0.12) !important;
}

/* Left panel / sidebar */
#secondary.bb-rl-left-panel { border-right:0 !important; }
#secondary.bb-rl-left-panel .bb-rl-left-panel-menu-link {
  color:var(--wgi-brand-green) !important;
  border-radius:8px !important;
}
#secondary.bb-rl-left-panel .bb-rl-left-panel-menu li.selected > a.bb-rl-left-panel-menu-link,
#secondary.bb-rl-left-panel .bb-rl-left-panel-menu-link:hover,
#secondary.bb-rl-left-panel .bb-rl-left-panel-menu-link:focus {
  background:var(--wgi-brand-green) !important;
  color:#fff !important;
}
#secondary.bb-rl-left-panel .bb-rl-left-panel-menu .menu-icon {
  color:inherit !important;
  fill: currentColor !important;
}
#secondary.bb-rl-left-panel .bb-rl-list h2 {
  color:var(--wgi-brand-green) !important;
}

/* =========================================
   Profile dropdown fixes (keep green on hover)
   ========================================= */
header#masthead.bb-rl-header .bb-rl-profile-dropdown
.bb-rl-profile-list-item > a.bb-rl-profile-list-link {
  color:#111 !important; /* default dark text */
}
header#masthead.bb-rl-header .bb-rl-profile-dropdown
.bb-rl-profile-list-item > a.bb-rl-profile-list-link i,
header#masthead.bb-rl-header .bb-rl-profile-dropdown
.bb-rl-profile-list-item > a.bb-rl-profile-list-link [class^="bb-icons-rl-"] {
  color:#111 !important; fill:#111 !important;
}

/* Hover/focus: on-brand green */
header#masthead.bb-rl-header .bb-rl-profile-dropdown
.bb-rl-profile-list-item > a.bb-rl-profile-list-link:hover,
header#masthead.bb-rl-header .bb-rl-profile-dropdown
.bb-rl-profile-list-item > a.bb-rl-profile-list-link:focus,
header#masthead.bb-rl-header .bb-rl-profile-dropdown
.bb-rl-profile-list-item > a.bb-rl-profile-list-link:focus-visible {
  color:var(--wgi-brand-green) !important;
  text-decoration:none !important;
}
header#masthead.bb-rl-header .bb-rl-profile-dropdown
.bb-rl-profile-list-item > a.bb-rl-profile-list-link:hover i,
header#masthead.bb-rl-header .bb-rl-profile-dropdown
.bb-rl-profile-list-item > a.bb-rl-profile-list-link:focus i,
header#masthead.bb-rl-header .bb-rl-profile-dropdown
.bb-rl-profile-list-item > a.bb-rl-profile-list-link:focus-visible i,
header#masthead.bb-rl-header .bb-rl-profile-dropdown
.bb-rl-profile-list-item > a.bb-rl-profile-list-link:hover [class^="bb-icons-rl-"],
header#masthead.bb-rl-header .bb-rl-profile-dropdown
.bb-rl-profile-list-item > a.bb-rl-profile-list-link:focus [class^="bb-icons-rl-"],
header#masthead.bb-rl-header .bb-rl-profile-dropdown
.bb-rl-profile-list-item > a.bb-rl-profile-list-link:focus-visible [class^="bb-icons-rl-"] {
  color:var(--wgi-brand-green) !important; fill:var(--wgi-brand-green) !important;
}

/* Visual hover indicator for “View profile” row */
.bb-rl-profile-dropdown .bb-rl-profile-list-item > a.bb-rl-profile-list-link {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  border-radius: 8px;
  padding: 8px 10px;
  transition: background .15s ease, color .15s ease, transform .05s ease;
}
.bb-rl-profile-dropdown .bb-rl-profile-list-item > a.bb-rl-profile-list-link:hover,
.bb-rl-profile-dropdown .bb-rl-profile-list-item > a.bb-rl-profile-list-link:focus,
.bb-rl-profile-dropdown .bb-rl-profile-list-item > a.bb-rl-profile-list-link:focus-visible {
  background: rgba(8,74,30,.12) !important; /* #084a1e @ ~12% */
  color: var(--wgi-brand-green) !important;
  text-decoration: none !important;
  outline: none !important;
}
.bb-rl-profile-dropdown .bb-rl-profile-list-item > a.bb-rl-profile-list-link:hover::before,
.bb-rl-profile-dropdown .bb-rl-profile-list-item > a.bb-rl-profile-list-link:focus::before,
.bb-rl-profile-dropdown .bb-rl-profile-list-item > a.bb-rl-profile-list-link:focus-visible::before {
  content: '';
  position: absolute;
  left: 0;
  top: 6px;
  bottom: 6px;
  width: 3px;
  background: var(--wgi-brand-green);
  border-radius: 3px;
}

/* =========================================
   “More” dropdown: make links green (generic)
   ========================================= */
.site-header ul.bb-rl-sub-menu.active.open .menu-item > a {
  color: var(--wgi-brand-green) !important;
  text-shadow: none !important;
}
.site-header ul.bb-rl-sub-menu.active.open .menu-item > a:hover,
.site-header ul.bb-rl-sub-menu.active.open .menu-item > a:focus {
  color: var(--wgi-brand-green) !important;
  background-color: color-mix(in srgb, var(--wgi-brand-green) 8%, white);
  outline: none;
}
.site-header ul.bb-rl-sub-menu.active.open .menu-item.current-menu-item > a {
  color: var(--wgi-brand-green) !important;
  font-weight: 600;
}

/* =========================================
   “More” dropdown: header-scoped override
   (wins against aggressive header-wide rules)
   ========================================= */
header#masthead.bb-rl-header ul.bb-rl-sub-menu.active.open,
header#masthead.bb-rl-header ul.bb-rl-sub-menu {
  background:#fff;
}
header#masthead.bb-rl-header ul.bb-rl-sub-menu.active.open li > a,
header#masthead.bb-rl-header ul.bb-rl-sub-menu li > a {
  color: var(--wgi-brand-green) !important;
  text-shadow: none !important;
}
header#masthead.bb-rl-header ul.bb-rl-sub-menu li > a:hover,
header#masthead.bb-rl-header ul.bb-rl-sub-menu li > a:focus {
  color: var(--wgi-brand-green) !important;
  background: color-mix(in srgb, var(--wgi-brand-green) 8%, white);
  outline: none;
}

/* Ensure background-image avatars look like real avatars */
.avatar.um-avatar,
.bb-avatar.um-avatar,
.member-avatar.um-avatar,
.item-avatar.um-avatar,
.user-avatar.um-avatar {
  background-size: cover;
  background-position: center;
  border-radius: 50%;
}

/* =========================
   Back button above subnav
   ========================= */
.wgi-back-above {
  margin: 0 0 10px 0;
}
.wgi-back-above .wgi-back-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 12px;
  background:var(--wgi-brand-green);
  color:#fff !important;
  border-radius:6px;
  text-decoration:none !important;
  font-size:14px;
  line-height:1;
  box-shadow:0 2px 6px rgba(0,0,0,.12);
  transition:box-shadow .15s ease, background .15s ease;
}
.wgi-back-above .wgi-back-btn:hover,
.wgi-back-above .wgi-back-btn:focus{
  background:color-mix(in srgb, var(--wgi-brand-green) 88%, white);
  box-shadow:0 4px 10px rgba(0,0,0,.18);
}

/* Pending badge */
.wgi-pending-badge{
  margin:10px 0 14px;
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px; border-radius:8px;
  background:#fff7e6; border:1px solid #f5d08a; color:#8a5b00; font-weight:600;
}
.wgi-pending-badge::before{ content:''; width:10px; height:10px; border-radius:50%; background:#f59e0b; }

/* Cancel button in wizard */
.wgi-cancel-setup{
  margin-left:10px; display:inline-block; padding:8px 12px;
  border-radius:6px; border:1px solid #e5e7eb; background:#f9fafb; color:#222; text-decoration:none;
}
.wgi-cancel-setup:hover{ background:#f3f4f6; }

/* WGI – Drive widget placement & typography */
body .wgi-drive-below-messages{ max-width:880px; margin:12px auto 14px !important; clear:both; }
body .wgi-drive-below-messages .wgi-drive-widget{
  padding:12px; border:1px solid #e3e6ea; border-radius:10px; background:#f8fafc;
  font:14px/1.5 var(--bb-body-font, var(--bb-font, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif));
  color:var(--bb-text,#222);
  box-shadow:0 1px 2px rgba(0,0,0,.04);
}
body .wgi-drive-widget strong{ font-weight:600; font-size:14px; margin-bottom:6px; color:inherit; }
body .wgi-drive-widget small{ display:block; margin-top:6px; color:#666; }

/* Fallback ReadyLaunch create-page styles (appended) */
.readylaunch.readylaunch--group-create .wgi-card { max-width: 880px; margin: 24px auto; padding: 16px; }
.readylaunch.readylaunch--group-create .wgi-banner{ margin-bottom: 14px; }
.readylaunch.readylaunch--group-create .wgi-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 720px){
  .readylaunch.readylaunch--group-create .wgi-grid{ grid-template-columns: 1fr; }
}
.readylaunch.readylaunch--group-create .wgi-fields input,
.readylaunch.readylaunch--group-create .wgi-fields textarea,
.readylaunch.readylaunch--group-create .wgi-fields select{ width:100%; padding:10px; border-radius:8px; }
.readylaunch.readylaunch--group-create .wgi-actions{ display:flex; gap:10px; justify-content:flex-end; margin-top:16px; }
.readylaunch.readylaunch--group-create .wgi-media{ display:grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.readylaunch.readylaunch--group-create .wgi-chip{ display:inline-flex; gap:6px; padding:4px 8px; border-radius:999px; }
.readylaunch.readylaunch--group-create .wgi-suggest{ max-height:200px; overflow:auto; }
.readylaunch.readylaunch--group-create .wgi-status{ margin-top:12px; font-size:14px; }

/* =====================================================================
   Targeted mobile fixes: force black links in group list + admin subnav
   ===================================================================== */
@media (max-width: 1024px) {
  /* GROUP LIST titles must be black on light tiles */
  .bb-rl-item-list .item-title,
  .bb-rl-item-list .item-title a,
  .bb-rl-item-list .item-title a:link,
  .bb-rl-item-list .item-title a:visited,
  .bb-rl-item-list .item-title a:hover,
  .bb-rl-item-list .item-title a:focus {
    color: #111 !important;
    text-shadow: none !important;
  }

  /* Ensure list tiles themselves stay light behind black text */
  .bb-rl-item-list > li {
    background: #fff !important;
  }

  /* ADMIN SUBNAV (left panel): keep tab labels black on light bg */
  #secondary.bb-rl-left-panel .bp-subnavs.bb-rl-admin-subnav .subnav li a,
  #secondary.bb-rl-left-panel .bp-subnavs.bb-rl-group-admin-subnav .subnav li a {
    color: #111 !important;
    text-shadow: none !important;
    background: #fff !important;
  }

  /* Hover/focus for admin subnav */
  #secondary.bb-rl-left-panel .bp-subnavs .subnav li a:hover,
  #secondary.bb-rl-left-panel .bp-subnavs .subnav li a:focus {
    color: #111 !important;
    background: #f5f5f5 !important;
    outline: none !important;
  }
}

/* Keep the actual mobile *menu* items white on green, not everything else */
.bb-readylaunch-mobile-menu__wrap .bb-readylaunch-mobile-menu > li > a,
.bb-readylaunch-mobile-menu__wrap .bb-readylaunch-mobile-menu .sub-menu a {
  color: #fff !important;
}

/* =====================================================================
   My Groups (left panel) — force black titles on mobile (specific)
   ===================================================================== */
@media (max-width: 1024px) {
  /* Section heading */
  #secondary.bb-rl-left-panel .bb-rl-left-panel-widget .bb-rl-list > h2 {
    color: #111 !important;
    text-shadow: none !important;
  }

  /* Group titles in the list */
  #secondary.bb-rl-left-panel .bb-rl-left-panel-widget .bb-rl-list .bb-rl-item-list .item-title,
  #secondary.bb-rl-left-panel .bb-rl-left-panel-widget .bb-rl-list .bb-rl-item-list .item-title a,
  #secondary.bb-rl-left-panel .bb-rl-left-panel-widget .bb-rl-list .bb-rl-item-list .item-title a:link,
  #secondary.bb-rl-left-panel .bb-rl-left-panel-widget .bb-rl-list .bb-rl-item-list .item-title a:visited,
  #secondary.bb-rl-left-panel .bb-rl-left-panel-widget .bb-rl-list .bb-rl-item-list .item-title a:hover,
  #secondary.bb-rl-left-panel .bb-rl-left-panel-widget .bb-rl-list .bb-rl-item-list .item-title a:focus {
    color: #111 !important;
    text-shadow: none !important;
  }

  /* Keep tiles light so black text is readable */
  #secondary.bb-rl-left-panel .bb-rl-left-panel-widget .bb-rl-list .bb-rl-item-list > li {
    background: #fff !important;
  }
}

/* Stop relying on --bb-text in widgets that can flip to white on mobile skins */
.wgi-drive-widget {
  color: #111 !important;
}