/* FOLLO Responsive Layout Layer — v3.1.6 */

body.follo-ui .buddypress *,
body.follo-ui #buddypress *,
body.follo-ui .buddypress-wrap * {
	box-sizing: border-box;
	min-width: 0;
}

body.follo-ui img,
body.follo-ui video,
body.follo-ui iframe {
	max-width: 100%;
}

/* Timeline action bars */
body.follo-ui .activity-list .activity-meta,
body.follo-ui .activity-list .activity-content .activity-meta,
body.follo-ui .activity-list .follo-activity-actions,
body.follo-ui .activity-list .follo-post-actions,
body.follo-ui .follo-social-feed .activity-meta,
body.follo-ui .follo-social-feed .follo-activity-actions,
body.follo-ui .follo-social-feed .follo-post-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	width: 100%;
}

body.follo-ui .activity-list .activity-meta > *,
body.follo-ui .activity-list .follo-activity-actions > *,
body.follo-ui .activity-list .follo-post-actions > *,
body.follo-ui .follo-social-feed .activity-meta > *,
body.follo-ui .follo-social-feed .follo-activity-actions > *,
body.follo-ui .follo-social-feed .follo-post-actions > * {
	flex: 0 1 auto;
	margin: 0 !important;
}

body.follo-ui .activity-list .activity-meta a,
body.follo-ui .activity-list .activity-meta button,
body.follo-ui .activity-list .follo-activity-actions a,
body.follo-ui .activity-list .follo-activity-actions button,
body.follo-ui .activity-list .follo-post-actions a,
body.follo-ui .activity-list .follo-post-actions button,
body.follo-ui .follo-social-feed .activity-meta a,
body.follo-ui .follo-social-feed .activity-meta button,
body.follo-ui .follo-social-feed .follo-activity-actions a,
body.follo-ui .follo-social-feed .follo-activity-actions button,
body.follo-ui .follo-social-feed .follo-post-actions a,
body.follo-ui .follo-social-feed .follo-post-actions button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-height: 38px;
	padding: 8px 11px;
	white-space: nowrap;
	line-height: 1.2;
}

/* Reaction popovers */
body.follo-ui .reaction-picker,
body.follo-ui .reactions-picker,
body.follo-ui .follo-reaction-picker,
body.follo-ui .follo-reactions-popover,
body.follo-ui .activity-reactions-popover {
	max-width: min(92vw, 420px) !important;
	width: max-content;
	white-space: normal;
}

body.follo-ui .reaction-picker ul,
body.follo-ui .reactions-picker ul,
body.follo-ui .follo-reaction-picker ul,
body.follo-ui .follo-reactions-popover ul {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 6px;
	max-width: 100%;
}

/* Filters/search/widgets */
body.follo-ui .bp-filter,
body.follo-ui .dir-search,
body.follo-ui .bp-search,
body.follo-ui .message-search,
body.follo-ui .bp-messages-search-form,
body.follo-ui .widget,
body.follo-ui .follo-widget,
body.follo-ui [class*="follo-"][class*="widget"],
body.follo-ui .follo-sidebar {
	max-width: 100%;
}

@media (max-width: 1100px) {
	body.follo-ui .bp-navs.bp-subnavs ul,
	body.follo-ui #buddypress .item-list-tabs#subnav ul {
		flex-wrap: nowrap !important;
		overflow-x: auto !important;
		scrollbar-width: none;
	}

	body.follo-ui .bp-navs.bp-subnavs ul::-webkit-scrollbar,
	body.follo-ui #buddypress .item-list-tabs#subnav ul::-webkit-scrollbar {
		display: none;
	}

	body.follo-ui .bp-navs.bp-subnavs li,
	body.follo-ui #buddypress .item-list-tabs#subnav li {
		flex: 0 0 auto !important;
		min-width: max-content !important;
	}
}

@media (max-width: 767px) {
	body.follo-ui .buddypress,
	body.follo-ui #buddypress,
	body.follo-ui .buddypress-wrap {
		width: 100%;
		max-width: 100%;
		overflow-x: clip;
	}

	/* Like / Comment / Share: equal-width, no overlap */
	body.follo-ui .activity-list .activity-meta,
	body.follo-ui .activity-list .activity-content .activity-meta,
	body.follo-ui .activity-list .follo-activity-actions,
	body.follo-ui .activity-list .follo-post-actions,
	body.follo-ui .follo-social-feed .activity-meta,
	body.follo-ui .follo-social-feed .follo-activity-actions,
	body.follo-ui .follo-social-feed .follo-post-actions {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 6px;
	}

	body.follo-ui .activity-list .activity-meta > *,
	body.follo-ui .activity-list .follo-activity-actions > *,
	body.follo-ui .activity-list .follo-post-actions > *,
	body.follo-ui .follo-social-feed .activity-meta > *,
	body.follo-ui .follo-social-feed .follo-activity-actions > *,
	body.follo-ui .follo-social-feed .follo-post-actions > * {
		width: 100%;
		min-width: 0;
	}

	body.follo-ui .activity-list .activity-meta a,
	body.follo-ui .activity-list .activity-meta button,
	body.follo-ui .activity-list .follo-activity-actions a,
	body.follo-ui .activity-list .follo-activity-actions button,
	body.follo-ui .activity-list .follo-post-actions a,
	body.follo-ui .activity-list .follo-post-actions button,
	body.follo-ui .follo-social-feed .activity-meta a,
	body.follo-ui .follo-social-feed .activity-meta button,
	body.follo-ui .follo-social-feed .follo-activity-actions a,
	body.follo-ui .follo-social-feed .follo-activity-actions button,
	body.follo-ui .follo-social-feed .follo-post-actions a,
	body.follo-ui .follo-social-feed .follo-post-actions button {
		width: 100%;
		min-width: 0;
		padding: 9px 6px;
		font-size: 13px;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	/* Reaction picker stays in viewport */
	body.follo-ui .reaction-picker,
	body.follo-ui .reactions-picker,
	body.follo-ui .follo-reaction-picker,
	body.follo-ui .follo-reactions-popover,
	body.follo-ui .activity-reactions-popover {
		left: 50% !important;
		right: auto !important;
		transform: translateX(-50%);
		max-width: calc(100vw - 24px) !important;
		padding: 8px !important;
	}

	/* Search/filter controls and widgets go full-width */
	body.follo-ui .bp-filter,
	body.follo-ui .dir-search,
	body.follo-ui .bp-search,
	body.follo-ui .message-search,
	body.follo-ui .bp-messages-search-form,
	body.follo-ui .follo-sidebar,
	body.follo-ui .widget,
	body.follo-ui .follo-widget,
	body.follo-ui [class*="follo-"][class*="widget"] {
		width: 100%;
		max-width: 100%;
	}
}

@media (max-width: 420px) {
	body.follo-ui .activity-list .activity-meta a,
	body.follo-ui .activity-list .activity-meta button,
	body.follo-ui .activity-list .follo-activity-actions a,
	body.follo-ui .activity-list .follo-activity-actions button,
	body.follo-ui .activity-list .follo-post-actions a,
	body.follo-ui .activity-list .follo-post-actions button,
	body.follo-ui .follo-social-feed .activity-meta a,
	body.follo-ui .follo-social-feed .activity-meta button,
	body.follo-ui .follo-social-feed .follo-activity-actions a,
	body.follo-ui .follo-social-feed .follo-activity-actions button,
	body.follo-ui .follo-social-feed .follo-post-actions a,
	body.follo-ui .follo-social-feed .follo-post-actions button {
		font-size: 12px;
		padding-left: 4px;
		padding-right: 4px;
		gap: 4px;
	}
}


/* =========================================================
   FOLLO GLOBAL STYLING v3.1.7
   Mobile member navigation edge protection
   ========================================================= */

@media (max-width: 767px) {
    /*
     * Give the horizontally scrolling primary member navigation breathing
     * room at both ends, so Activity is not glued to the viewport edge and
     * the last tab is not clipped.
     */
    body.follo-ui .bp-navs:not(.bp-subnavs) > ul,
    body.follo-ui #buddypress .item-list-tabs:not(#subnav) > ul {
        padding-left: 12px !important;
        padding-right: 12px !important;
        scroll-padding-left: 12px;
        scroll-padding-right: 12px;
        gap: 3px !important;
    }

    body.follo-ui .bp-navs:not(.bp-subnavs) li:first-child,
    body.follo-ui #buddypress .item-list-tabs:not(#subnav) li:first-child {
        margin-left: 0 !important;
    }

    body.follo-ui .bp-navs:not(.bp-subnavs) li:last-child,
    body.follo-ui #buddypress .item-list-tabs:not(#subnav) li:last-child {
        margin-right: 0 !important;
    }

    /*
     * Activity/profile subtabs get protected left/right space too. Keep them
     * on one line and scroll instead of clipping text.
     */
    body.follo-ui .bp-navs.bp-subnavs,
    body.follo-ui #buddypress .item-list-tabs#subnav {
        width: calc(100% - 16px) !important;
        max-width: calc(100% - 16px) !important;
        margin-left: 8px !important;
        margin-right: 8px !important;
    }

    body.follo-ui .bp-navs.bp-subnavs > ul,
    body.follo-ui #buddypress .item-list-tabs#subnav > ul {
        padding-left: 6px !important;
        padding-right: 6px !important;
        scroll-padding-left: 6px;
        scroll-padding-right: 6px;
    }
}


/* =========================================================
   FOLLO GLOBAL STYLING v3.1.8
   Member primary navigation: 5 equal centered tabs per viewport
   ========================================================= */

/*
 * This rule intentionally lives in Global Styling because this stylesheet
 * loads after the child-theme member-nav rules. The Divi child owns the
 * markup; Global Styling owns the final narrow-screen presentation.
 */
@media (max-width: 767px) {

    html body.follo-ui.buddypress.bp-user #object-nav,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs,
    html body.follo-ui.buddypress.bp-user nav#object-nav {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    html body.follo-ui.buddypress.bp-user #object-nav > ul,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul,
    html body.follo-ui.buddypress.bp-user nav#object-nav > ul {
        display: flex !important;
        flex-flow: row nowrap !important;
        align-items: stretch !important;

        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 6px !important;

        gap: 3px !important;

        overflow-x: auto !important;
        overflow-y: hidden !important;

        scroll-padding-inline: 6px !important;
        scroll-snap-type: x proximity;

        -webkit-overflow-scrolling: touch;
        scrollbar-width: none !important;
        box-sizing: border-box !important;
    }

    html body.follo-ui.buddypress.bp-user #object-nav > ul::-webkit-scrollbar,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul::-webkit-scrollbar,
    html body.follo-ui.buddypress.bp-user nav#object-nav > ul::-webkit-scrollbar {
        display: none !important;
    }

    /*
     * Exactly five equal tab spaces fill the visible rail.
     * Additional member tabs continue horizontally off-screen.
     */
    html body.follo-ui.buddypress.bp-user #object-nav > ul > li,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li,
    html body.follo-ui.buddypress.bp-user nav#object-nav > ul > li {
        flex: 0 0 calc((100% - 12px) / 5) !important;
        width: calc((100% - 12px) / 5) !important;
        min-width: 0 !important;
        max-width: none !important;

        margin: 0 !important;
        padding: 0 !important;

        scroll-snap-align: start;
        box-sizing: border-box !important;
    }

    html body.follo-ui.buddypress.bp-user #object-nav > ul > li > a,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li > a,
    html body.follo-ui.buddypress.bp-user nav#object-nav > ul > li > a {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        height: 100% !important;
        min-width: 0 !important;
        min-height: 46px !important;

        margin: 0 !important;
        padding: 9px 4px !important;

        text-align: center !important;
        white-space: nowrap !important;

        font-size: 12px !important;
        line-height: 1.1 !important;

        box-sizing: border-box !important;
    }

    /* Remove the old Activity-only left alignment override. */
    html body.follo-ui.buddypress.bp-user #object-nav > ul > li:first-child > a,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li:first-child > a {
        padding-left: 4px !important;
        padding-right: 4px !important;
        text-align: center !important;
        justify-content: center !important;
    }

    /* Keep the active underline centered within the full tab cell. */
    html body.follo-ui.buddypress.bp-user
    #object-nav > ul > li.current > a::after,
    html body.follo-ui.buddypress.bp-user
    #object-nav > ul > li.selected > a::after,
    html body.follo-ui.buddypress.bp-user
    .bp-navs.main-navs > ul > li.current > a::after,
    html body.follo-ui.buddypress.bp-user
    .bp-navs.main-navs > ul > li.selected > a::after {
        left: 8px !important;
        right: 8px !important;
    }
}

@media (max-width: 430px) {
    html body.follo-ui.buddypress.bp-user #object-nav > ul,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul {
        padding-left: 4px !important;
        padding-right: 4px !important;
        gap: 2px !important;
    }

    html body.follo-ui.buddypress.bp-user #object-nav > ul > li,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li {
        flex-basis: calc((100% - 8px) / 5) !important;
        width: calc((100% - 8px) / 5) !important;
    }

    html body.follo-ui.buddypress.bp-user #object-nav > ul > li > a,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li > a {
        padding-left: 2px !important;
        padding-right: 2px !important;
        font-size: 11px !important;
    }
}


/* =========================================================
   FOLLO GLOBAL STYLING v3.1.9
   Exact 100% mobile member-nav distribution
   ========================================================= */

@media (max-width: 767px) {

    /* No outside gutter: the rail must touch both page edges. */
    html body.follo-ui.buddypress.bp-user #object-nav,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs,
    html body.follo-ui.buddypress.bp-user nav#object-nav {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    html body.follo-ui.buddypress.bp-user #object-nav > ul,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul,
    html body.follo-ui.buddypress.bp-user nav#object-nav > ul {
        display: flex !important;
        flex-flow: row nowrap !important;
        align-items: stretch !important;

        width: 100% !important;
        max-width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;
        gap: 0 !important;

        overflow-x: auto !important;
        overflow-y: hidden !important;

        scroll-padding-inline: 0 !important;
        scrollbar-width: none !important;
        box-sizing: border-box !important;
    }

    html body.follo-ui.buddypress.bp-user #object-nav > ul::-webkit-scrollbar,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul::-webkit-scrollbar,
    html body.follo-ui.buddypress.bp-user nav#object-nav > ul::-webkit-scrollbar {
        display: none !important;
    }

    /*
     * Exactly five equal cells = 20% each.
     * There is no gap, no padding and no extra space after Messages.
     */
    html body.follo-ui.buddypress.bp-user #object-nav > ul > li,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li,
    html body.follo-ui.buddypress.bp-user nav#object-nav > ul > li {
        flex: 0 0 20% !important;
        width: 20% !important;
        min-width: 20% !important;
        max-width: 20% !important;

        margin: 0 !important;
        padding: 0 !important;

        box-sizing: border-box !important;
    }

    html body.follo-ui.buddypress.bp-user #object-nav > ul > li > a,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li > a,
    html body.follo-ui.buddypress.bp-user nav#object-nav > ul > li > a {
        position: relative !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        min-width: 0 !important;
        min-height: 46px !important;

        margin: 0 !important;
        padding: 9px 3px !important;

        text-align: center !important;
        white-space: nowrap !important;

        font-size: 12px !important;
        line-height: 1.1 !important;

        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    /* Activity uses the same centered geometry as every other tab. */
    html body.follo-ui.buddypress.bp-user #object-nav > ul > li:first-child > a,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li:first-child > a {
        padding-left: 3px !important;
        padding-right: 3px !important;
        justify-content: center !important;
        text-align: center !important;
    }

    /* Keep BuddyPress notification count inside the Notifications cell. */
    html body.follo-ui.buddypress.bp-user #object-nav > ul > li > a .count,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li > a .count,
    html body.follo-ui.buddypress.bp-user nav#object-nav > ul > li > a .count {
        position: static !important;
        inset: auto !important;
        transform: none !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        flex: 0 0 auto !important;

        margin: 0 0 0 4px !important;
        padding: 0 5px !important;

        min-width: 18px !important;
        height: 18px !important;

        line-height: 18px !important;
        box-sizing: border-box !important;
    }

    /* Active underline stays inside its exact 20% cell. */
    html body.follo-ui.buddypress.bp-user #object-nav > ul > li.current > a::after,
    html body.follo-ui.buddypress.bp-user #object-nav > ul > li.selected > a::after,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li.current > a::after,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li.selected > a::after {
        left: 0 !important;
        right: 0 !important;
        width: auto !important;
    }
}

/* Slightly reduce type on very narrow screens, but keep the 20% split exact. */
@media (max-width: 430px) {
    html body.follo-ui.buddypress.bp-user #object-nav > ul > li > a,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li > a {
        padding-left: 2px !important;
        padding-right: 2px !important;
        font-size: 11px !important;
    }

    html body.follo-ui.buddypress.bp-user #object-nav > ul > li > a .count,
    html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li > a .count {
        margin-left: 3px !important;
        padding-left: 4px !important;
        padding-right: 4px !important;
        min-width: 17px !important;
        height: 17px !important;
        line-height: 17px !important;
        font-size: 10px !important;
    }
}


/* =========================================================
   FOLLO GLOBAL STYLING v3.1.10
   Mobile primary-nav weighted distribution
   ========================================================= */

@media (max-width: 767px) {

	/*
	 * The five visible primary tabs still total exactly 100%, but
	 * Notifications gets more room for its longer label + badge.
	 *
	 * Activity       18%
	 * Profile        16%
	 * Notifications  25%
	 * Professional   23%
	 * Messages       18%
	 * TOTAL         100%
	 */

	html body.follo-ui.buddypress.bp-user #object-nav > ul > li:nth-child(1),
	html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li:nth-child(1) {
		flex: 0 0 18% !important;
		width: 18% !important;
		min-width: 18% !important;
		max-width: 18% !important;
	}

	html body.follo-ui.buddypress.bp-user #object-nav > ul > li:nth-child(2),
	html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li:nth-child(2) {
		flex: 0 0 16% !important;
		width: 16% !important;
		min-width: 16% !important;
		max-width: 16% !important;
	}

	html body.follo-ui.buddypress.bp-user #object-nav > ul > li:nth-child(3),
	html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li:nth-child(3) {
		flex: 0 0 25% !important;
		width: 25% !important;
		min-width: 25% !important;
		max-width: 25% !important;
	}

	html body.follo-ui.buddypress.bp-user #object-nav > ul > li:nth-child(4),
	html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li:nth-child(4) {
		flex: 0 0 23% !important;
		width: 23% !important;
		min-width: 23% !important;
		max-width: 23% !important;
	}

	html body.follo-ui.buddypress.bp-user #object-nav > ul > li:nth-child(5),
	html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li:nth-child(5) {
		flex: 0 0 18% !important;
		width: 18% !important;
		min-width: 18% !important;
		max-width: 18% !important;
	}

	/* Keep every label centered inside its weighted cell. */
	html body.follo-ui.buddypress.bp-user #object-nav > ul > li > a,
	html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li > a {
		justify-content: center !important;
		text-align: center !important;
		padding-left: 3px !important;
		padding-right: 3px !important;
		overflow: visible !important;
	}

	/* Notifications badge remains inside the wider Notifications cell. */
	html body.follo-ui.buddypress.bp-user #object-nav > ul > li:nth-child(3) > a,
	html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li:nth-child(3) > a {
		gap: 3px !important;
	}

	html body.follo-ui.buddypress.bp-user #object-nav > ul > li:nth-child(3) > a .count,
	html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li:nth-child(3) > a .count {
		margin-left: 2px !important;
		flex: 0 0 auto !important;
	}
}

@media (max-width: 430px) {
	html body.follo-ui.buddypress.bp-user #object-nav > ul > li > a,
	html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li > a {
		font-size: 10.5px !important;
		padding-left: 2px !important;
		padding-right: 2px !important;
	}

	html body.follo-ui.buddypress.bp-user #object-nav > ul > li:nth-child(3) > a .count,
	html body.follo-ui.buddypress.bp-user .bp-navs.main-navs > ul > li:nth-child(3) > a .count {
		margin-left: 1px !important;
	}
}


/* =========================================================
   FOLLO GLOBAL STYLING v3.1.12
   Mobile Activity subnav vertical rhythm
   ========================================================= */

@media (max-width: 767px) {
    /*
     * Give Personal / Mentions / Favorites / Friends / Groups
     * a little breathing room from the sidebar widget above,
     * while keeping the "What's new" composer visually connected below.
     */
    html body.follo-ui.buddypress.bp-user
    .bp-navs.bp-subnavs,
    html body.follo-ui.buddypress.bp-user
    #buddypress .item-list-tabs#subnav {
        margin-top: 14px !important;
        margin-bottom: 12px !important;
    }

    /*
     * If older puzzle-tip rules shift the rail upward, neutralize that
     * on narrow screens so the spacing remains predictable.
     */
    html body.follo-ui.buddypress.bp-user
    .bp-navs.bp-subnavs,
    html body.follo-ui.buddypress.bp-user
    #buddypress .item-list-tabs#subnav {
        transform: none !important;
    }
}

@media (max-width: 430px) {
    html body.follo-ui.buddypress.bp-user
    .bp-navs.bp-subnavs,
    html body.follo-ui.buddypress.bp-user
    #buddypress .item-list-tabs#subnav {
        margin-top: 12px !important;
        margin-bottom: 10px !important;
    }
}