/*--------------------------------------------------------------
This is your custom stylesheet.

Add your own styles here to make theme updates easier.
To override any styles from other stylesheets, simply copy them into here and edit away.

Make sure to respect the media queries! Otherwise you may
accidentally add desktop styles to the mobile layout.
https://www.w3schools.com/css/css_rwd_mediaqueries.asp
--------------------------------------------------------------*/

/* =====================================================
   BUDDYPANEL SHADOW REMOVAL
===================================================== */

.buddypanel,
.buddypanel::before,
.buddypanel::after {
    box-shadow: none;
    filter: none;
    text-shadow: none;
}

.buddypanel .panel-head,
.buddypanel .panel-body {
    box-shadow: none;
    filter: none;
}

.bb-mobile-panel-wrapper {
    box-shadow: none;
}

.bb-buddypanel-right .site-header::before,
.bb-buddypanel .site-header::before,
.site-header::before {
    box-shadow: none;
    display: none;
}

.site-header {
    box-shadow: none;
}

.site-header .site-header-container,
.site-header .site-title,
.site-header .site-navigation {
    box-shadow: none;
}

.site-header {
    border-bottom: none;
    border-left: none;
    border-right: none;
}

.buddypanel {
    border-left: none;
    border-right: none;
}

.buddypanel .panel-head {
    border-bottom: none;
    border-left: none;
    border-right: none;
    box-shadow: none;
}

.side-panel-inner,
.side-panel-inner::before,
.side-panel-inner::after {
    box-shadow: none;
    filter: none;
}

.buddypanel,
.side-panel-inner {
    backdrop-filter: none;
    filter: none;
}

.buddypanel {
    z-index: 612;
}

.site-header {
    z-index: 612;
}

.buddypanel,
.site-header {
    transform: none;
    transform-style: flat;
    perspective: none;
    backface-visibility: visible;
}

/* =====================================================
   MOBILE PROFILE DROPDOWN CLONE STYLING
   Match desktop structure exactly
===================================================== */

#mobile-profile-dropdown-clone {
    display: flex !important;
    position: fixed !important;
    top: 0 !important;
    right: 0px !important; /* Start from right edge, margin applied to user-link */
    z-index: 9999 !important;
    background: transparent !important;
    padding: 0 !important;
    padding-right: 20px !important; /* Match tab-header right padding (20px) */
    height: 76px !important;
    align-items: center !important;
    justify-content: flex-end !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: fit-content !important;
    overflow: visible !important; /* Ensure avatar is not clipped */
    box-sizing: border-box !important;
}

#mobile-profile-dropdown-clone .header-aside-inner {
    display: flex !important;
    align-items: center !important;
    width: auto !important;
    min-width: fit-content !important;
    height: 76px !important;
}

#mobile-profile-dropdown-clone .user-wrap,
#mobile-profile-dropdown-clone .user-wrap-container {
    display: block !important;
    position: relative !important;
    margin-left: 0px !important; /* Remove margin to prevent clipping */
    flex-shrink: 0 !important; /* Prevent shrinking */
    min-width: auto !important;
    overflow: visible !important;
}

#mobile-profile-dropdown-clone .user-link {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 76px !important;
    padding: 0 !important;
    width: 36px !important;
    flex-shrink: 0 !important; /* Prevent shrinking */
    position: relative !important;
    font-size: 0 !important; /* Hide any text content */
    line-height: 0 !important;
    color: transparent !important;
    text-indent: -9999px !important; /* Hide text with screen reader access */
    overflow: visible !important; /* Ensure avatar is not clipped */
    margin: 0 !important;
}

#mobile-profile-dropdown-clone .user-link img {
    display: block !important;
    border-radius: 50% !important;
    max-width: 36px !important;
    width: 36px !important;
    height: 36px !important;
    image-rendering: optimize-contrast !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    position: relative !important; /* Ensure proper positioning */
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
}

/* On desktop, user-link only shows avatar (no user-name visible) */
/* The dropdown menu (.sub-menu) shows the full profile with name */
/* IMPORTANT: Only hide in main user-link, NOT inside .sub-menu */
#mobile-profile-dropdown-clone .user-link:not(.sub-menu .user-link) .user-name,
#mobile-profile-dropdown-clone .user-link:not(.sub-menu .user-link) > *:not(img):not(.sub-menu) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
}

#mobile-profile-dropdown-clone .user-link i.bb-icon-angle-down,
#mobile-profile-dropdown-clone .user-link .bb-icon-angle-down {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

/* =====================================================
   MOBILE PROFILE DROPDOWN - CLEAN & MATCH DESKTOP
   ===================================================== */

/* Sub-menu container - match desktop exactly */
#mobile-profile-dropdown-clone .sub-menu {
    position: absolute !important;
    right: 0 !important;
    top: 100% !important;
    z-index: 100 !important;
    width: 250px !important;
    min-width: 250px !important;
    background-color: rgb(255, 255, 255) !important;
    padding: 10px 0px !important;
    margin: 0px !important;
    border: 0px none !important;
    border-radius: 10px !important;
    box-shadow: rgba(0, 0, 0, 0.12) 0px 6px 24px 0px, rgba(0, 0, 0, 0.06) 0px 3px 8px 0px !important;
    display: block !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity 0.2s ease, visibility 0.2s ease !important;
}

#mobile-profile-dropdown-clone .sub-menu.mobile-dropdown-visible {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* Sub-menu inner - no padding */
#mobile-profile-dropdown-clone .sub-menu .sub-menu-inner {
    padding: 0px !important;
    margin: 0px !important;
}

/* All list items - no padding/margin, left aligned */
#mobile-profile-dropdown-clone .sub-menu li {
    display: block !important;
    padding: 0px !important;
    margin: 0px !important;
    text-align: left !important;
}

/* First li contains user-link - NO divider on the li itself, divider is on the user-link in desktop */
#mobile-profile-dropdown-clone .sub-menu li:first-child {
    border-bottom: none !important;
    margin-bottom: 0px !important;
    margin-top: 0px !important;
    margin-left: 0px !important;
    margin-right: 0px !important;
    padding-bottom: 0px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
}

#mobile-profile-dropdown-clone .sub-menu li:first-child .user-link {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    padding: 15px !important;
    margin: 0px 8px !important;
    margin-bottom: 6px !important;
    box-sizing: border-box !important;
    width: auto !important;
    min-width: auto !important;
    max-width: none !important;
    border-bottom: 1px solid rgb(214, 217, 221) !important;
    padding-bottom: 12px !important;
    overflow: visible !important;
}

/* User-link image - match desktop */
#mobile-profile-dropdown-clone .sub-menu .user-link img {
    width: 36px !important;
    height: 36px !important;
    max-width: 36px !important;
    border-radius: 50% !important;
    margin: 0px 10px 0px 0px !important;
    display: block !important;
    flex-shrink: 0 !important;
    position: static !important;
    float: none !important;
}

/* Span wrapper for user-name/mention - match desktop block display */
#mobile-profile-dropdown-clone .sub-menu li:first-child .user-link > span {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: auto !important;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    align-items: flex-start !important;
    align-self: center !important;
    box-sizing: border-box !important;
}

/* Force override any height constraints on span wrapper */
#mobile-profile-dropdown-clone .sub-menu li:first-child .user-link > span {
    height: auto !important;
    max-height: none !important;
}

/* User-name - match desktop EXACTLY - MUST override the hide rule above */
#mobile-profile-dropdown-clone .sub-menu .user-link .user-name {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #000000 !important;
    line-height: 20.8px !important;
    margin: 0px !important;
    padding: 0px !important;
    min-height: 20.8px !important;
    text-indent: 0 !important;
    letter-spacing: normal !important;
}

/* Override any parent line-height that might affect user-name */
#mobile-profile-dropdown-clone .sub-menu .user-link {
    line-height: normal !important;
}

/* User-mention - match desktop */
#mobile-profile-dropdown-clone .sub-menu .user-link .user-mention {
    display: block !important;
    font-size: 13px !important;
    color: #000000 !important;
    margin: 0px !important;
    margin-top: 2px !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    height: auto !important;
    overflow: visible !important;
    white-space: normal !important;
    line-height: 18px !important;
    text-indent: 0 !important;
    letter-spacing: normal !important;
}

/* All li elements (except first) - remove padding/margin to ensure alignment */
#mobile-profile-dropdown-clone .sub-menu li:not(:first-child) {
    padding: 0px !important;
    margin: 0px !important;
    list-style: none !important;
}

/* Nested ul within sub-menu - remove padding/margin */
#mobile-profile-dropdown-clone .sub-menu ul {
    padding: 0px !important;
    margin: 0px !important;
    list-style: none !important;
}

/* Menu links (not first li and not logout) - match desktop alignment */
/* Target ALL links in sub-menu except the first li's user-link and logout */
#mobile-profile-dropdown-clone .sub-menu li:not(:first-child):not(.logout-link) a,
#mobile-profile-dropdown-clone .sub-menu ul li:not(.logout-link) a {
    display: flex !important;
    align-items: center !important;
    padding: 10px 15px !important;
    margin-left: 8px !important;
    margin-right: 8px !important;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    color: inherit !important;
    text-decoration: none !important;
    text-align: left !important;
    box-sizing: border-box !important;
    line-height: 18px !important;
    min-height: 18px !important;
    border-bottom: none !important;
    border-top: none !important;
}

/* Ensure last menu item (before logout) has no border-bottom */
#mobile-profile-dropdown-clone .sub-menu li:not(:first-child):not(.logout-link):last-of-type {
    border-bottom: none !important;
    margin-bottom: 0px !important;
    padding-bottom: 0px !important;
}

#mobile-profile-dropdown-clone .sub-menu li:not(:first-child):not(.logout-link):last-of-type a {
    border-bottom: none !important;
    margin-bottom: 0px !important;
    padding-bottom: 10px !important;
}

/* Icons in menu links - HIDE on mobile */
#mobile-profile-dropdown-clone .sub-menu li:not(:first-child) a i,
#mobile-profile-dropdown-clone .sub-menu li:not(:first-child) a .icon,
#mobile-profile-dropdown-clone .sub-menu li:not(:first-child) a [class*="icon"],
#mobile-profile-dropdown-clone .sub-menu ul li a i,
#mobile-profile-dropdown-clone .sub-menu ul li a .icon,
#mobile-profile-dropdown-clone .sub-menu ul li a [class*="icon"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Text spans in menu links - match desktop inline display */
/* EXCLUDE first-child user-link span wrapper from this rule */
#mobile-profile-dropdown-clone .sub-menu li:not(:first-child) a span:not(.icon):not([class*="icon"]):not(.user-link > span),
#mobile-profile-dropdown-clone .sub-menu ul li:not(:first-child) a span:not(.icon):not([class*="icon"]):not(.user-link > span) {
    display: block !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    line-height: 18px !important;
    align-self: center !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    height: 18px !important;
}

/* Logout link - match desktop with top divider */
#mobile-profile-dropdown-clone .sub-menu li.logout-link {
    border-top: 1px solid rgb(214, 217, 221) !important;
    margin-top: 6px !important;
    margin-bottom: 0px !important;
    margin-left: 0px !important;
    margin-right: 0px !important;
    padding-top: 0px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
}

#mobile-profile-dropdown-clone .sub-menu .logout-link a {
    padding: 10px 15px !important;
    margin: 0px 8px !important;
    display: block !important;
    color: rgb(90, 90, 90) !important;
    text-decoration: none !important;
    border-top: none !important;
    margin-top: 0px !important;
}

/* =====================================================
   MOBILE LOGO LEFT ALIGNMENT & HAMBURGER HIDE
===================================================== */

/* Tablet and Mobile - Ensure logo is left-aligned */
@media screen and (max-width: 1024px) {
    /* Mobile logo wrapper - force left alignment */
    .bb-mobile-header .flex-1,
    .bb-mobile-header .mobile-logo-wrapper {
        justify-content: flex-start !important;
        text-align: left !important;
        margin-left: 0 !important;
        margin-right: auto !important;
    }
    
    /* Logo image itself - ensure left alignment */
    .bb-mobile-header .mobile-logo-wrapper img,
    .bb-mobile-header .mobile-logo-wrapper .bb-mobile-logo,
    .bb-mobile-header .mobile-logo-wrapper .site-title,
    .bb-mobile-header .mobile-logo-wrapper .site-title a {
        margin-left: 0 !important;
        margin-right: auto !important;
        text-align: left !important;
        display: block !important;
    }
    
    /* Override any theme or Elementor centering */
    .bb-mobile-header-wrapper .bb-mobile-header .flex-1,
    .bb-mobile-header-wrapper .bb-mobile-header .mobile-logo-wrapper {
        justify-content: flex-start !important;
        text-align: left !important;
    }
}

/* Tablet and Mobile - Hide hamburger menu icon */
@media screen and (max-width: 1024px) {
    /* Hide hamburger menu icon (bars icon) */
    .bb-left-panel-icon-wrap,
    .bb-left-panel-icon-wrap a,
    .bb-left-panel-mobile,
    .bb-icon-l.bb-icon-bars,
    i.bb-icon-l.bb-icon-bars {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        width: 0 !important;
        height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
    }
}

/* =====================================================
   ADDITIONAL CUSTOM STYLES
===================================================== */

/*Remove Social Share On Blog*/ 
body.single-post #content .author-box-share-wrap .bb-icon-l{
    display: none;
}

/*Hide author and date in blog posts*/ 
.blog .post-inner-wrap .avatar-wrap, .post-inner-wrap .meta-wrap {
    display: none;
}

/*Hide the Categories section beneath the post*/
.single-post .post-meta-wrapper {
   display: none;
}

/*Hide 'Login TO Access Site' On Login Page*/
.request-membership.groups #nav-courses-groups-li{
    display: none;
}

/* Prevent Editing Of BBoss Fields */
#profile-edit-form .field_nickname input,
#profile-edit-form .field_first-name input,
#profile-edit-form .field_email input,
#profile-edit-form .field_phone input,
#profile-edit-form .field_ref-no input,
#profile-edit-form .field_last-name input { 
    pointer-events: none; 
}

/* Change Buddypanel Font Size */
.logged-in .buddypanel-menu a {
    font-size: 13px;
}

/* Style RoleSwitcher Button */
.role-switch-container .button {
    display: inline-block;
    margin: 10px;
    padding: 10px 20px;
    background-color: #00BCD4;
    color: #fff;
    text-decoration: none;
    border-radius: 5px;
}

.role-switch-container .button:hover {
    background-color: #005177;
}

.role-content {
    margin-top: 20px;
}

/*Hide BuddyPanel On Mobile*/
@media (max-width: 767px) { 
    .buddypanel { 
        display: none !important; 
    } 
}

    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
}

    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
}

    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
}

    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
}

/* =====================================================
===================================================== */

    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
}

    display: none !important;
    visibility: hidden !important;
}

    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
}

    display: none !important;
    visibility: hidden !important;