/**
 * TMO Global UI: shared BuddyBoss frontend shell.
 *
 * Server-side shell classes are independent from content-adapter activation so
 * protected content remains untouched. These rules style only confirmed theme
 * shell roots and deliberately leave native visibility, positioning, stacking,
 * transforms and menu behavior to BuddyBoss.
 */

body.tmo-ui-shell {
	--tmo-ui-shell-control: var(--tmo-ui-touch-target);
	--tmo-ui-shell-radius: var(--tmo-ui-radius-button);
	--tmo-ui-shell-surface: var(--tmo-ui-surface);
	--tmo-ui-shell-surface-hover: var(--tmo-ui-brand-soft);
	--tmo-ui-shell-text: var(--tmo-ui-text);
	--tmo-ui-shell-text-muted: var(--tmo-ui-text-secondary);
	--tmo-ui-shell-border: var(--tmo-ui-border);
	--tmo-ui-shell-accent: var(--tmo-ui-link);
	--tmo-ui-shell-accent-hover: var(--tmo-ui-link-hover);
}

/* Desktop header and brand */
body.tmo-ui-shell #masthead.site-header.site-header--bb {
	border-bottom: var(--tmo-ui-border-width) solid var(--tmo-ui-shell-border);
	background-color: var(--tmo-ui-shell-surface);
	box-shadow: var(--tmo-ui-shadow-xs);
	color: var(--tmo-ui-shell-text);
	font-family: var(--tmo-ui-font-body);
}

body.tmo-ui-shell #masthead.site-header.site-header--bb .container.site-header-container {
	gap: var(--tmo-ui-space-4);
}

body.tmo-ui-shell #masthead.site-header.site-header--bb #site-logo.site-branding,
body.tmo-ui-shell #masthead.site-header.site-header--bb #site-logo.site-branding a {
	color: var(--tmo-ui-shell-text);
	font-family: var(--tmo-ui-font-heading);
	font-weight: var(--tmo-ui-font-weight-bold);
	text-decoration: none;
}

body.tmo-ui-shell #masthead.site-header.site-header--bb #site-logo.site-branding a {
	min-height: var(--tmo-ui-shell-control);
	border-radius: var(--tmo-ui-shell-radius);
}

/* Desktop main navigation */
body.tmo-ui-shell #masthead.site-header.site-header--bb #site-navigation.main-navigation :where(
	#primary-navbar,
	#navbar-collapse
) {
	color: var(--tmo-ui-shell-text);
	font-family: var(--tmo-ui-font-body);
}

body.tmo-ui-shell #masthead.site-header.site-header--bb #site-navigation.main-navigation #primary-navbar > li > a,
body.tmo-ui-shell #masthead.site-header.site-header--bb #site-navigation.main-navigation #navbar-collapse > ul > li > a {
	box-sizing: border-box;
	min-height: var(--tmo-ui-shell-control);
	padding: var(--tmo-ui-space-2) var(--tmo-ui-space-3);
	border-radius: var(--tmo-ui-shell-radius);
	color: var(--tmo-ui-shell-text-muted);
	font-family: var(--tmo-ui-font-body);
	font-size: var(--tmo-ui-font-size-sm);
	font-weight: var(--tmo-ui-font-weight-semibold);
	line-height: var(--tmo-ui-line-height-ui);
	text-decoration: none;
	transition:
		background-color var(--tmo-ui-duration-fast) var(--tmo-ui-ease-standard),
		color var(--tmo-ui-duration-fast) var(--tmo-ui-ease-standard);
}

body.tmo-ui-shell #masthead.site-header.site-header--bb #site-navigation.main-navigation #primary-navbar > li > a:hover,
body.tmo-ui-shell #masthead.site-header.site-header--bb #site-navigation.main-navigation #navbar-collapse > ul > li > a:hover {
	background-color: var(--tmo-ui-shell-surface-hover);
	color: var(--tmo-ui-shell-accent-hover);
}

body.tmo-ui-shell #masthead.site-header.site-header--bb #site-navigation.main-navigation #primary-navbar > :where(
	.current-menu-item,
	.current-menu-ancestor,
	.current_page_item,
	.current_page_ancestor
) > a,
body.tmo-ui-shell #masthead.site-header.site-header--bb #site-navigation.main-navigation #primary-navbar > li > a[aria-current="page"],
body.tmo-ui-shell #masthead.site-header.site-header--bb #site-navigation.main-navigation #navbar-collapse > ul > :where(
	.current-menu-item,
	.current-menu-ancestor,
	.current_page_item,
	.current_page_ancestor
) > a,
body.tmo-ui-shell #masthead.site-header.site-header--bb #site-navigation.main-navigation #navbar-collapse > ul > li > a[aria-current="page"] {
	background-color: var(--tmo-ui-shell-surface-hover);
	color: var(--tmo-ui-shell-accent-hover);
	font-weight: var(--tmo-ui-font-weight-bold);
}

body.tmo-ui-shell #masthead.site-header.site-header--bb #site-navigation.main-navigation #primary-navbar > li > ul.sub-menu,
body.tmo-ui-shell #masthead.site-header.site-header--bb #site-navigation.main-navigation #navbar-collapse > ul > li > ul.sub-menu {
	border: var(--tmo-ui-border-width) solid var(--tmo-ui-shell-border);
	border-radius: var(--tmo-ui-radius-card);
	background-color: var(--tmo-ui-surface-raised);
	box-shadow: var(--tmo-ui-shadow-md);
}

body.tmo-ui-shell #masthead.site-header.site-header--bb #site-navigation.main-navigation #primary-navbar > li > ul.sub-menu a,
body.tmo-ui-shell #masthead.site-header.site-header--bb #site-navigation.main-navigation #navbar-collapse > ul > li > ul.sub-menu a {
	box-sizing: border-box;
	min-height: var(--tmo-ui-shell-control);
	padding: var(--tmo-ui-space-2) var(--tmo-ui-space-4);
	color: var(--tmo-ui-shell-text-muted);
	font-family: var(--tmo-ui-font-body);
	font-size: var(--tmo-ui-font-size-sm);
	font-weight: var(--tmo-ui-font-weight-medium);
	line-height: var(--tmo-ui-line-height-ui);
	text-decoration: none;
}

body.tmo-ui-shell #masthead.site-header.site-header--bb #site-navigation.main-navigation #primary-navbar > li > ul.sub-menu a:hover,
body.tmo-ui-shell #masthead.site-header.site-header--bb #site-navigation.main-navigation #navbar-collapse > ul > li > ul.sub-menu a:hover {
	background-color: var(--tmo-ui-shell-surface-hover);
	color: var(--tmo-ui-shell-accent-hover);
}

/* Header utility controls and search */
body.tmo-ui-shell #masthead.site-header.site-header--bb #header-aside.header-aside .header-aside-inner {
	gap: var(--tmo-ui-space-2);
	color: var(--tmo-ui-shell-text);
	font-family: var(--tmo-ui-font-body);
}

body.tmo-ui-shell #masthead.site-header.site-header--bb :where(
	.header-search-link,
	.notification-wrap > a,
	.header-cart-link,
	#header-aside.header-aside .user-wrap-container > a,
	#header-aside.header-aside .user-wrap-container .user-link
) {
	box-sizing: border-box;
	min-width: var(--tmo-ui-shell-control);
	min-height: var(--tmo-ui-shell-control);
	border-radius: var(--tmo-ui-shell-radius);
	color: var(--tmo-ui-shell-text-muted);
	text-decoration: none;
	transition:
		background-color var(--tmo-ui-duration-fast) var(--tmo-ui-ease-standard),
		color var(--tmo-ui-duration-fast) var(--tmo-ui-ease-standard);
}

body.tmo-ui-shell #masthead.site-header.site-header--bb :where(
	.header-search-link,
	.notification-wrap > a,
	.header-cart-link,
	#header-aside.header-aside .user-wrap-container > a,
	#header-aside.header-aside .user-wrap-container .user-link
):hover {
	background-color: var(--tmo-ui-shell-surface-hover);
	color: var(--tmo-ui-shell-accent-hover);
}

body.tmo-ui-shell #masthead.site-header.site-header--bb .header-search-wrap {
	border: var(--tmo-ui-border-width) solid var(--tmo-ui-shell-border);
	border-radius: var(--tmo-ui-radius-card);
	background-color: var(--tmo-ui-surface-raised);
	box-shadow: var(--tmo-ui-shadow-md);
	color: var(--tmo-ui-shell-text);
	font-family: var(--tmo-ui-font-body);
}

/*
 * Unavoidable legacy bridge 1–2: live #wp-custom-css loads after this bundle
 * and forces the search wrapper/form to #1a1a1a with white text via !important.
 * These exact shell-root declarations replace only those two forced properties.
 */
body.tmo-ui-shell #masthead.site-header.site-header--bb .header-search-wrap,
body.tmo-ui-shell #masthead.site-header.site-header--bb .header-search-wrap .search-form {
	background-color: var(--tmo-ui-surface-raised) !important;
	color: var(--tmo-ui-shell-text) !important;
}

body.tmo-ui-shell #masthead.site-header.site-header--bb .header-search-wrap :where(
	input[type="search"],
	input[type="text"],
	.search-field
) {
	box-sizing: border-box;
	min-height: var(--tmo-ui-shell-control);
	border: var(--tmo-ui-border-width) solid var(--tmo-ui-border-strong);
	border-radius: var(--tmo-ui-radius-input);
	background-color: var(--tmo-ui-shell-surface);
	color: var(--tmo-ui-shell-text);
	font-family: var(--tmo-ui-font-body);
	font-size: var(--tmo-ui-font-size-md);
}

/*
 * Unavoidable legacy bridge 3–4: the same live #wp-custom-css rule forces the
 * search input background and text. Width and every behavioral property remain
 * owned by BuddyBoss.
 */
body.tmo-ui-shell #masthead.site-header.site-header--bb .header-search-wrap .search-form input[type="search"] {
	background-color: var(--tmo-ui-shell-surface) !important;
	color: var(--tmo-ui-shell-text) !important;
}

body.tmo-ui-shell #masthead.site-header.site-header--bb .header-search-wrap :where(
	input[type="search"],
	input[type="text"],
	.search-field
)::placeholder {
	color: var(--tmo-ui-text-muted);
	opacity: 1;
}

/* Desktop account/avatar dropdown */
body.tmo-ui-shell #masthead.site-header.site-header--bb #header-aside.header-aside .user-wrap-container > .sub-menu > .wrapper > .sub-menu-inner {
	padding: var(--tmo-ui-space-2);
	border: var(--tmo-ui-border-width) solid var(--tmo-ui-shell-border);
	border-radius: var(--tmo-ui-radius-card);
	background-color: var(--tmo-ui-surface-raised);
	box-shadow: var(--tmo-ui-shadow-md);
	color: var(--tmo-ui-shell-text);
	font-family: var(--tmo-ui-font-body);
}

body.tmo-ui-shell #masthead.site-header.site-header--bb #header-aside.header-aside .user-wrap-container > .sub-menu > .wrapper > .sub-menu-inner > li > a.ab-item {
	box-sizing: border-box;
	min-height: var(--tmo-ui-shell-control);
	padding: var(--tmo-ui-space-2) var(--tmo-ui-space-3);
	border-radius: var(--tmo-ui-radius-input);
	color: var(--tmo-ui-shell-text-muted);
	font-size: var(--tmo-ui-font-size-sm);
	font-weight: var(--tmo-ui-font-weight-medium);
	line-height: var(--tmo-ui-line-height-ui);
	text-decoration: none;
	transition:
		background-color var(--tmo-ui-duration-fast) var(--tmo-ui-ease-standard),
		color var(--tmo-ui-duration-fast) var(--tmo-ui-ease-standard);
}

body.tmo-ui-shell #masthead.site-header.site-header--bb #header-aside.header-aside .user-wrap-container > .sub-menu > .wrapper > .sub-menu-inner > li > a.ab-item:hover,
body.tmo-ui-shell #masthead.site-header.site-header--bb #header-aside.header-aside .user-wrap-container > .sub-menu > .wrapper > .sub-menu-inner > li.current-menu-item > a.ab-item {
	background-color: var(--tmo-ui-shell-surface-hover);
	color: var(--tmo-ui-shell-accent-hover);
}

body.tmo-ui-shell #masthead.site-header.site-header--bb #header-aside.header-aside .user-wrap-container > .sub-menu > .wrapper > .sub-menu-inner > li > a.ab-item :where(
	.bb-icon-l,
	.bb-icon-f
) {
	color: var(--tmo-ui-shell-accent);
}

/* Authenticated BuddyPanel */
body.tmo-ui-shell aside.buddypanel {
	border-right: var(--tmo-ui-border-width) solid var(--tmo-ui-shell-border);
	background-color: var(--tmo-ui-shell-surface);
	box-shadow: var(--tmo-ui-shadow-xs);
	color: var(--tmo-ui-shell-text);
	font-family: var(--tmo-ui-font-body);
}

body.tmo-ui-shell aside.buddypanel :where(
	.side-panel-menu,
	nav
) a {
	box-sizing: border-box;
	min-height: var(--tmo-ui-shell-control);
	padding-block: var(--tmo-ui-space-2);
	border-radius: var(--tmo-ui-shell-radius);
	color: var(--tmo-ui-shell-text-muted);
	font-size: var(--tmo-ui-font-size-sm);
	font-weight: var(--tmo-ui-font-weight-semibold);
	line-height: var(--tmo-ui-line-height-ui);
	text-decoration: none;
	transition:
		background-color var(--tmo-ui-duration-fast) var(--tmo-ui-ease-standard),
		color var(--tmo-ui-duration-fast) var(--tmo-ui-ease-standard);
}

body.tmo-ui-shell aside.buddypanel :where(
	.side-panel-menu,
	nav
) a:hover {
	background-color: var(--tmo-ui-shell-surface-hover);
	color: var(--tmo-ui-shell-accent-hover);
}

body.tmo-ui-shell aside.buddypanel :where(
	.side-panel-menu,
	nav
) :where(
	.current-menu-item,
	.current-menu-ancestor,
	.current_page_item,
	.current_page_ancestor
) > a,
body.tmo-ui-shell aside.buddypanel :where(
	.side-panel-menu,
	nav
) a[aria-current="page"] {
	background-color: var(--tmo-ui-shell-surface-hover);
	color: var(--tmo-ui-shell-accent-hover);
	font-weight: var(--tmo-ui-font-weight-bold);
}

/* Mobile header and native off-canvas panel */
body.tmo-ui-shell .bb-mobile-header-wrapper .bb-mobile-header {
	border-bottom: var(--tmo-ui-border-width) solid var(--tmo-ui-shell-border);
	background-color: var(--tmo-ui-shell-surface);
	box-shadow: var(--tmo-ui-shadow-xs);
	color: var(--tmo-ui-shell-text);
	font-family: var(--tmo-ui-font-body);
}

body.tmo-ui-shell .bb-mobile-header-wrapper .bb-mobile-header :where(
	a,
	button
) {
	box-sizing: border-box;
	min-width: var(--tmo-ui-shell-control);
	min-height: var(--tmo-ui-shell-control);
	border-radius: var(--tmo-ui-shell-radius);
	color: var(--tmo-ui-shell-text-muted);
}

body.tmo-ui-shell .bb-mobile-header-wrapper .bb-mobile-header :where(
	a,
	button
):hover {
	background-color: var(--tmo-ui-shell-surface-hover);
	color: var(--tmo-ui-shell-accent-hover);
}

body.tmo-ui-shell .bb-mobile-panel-wrapper .bb-mobile-panel-inner {
	border-right: var(--tmo-ui-border-width) solid var(--tmo-ui-shell-border);
	background-color: var(--tmo-ui-surface-raised);
	box-shadow: var(--tmo-ui-shadow-modal);
	color: var(--tmo-ui-shell-text);
	font-family: var(--tmo-ui-font-body);
}

body.tmo-ui-shell .bb-mobile-panel-wrapper .bb-mobile-panel-inner :where(
	nav,
	.side-panel-menu,
	.bb-mobile-panel-menu
) a {
	box-sizing: border-box;
	min-height: var(--tmo-ui-shell-control);
	padding: var(--tmo-ui-space-2) var(--tmo-ui-space-3);
	border-radius: var(--tmo-ui-shell-radius);
	color: var(--tmo-ui-shell-text-muted);
	font-size: var(--tmo-ui-font-size-md);
	font-weight: var(--tmo-ui-font-weight-semibold);
	line-height: var(--tmo-ui-line-height-ui);
	text-decoration: none;
	transition:
		background-color var(--tmo-ui-duration-fast) var(--tmo-ui-ease-standard),
		color var(--tmo-ui-duration-fast) var(--tmo-ui-ease-standard);
}

body.tmo-ui-shell .bb-mobile-panel-wrapper .bb-mobile-panel-inner :where(
	nav,
	.side-panel-menu,
	.bb-mobile-panel-menu
) a:hover {
	background-color: var(--tmo-ui-shell-surface-hover);
	color: var(--tmo-ui-shell-accent-hover);
}

body.tmo-ui-shell .bb-mobile-panel-wrapper .bb-mobile-panel-inner :where(
	nav,
	.side-panel-menu,
	.bb-mobile-panel-menu
) :where(
	.current-menu-item,
	.current-menu-ancestor,
	.current_page_item,
	.current_page_ancestor
) > a,
body.tmo-ui-shell .bb-mobile-panel-wrapper .bb-mobile-panel-inner :where(
	nav,
	.side-panel-menu,
	.bb-mobile-panel-menu
) a[aria-current="page"] {
	background-color: var(--tmo-ui-shell-surface-hover);
	color: var(--tmo-ui-shell-accent-hover);
	font-weight: var(--tmo-ui-font-weight-bold);
}

/*
 * Shared BuddyBoss dark-shell bridge.
 *
 * Exact server-side context classes cover the Discovery feed, public Dokan
 * stores and approved standard products. Excluding the Discovery home embed
 * preserves its existing boundary. Native BuddyBoss rules continue to own
 * shell geometry, panel widths and interaction.
 */
/*
 * BuddyBoss nests the live primary list under #primary-navbar. These selectors
 * intentionally complement the shared shell rules without changing other routes.
 */
body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb #site-navigation.main-navigation #primary-navbar > ul.primary-menu > li > a,
body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb #site-navigation.main-navigation #navbar-collapse > .more-button {
	color: var(--tmo-ui-shell-text-muted);
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb #site-navigation.main-navigation #primary-navbar > ul.primary-menu > li > a:hover,
body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb #site-navigation.main-navigation #primary-navbar > ul.primary-menu > li > a:focus-visible,
body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb #site-navigation.main-navigation #navbar-collapse > .more-button:hover,
body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb #site-navigation.main-navigation #navbar-collapse > .more-button:focus-visible {
	background-color: var(--tmo-ui-shell-surface-hover);
	color: var(--tmo-ui-shell-accent-hover);
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb #site-navigation.main-navigation #primary-navbar > ul.primary-menu > li > a > i,
body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb #site-navigation.main-navigation #navbar-collapse > .more-button > i {
	color: inherit;
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb #header-aside.header-aside :where(
	.header-search-link,
	.notification-wrap > .notification-link,
	.user-wrap-container > .user-link
) {
	color: var(--tmo-ui-shell-text-muted);
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb #header-aside.header-aside :where(
	.header-search-link,
	.notification-wrap > .notification-link,
	.user-wrap-container > .user-link
):where(:hover, :focus-visible),
body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb #header-aside.header-aside :where(
	.notification-wrap,
	.user-wrap-container
):where(:hover, :focus-within, .selected) > :where(.notification-link, .user-link) {
	background-color: var(--tmo-ui-shell-surface-hover);
	color: var(--tmo-ui-shell-accent-hover);
}

/*
 * BuddyBoss assigns these descendant colours directly, so the utility anchor's
 * colour must be inherited explicitly by its icon and visible account name.
 */
body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb #header-aside.header-aside :where(
	.header-search-link > i,
	.notification-wrap > .notification-link > span > i,
	.user-wrap-container > .user-link > i
) {
	color: inherit;
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb #header-aside.header-aside .user-wrap-container > .user-link > .user-name {
	color: inherit;
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb #header-aside.header-aside .notification-wrap > .notification-link span.count,
body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) .bb-mobile-header-wrapper .bb-mobile-header .notification-wrap > .notification-link span.count {
	background-color: var(--tmo-ui-brand);
	color: var(--tmo-ui-on-brand);
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb #header-aside.header-aside .bb-separator {
	background-color: var(--tmo-ui-shell-border);
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb .header-search-wrap .close-search {
	color: var(--tmo-ui-shell-text-muted);
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb .header-search-wrap .close-search:where(:hover, :focus-visible) {
	background-color: var(--tmo-ui-shell-surface-hover);
	color: var(--tmo-ui-shell-accent-hover);
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) #masthead.site-header.site-header--bb .header-search-wrap .close-search > i {
	color: inherit;
}

/*
 * Map the current BuddyBoss sidenav variables locally. Native CSS retains the
 * collapsed/open panel widths, content offsets, submenu state and scroll model.
 */
body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) aside.buddypanel {
	--bb-sidenav-background: var(--tmo-ui-shell-surface);
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) aside.buddypanel,
body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) .bb-mobile-panel-wrapper .bb-mobile-panel-inner {
	--bb-sidenav-alt-background: var(--tmo-ui-shell-surface-hover);
	--bb-sidenav-links: var(--tmo-ui-shell-accent-hover);
	--bb-sidenav-text-regular: var(--tmo-ui-shell-text-muted);
	--bb-sidenav-text-hover: var(--tmo-ui-shell-accent-hover);
	--bb-sidenav-text-active: var(--tmo-ui-shell-accent-hover);
	--bb-sidenav-menu-background-color-regular: transparent;
	--bb-sidenav-menu-background-color-hover: var(--tmo-ui-shell-surface-hover);
	--bb-sidenav-menu-background-color-active: var(--tmo-ui-shell-surface-hover);
	--bb-sidenav-count-background-color-regular: var(--tmo-ui-brand);
	--bb-sidenav-count-text-color-regular: var(--tmo-ui-on-brand);
	--bb-sidenav-count-background-color-hover: var(--tmo-ui-brand);
	--bb-sidenav-count-text-color-hover: var(--tmo-ui-on-brand);
	--bb-sidenav-count-background-color-active: var(--tmo-ui-brand);
	--bb-sidenav-count-text-color-active: var(--tmo-ui-on-brand);
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) aside.buddypanel :where(
	.bb-toggle-panel > i,
	#buddypanel-menu.side-panel-menu a > i
),
body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) .bb-mobile-panel-wrapper .bb-mobile-panel-inner nav.main-navigation > ul.side-panel-menu a > i {
	color: inherit;
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) .bb-mobile-header-wrapper .bb-mobile-header :where(
	.bb-left-panel-mobile,
	.notification-wrap > .notification-link
) {
	color: var(--tmo-ui-shell-text-muted);
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) .bb-mobile-header-wrapper .bb-mobile-header :where(
	.bb-left-panel-mobile > i,
	.notification-wrap > .notification-link > span > i
) {
	color: inherit;
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) .bb-mobile-header-wrapper .bb-mobile-header :where(
	.bb-left-panel-mobile,
	.notification-wrap > .notification-link
):where(:hover, :focus-visible),
body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product).bb-mobile-panel-open .bb-mobile-header-wrapper .bb-mobile-header .bb-left-panel-mobile,
body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) .bb-mobile-header-wrapper .bb-mobile-header .notification-wrap:where(:hover, :focus-within, .selected) > .notification-link {
	background-color: var(--tmo-ui-shell-surface-hover);
	color: var(--tmo-ui-shell-accent-hover);
}

/*
 * The native mobile drawer header keeps a light content surface, so the exact
 * drawer roots need the same raised dark surface as the rest of the shell.
 */
body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) .bb-mobile-panel-wrapper .bb-mobile-panel-inner,
body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) .bb-mobile-panel-wrapper .bb-mobile-panel-inner .bb-mobile-panel-header {
	background-color: var(--tmo-ui-surface-raised);
	color: var(--tmo-ui-shell-text);
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) .bb-mobile-panel-wrapper .bb-mobile-panel-inner nav.main-navigation > ul.side-panel-menu a {
	color: var(--tmo-ui-shell-text-muted);
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) .bb-mobile-panel-wrapper .bb-mobile-panel-inner nav.main-navigation > ul.side-panel-menu a:where(:hover, :focus-visible) {
	background-color: var(--tmo-ui-shell-surface-hover);
	color: var(--tmo-ui-shell-accent-hover);
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) .bb-mobile-panel-wrapper .bb-mobile-panel-inner .bb-mobile-panel-header .user-wrap a {
	color: var(--tmo-ui-shell-text-muted);
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) .bb-mobile-panel-wrapper .bb-mobile-panel-inner .bb-mobile-panel-header .user-wrap a:where(:hover, :focus-visible) {
	color: var(--tmo-ui-shell-accent-hover);
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) .bb-mobile-panel-wrapper .bb-mobile-panel-inner .bb-mobile-panel-header .user-wrap a > .user-name {
	color: inherit;
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) .bb-mobile-panel-wrapper .bb-mobile-panel-inner .bb-close-panel {
	color: var(--tmo-ui-shell-text-muted);
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) .bb-mobile-panel-wrapper .bb-mobile-panel-inner .bb-close-panel:where(:hover, :focus-visible) {
	background-color: var(--tmo-ui-shell-surface-hover);
	color: var(--tmo-ui-shell-accent-hover);
}

body.tmo-ui-shell.tmo-ui-shell--dark:is(.tmo-ui-protected--discovery:not(.home), .tmo-ui-context--dokan-store, .tmo-ui-context--woocommerce-product) .bb-mobile-panel-wrapper .bb-mobile-panel-inner .bb-close-panel > i {
	color: inherit;
}

/* BuddyBoss footer */
body.tmo-ui-shell .footer-bottom.bb-footer {
	border-top: var(--tmo-ui-border-width) solid var(--tmo-ui-shell-border);
	background-color: var(--tmo-ui-shell-surface);
	color: var(--tmo-ui-shell-text-muted);
	font-family: var(--tmo-ui-font-body);
	font-size: var(--tmo-ui-font-size-sm);
	line-height: var(--tmo-ui-line-height-ui);
}

body.tmo-ui-shell .footer-bottom.bb-footer .container.flex {
	gap: var(--tmo-ui-space-4);
	padding-block: var(--tmo-ui-space-3);
}

body.tmo-ui-shell .footer-bottom.bb-footer :where(
	.footer-bottom-left,
	.footer-menu.secondary,
	.footer-bottom-right
) a {
	box-sizing: border-box;
	min-height: var(--tmo-ui-shell-control);
	padding: var(--tmo-ui-space-2);
	border-radius: var(--tmo-ui-radius-input);
	color: var(--tmo-ui-shell-text-muted);
	font-weight: var(--tmo-ui-font-weight-medium);
	text-decoration: none;
	transition:
		background-color var(--tmo-ui-duration-fast) var(--tmo-ui-ease-standard),
		color var(--tmo-ui-duration-fast) var(--tmo-ui-ease-standard);
}

body.tmo-ui-shell .footer-bottom.bb-footer :where(
	.footer-bottom-left,
	.footer-menu.secondary,
	.footer-bottom-right
) a:hover,
body.tmo-ui-shell .footer-bottom.bb-footer .footer-menu.secondary .current-menu-item > a,
body.tmo-ui-shell .footer-bottom.bb-footer .footer-menu.secondary a[aria-current="page"] {
	background-color: var(--tmo-ui-shell-surface-hover);
	color: var(--tmo-ui-shell-accent-hover);
}

/* Shared keyboard focus treatment, restricted to confirmed shell roots. */
body.tmo-ui-shell :where(
	#masthead.site-header.site-header--bb,
	aside.buddypanel,
	.bb-mobile-header-wrapper .bb-mobile-header,
	.bb-mobile-panel-wrapper .bb-mobile-panel-inner,
	.footer-bottom.bb-footer
) :where(
	a[href],
	button,
	input:not([type="hidden"]),
	select,
	textarea,
	summary,
	[tabindex]:not([tabindex="-1"])
):focus-visible {
	outline: var(--tmo-ui-focus-width) solid var(--tmo-ui-focus);
	outline-offset: 3px;
}

@media (max-width: 63.9375rem) {
	body.tmo-ui-shell #masthead.site-header.site-header--bb .container.site-header-container {
		gap: var(--tmo-ui-space-3);
	}

	body.tmo-ui-shell #masthead.site-header.site-header--bb #site-navigation.main-navigation #primary-navbar > li > a,
	body.tmo-ui-shell #masthead.site-header.site-header--bb #site-navigation.main-navigation #navbar-collapse > ul > li > a {
		padding-inline: var(--tmo-ui-space-2);
	}

	body.tmo-ui-shell aside.buddypanel :where(
		.side-panel-menu,
		nav
	) a {
		padding-block: var(--tmo-ui-space-2);
	}
}

@media (max-width: 47.9375rem) {
	body.tmo-ui-shell .bb-mobile-header-wrapper .bb-mobile-header {
		padding-inline: var(--tmo-ui-space-4);
	}

	body.tmo-ui-shell .bb-mobile-panel-wrapper .bb-mobile-panel-inner :where(
		nav,
		.side-panel-menu,
		.bb-mobile-panel-menu
	) a {
		padding: var(--tmo-ui-space-3) var(--tmo-ui-space-4);
	}

	body.tmo-ui-shell .footer-bottom.bb-footer .container.flex {
		gap: var(--tmo-ui-space-2);
		padding-block: var(--tmo-ui-space-4);
	}
}

@media (max-width: 29.9375rem) {
	body.tmo-ui-shell .bb-mobile-header-wrapper .bb-mobile-header {
		padding-inline: var(--tmo-ui-space-3);
	}

	body.tmo-ui-shell .bb-mobile-panel-wrapper .bb-mobile-panel-inner :where(
		nav,
		.side-panel-menu,
		.bb-mobile-panel-menu
	) a {
		padding-inline: var(--tmo-ui-space-3);
	}

	body.tmo-ui-shell .footer-bottom.bb-footer :where(
		.footer-bottom-left,
		.footer-menu.secondary,
		.footer-bottom-right
	) a {
		padding-inline: var(--tmo-ui-space-2);
	}
}

@media (prefers-reduced-motion: reduce) {
	body.tmo-ui-shell :where(
		#masthead.site-header.site-header--bb,
		aside.buddypanel,
		.bb-mobile-header-wrapper .bb-mobile-header,
		.bb-mobile-panel-wrapper .bb-mobile-panel-inner,
		.footer-bottom.bb-footer
	) :where(
		a,
		button,
		input,
		select,
		textarea
	) {
		transition-duration: 0.01ms;
	}
}
