/*
 * TMO installed-app and phone presentation layer.
 *
 * Installed-only rules key off html.tmo-pwa-dancer-nav-active /
 * html.tmo-pwa-customer-nav-active, which the bottom-nav scripts set only in
 * standalone display mode. Phone rules stay below 768px so desktop is unchanged.
 * Hub shortcut and focus-card changes stand down while an onboarding tour runs.
 */

/* 1. Installed app shell: the site footer belongs to the web version only. */
html.tmo-pwa-dancer-nav-active footer.footer-bottom,
html.tmo-pwa-customer-nav-active footer.footer-bottom {
	display: none !important;
}

/* Legal destinations move from the hidden footer into the app menu. */
.tmo-pwa-dancer-menu__list > li.tmo-pwa-dancer-menu__item--legal > a,
.tmo-pwa-customer-menu__list > li.tmo-pwa-customer-menu__item--legal > a {
	min-height: 42px;
	color: inherit;
	font-size: 14px;
	font-weight: 600;
	opacity: 0.78;
}

.tmo-pwa-dancer-menu__list > li:not(.tmo-pwa-dancer-menu__item--legal) + .tmo-pwa-dancer-menu__item--legal,
.tmo-pwa-customer-menu__list > li:not(.tmo-pwa-customer-menu__item--legal) + .tmo-pwa-customer-menu__item--legal {
	margin-top: 8px;
	padding-top: 8px;
	border-top: 1px solid color-mix(in srgb, currentColor 14%, transparent);
}

.tmo-pwa-dancer-menu__item--legal + .tmo-pwa-dancer-menu__item--logout,
.tmo-pwa-customer-menu__item--legal + .tmo-pwa-customer-menu__item--logout {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}

/* 7. Hub shortcuts that repeat a bottom-nav destination (marked by native-feel.js). */
html.tmo-pwa-dancer-nav-active body:not(.tmo-dancer-hub-orientation-active):not(.tmo-customer-hub-orientation-active) .tmo-hub-nav li.tmo-native-duplicate,
html.tmo-pwa-customer-nav-active body:not(.tmo-dancer-hub-orientation-active):not(.tmo-customer-hub-orientation-active) .tmo-hub-nav li.tmo-native-duplicate {
	display: none;
}

/*
 * 9. Hire Talent: secondary filters sit behind a Filters control on phones.
 * Desktop always shows the filters, so the control stays hidden there. The
 * scoped selector outranks BuddyBoss's own button display rule.
 */
.tmo-native-filters-toggle,
body.tmo-hire-talent-directory #buddypress .tmo-native-filters-toggle {
	display: none;
}

/*
 * 5. Messages: keyboard shortcut hints mean nothing on touch devices. The hint
 * keeps its space so the composer stays clear of the installed-app bottom nav.
 */
@media (hover: none) and (pointer: coarse), (max-width: 767px) {
	.bp-message-content_foot_note {
		visibility: hidden !important;
	}
}

@media (max-width: 767px) {
	/* 6. Hub opening area: an app home screen, not a landing-page introduction. */
	body.tmo-member-hub-home-page .tmo-hub-hero .tmo-hub-hero__welcome > h1 {
		position: absolute !important;
		width: 1px !important;
		height: 1px !important;
		margin: -1px !important;
		padding: 0 !important;
		overflow: hidden !important;
		clip: rect(0 0 0 0) !important;
		white-space: nowrap !important;
		border: 0 !important;
	}

	body.tmo-member-hub-home-page .tmo-hub-hero .tmo-hub-hero__welcome > p {
		display: none;
	}

	/* 10. Focus cards: one swipeable row using the same cards. */
	body.tmo-member-hub-home-page:not(.tmo-dancer-hub-orientation-active):not(.tmo-customer-hub-orientation-active) .tmo-member-hub-home .tmo-dancer-hub-card-grid,
	body.tmo-member-hub-home-page:not(.tmo-dancer-hub-orientation-active):not(.tmo-customer-hub-orientation-active) .tmo-member-hub-home .tmo-customer-hub-card-grid {
		display: flex;
		gap: 12px;
		margin-right: -16px;
		margin-left: -16px;
		padding: 2px 16px 10px;
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scroll-padding-left: 16px;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
	}

	body.tmo-member-hub-home-page:not(.tmo-dancer-hub-orientation-active):not(.tmo-customer-hub-orientation-active) .tmo-member-hub-home .tmo-dancer-hub-card-grid::-webkit-scrollbar,
	body.tmo-member-hub-home-page:not(.tmo-dancer-hub-orientation-active):not(.tmo-customer-hub-orientation-active) .tmo-member-hub-home .tmo-customer-hub-card-grid::-webkit-scrollbar {
		display: none;
	}

	body.tmo-member-hub-home-page:not(.tmo-dancer-hub-orientation-active):not(.tmo-customer-hub-orientation-active) .tmo-member-hub-home .tmo-dancer-hub-card-grid > *,
	body.tmo-member-hub-home-page:not(.tmo-dancer-hub-orientation-active):not(.tmo-customer-hub-orientation-active) .tmo-member-hub-home .tmo-customer-hub-card-grid > * {
		flex: 0 0 82%;
		min-width: 0;
		scroll-snap-align: start;
	}

	/* 4. Notifications: a plain list instead of a bulk-management table. */
	#notifications-user-list .notification-list > li.bs-header-item,
	#notifications-user-list .notification-list > li .bulk-select-check,
	#notifications-user-list .bp-pagination .pag-count,
	.notifications-header .bb-subnav-filters-container {
		display: none !important;
	}

	#notifications-user-list .notification-list > li.bs-item-wrap {
		border-top: 0 !important;
		border-right: 0 !important;
		border-left: 0 !important;
		border-radius: 0 !important;
		padding-right: 4px;
		padding-left: 4px;
	}

	/* 5. Messages: drop the desktop frame around the conversation. */
	.messages-wrapper {
		border: 0 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
	}

	/* 8. Support: one card for the ticket list, no desktop table header. */
	#tmo-fluent-support.tmo-support-hub__portal {
		padding: 0 !important;
		border: 0 !important;
		border-radius: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
	}

	#tmo-fluent-support .el-table__header-wrapper {
		display: none !important;
	}

	/* 9. Hire Talent: the name search stays; the filter form opens on demand. */
	body.tmo-hire-talent-directory #buddypress .tmo-native-filters-toggle {
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 10px;
		width: 100%;
		min-height: 44px;
		margin: 0 0 16px;
		padding: 8px 14px;
		border: var(--tmo-ui-border-width, 1px) solid var(--tmo-ui-border-strong, rgba(128, 128, 128, 0.45));
		border-radius: var(--tmo-ui-radius-input, 10px);
		background: var(--tmo-ui-surface-subtle, transparent);
		color: var(--tmo-ui-text, currentColor);
		font-family: var(--tmo-ui-font-body, inherit);
		font-size: 0.875rem;
		font-weight: var(--tmo-ui-font-weight-semibold, 600);
		line-height: 1.2;
		text-align: left;
		cursor: pointer;
	}

	body.tmo-hire-talent-directory #buddypress .tmo-native-filters-toggle__label {
		display: inline-flex;
		align-items: center;
		gap: 8px;
	}

	body.tmo-hire-talent-directory #buddypress .tmo-native-filters-toggle__count {
		display: inline-grid;
		min-width: 20px;
		height: 20px;
		padding: 0 6px;
		border-radius: 999px;
		background: var(--tmo-ui-brand, #7a58dd);
		color: var(--tmo-ui-on-brand, #fff);
		font-size: 0.75rem;
		place-items: center;
	}

	body.tmo-hire-talent-directory #buddypress .tmo-native-filters-toggle__count[hidden] {
		display: none;
	}

	body.tmo-hire-talent-directory #buddypress .tmo-members-search-module.tmo-native-filters-collapsed {
		display: none !important;
	}
}