/* Tablet */
@media (max-width: 980px) {
	body.follo-ui .buddypress .bp-navs ul,
	body.follo-ui #buddypress .item-list-tabs ul {
		flex-wrap: nowrap;
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: thin;
		padding-bottom: 8px;
	}

	body.follo-ui .buddypress .bp-navs li,
	body.follo-ui #buddypress .item-list-tabs li {
		flex: 0 0 auto;
	}

	body.follo-ui .buddypress .bp-navs li a,
	body.follo-ui #buddypress .item-list-tabs li a {
		white-space: nowrap;
	}
}

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

	body.follo-ui .buddypress .bp-navs,
	body.follo-ui #buddypress .item-list-tabs {
		margin-bottom: 22px;
		border-bottom: 0;
	}

	body.follo-ui .buddypress .bp-navs ul,
	body.follo-ui #buddypress .item-list-tabs ul {
		gap: 8px;
		margin-left: 0;
		padding: 2px 1px 10px;
		scrollbar-width: none;
	}

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

	body.follo-ui .buddypress .bp-navs li a,
	body.follo-ui #buddypress .item-list-tabs li a {
		min-height: 40px;
		padding: 8px 13px;
		border: 1px solid var(--follo-border);
		border-radius: 999px;
		background: #fff;
		box-shadow: none;
	}

	body.follo-ui .buddypress .bp-navs li.current a,
	body.follo-ui .buddypress .bp-navs li.selected a,
	body.follo-ui #buddypress .item-list-tabs li.current a,
	body.follo-ui #buddypress .item-list-tabs li.selected a {
		border-color: var(--follo-primary);
		background: var(--follo-primary);
		color: #fff;
		box-shadow: none;
	}

	body.follo-ui .buddypress h2,
	body.follo-ui #buddypress h2 {
		margin-bottom: 14px;
		font-size: 23px;
	}

	body.follo-ui .buddypress input[type="text"],
	body.follo-ui .buddypress input[type="email"],
	body.follo-ui .buddypress input[type="password"],
	body.follo-ui .buddypress input[type="url"],
	body.follo-ui .buddypress input[type="number"],
	body.follo-ui .buddypress input[type="search"],
	body.follo-ui .buddypress select,
	body.follo-ui .buddypress textarea,
	body.follo-ui #buddypress input[type="text"],
	body.follo-ui #buddypress input[type="email"],
	body.follo-ui #buddypress input[type="password"],
	body.follo-ui #buddypress input[type="url"],
	body.follo-ui #buddypress select,
	body.follo-ui #buddypress textarea {
		min-height: 48px;
		font-size: 16px; /* prevents iOS zoom */
	}

	body.follo-ui .buddypress .submit,
	body.follo-ui #buddypress .submit {
		display: grid;
		grid-template-columns: 1fr;
		width: 100%;
		gap: 10px;
	}

	body.follo-ui .buddypress .submit button,
	body.follo-ui .buddypress .submit input[type="submit"],
	body.follo-ui .buddypress .submit .button,
	body.follo-ui #buddypress .submit button,
	body.follo-ui #buddypress .submit input[type="submit"],
	body.follo-ui #buddypress .submit .button,
	body.follo-ui .buddypress .wp-generate-pw,
	body.follo-ui #buddypress .wp-generate-pw {
		width: 100%;
		min-height: 48px;
		margin-right: 0;
	}

	body.follo-ui .buddypress .bp-feedback,
	body.follo-ui .buddypress .bp-template-notice,
	body.follo-ui #buddypress .bp-template-notice,
	body.follo-ui #buddypress div#message {
		width: 100%;
		margin: 14px 0 20px;
		padding: 13px 14px;
		border-radius: 9px;
	}

	body.follo-ui .buddypress .standard-form,
	body.follo-ui #buddypress .standard-form {
		width: 100%;
		max-width: none;
	}

	/* Avoid long strings/URLs pushing layouts wider than viewport */
	body.follo-ui .buddypress p,
	body.follo-ui .buddypress label,
	body.follo-ui .buddypress .description,
	body.follo-ui #buddypress p,
	body.follo-ui #buddypress label {
		overflow-wrap: anywhere;
	}
}

/* Small phones */
@media (max-width: 420px) {
	body.follo-ui .buddypress .bp-navs li a,
	body.follo-ui #buddypress .item-list-tabs li a {
		padding: 8px 11px;
		font-size: 13px;
	}
}


@media (max-width: 767px) {
	body.follo-ui .buddypress .wp-generate-pw,
	body.follo-ui #buddypress .wp-generate-pw,
	body.follo-ui .buddypress input[type="submit"][name="submit"],
	body.follo-ui #buddypress input[type="submit"][name="submit"] {
		min-width: 0;
		width: 100%;
	}

	body.follo-ui .buddypress .request-data-export,
	body.follo-ui #buddypress .request-data-export,
	body.follo-ui .buddypress input[name="data-export-submit"],
	body.follo-ui #buddypress input[name="data-export-submit"],
	body.follo-ui .buddypress input[value*="personal data export"],
	body.follo-ui #buddypress input[value*="personal data export"] {
		width: 100%;
		margin-bottom: 32px;
	}
}


@media (max-width: 767px) {
	/* General page buttons remain equal and full width on phones. */
	body.follo-ui .buddypress .wp-generate-pw,
	body.follo-ui #buddypress .wp-generate-pw,
	body.follo-ui .buddypress .standard-form .submit input[type="submit"],
	body.follo-ui #buddypress .standard-form .submit input[type="submit"] {
		width: 100%;
		min-width: 0;
		max-width: none;
	}

	/* Export action full-width with extra separation before Data Erase. */
	body.follo-ui .buddypress input[name="data-export-submit"],
	body.follo-ui #buddypress input[name="data-export-submit"],
	body.follo-ui .buddypress input[value*="personal data export"],
	body.follo-ui #buddypress input[value*="personal data export"] {
		width: 100%;
		margin-bottom: 36px !important;
	}

	/* Profile edit cards use smaller padding on mobile. */
	body.follo-ui .buddypress .profile.edit .editfield,
	body.follo-ui #buddypress .profile.edit .editfield,
	body.follo-ui .buddypress .profile-fields .editfield,
	body.follo-ui #buddypress .profile-fields .editfield {
		padding: 14px;
	}

	body.follo-ui .buddypress .field-visibility-settings-toggle,
	body.follo-ui #buddypress .field-visibility-settings-toggle,
	body.follo-ui .buddypress .field-visibility-settings-notoggle,
	body.follo-ui #buddypress .field-visibility-settings-notoggle {
		align-items: flex-start;
		gap: 8px;
	}

	body.follo-ui .buddypress .field-visibility-settings-toggle .button,
	body.follo-ui #buddypress .field-visibility-settings-toggle .button,
	body.follo-ui .buddypress .field-visibility-settings-toggle a,
	body.follo-ui #buddypress .field-visibility-settings-toggle a {
		width: auto;
		margin-left: 0;
	}

	body.follo-ui .buddypress .drag-drop,
	body.follo-ui #buddypress .drag-drop,
	body.follo-ui .buddypress .bp-uploader-window,
	body.follo-ui #buddypress .bp-uploader-window,
	body.follo-ui .buddypress #drag-drop-area,
	body.follo-ui #buddypress #drag-drop-area {
		padding: 26px 14px;
	}
}


@media (max-width: 767px) {
	body.follo-ui .buddypress .wp-generate-pw,
	body.follo-ui #buddypress .wp-generate-pw,
	body.follo-ui .buddypress .standard-form .submit input[type="submit"],
	body.follo-ui #buddypress .standard-form .submit input[type="submit"] {
		width: 100% !important;
		min-width: 0 !important;
		max-width: none !important;
		white-space: nowrap !important;
	}

	body.follo-ui .buddypress select[name="notification_bulk_action"],
	body.follo-ui #buddypress select[name="notification_bulk_action"],
	body.follo-ui .buddypress .notifications-options-nav select,
	body.follo-ui #buddypress .notifications-options-nav select {
		width: 100% !important;
		min-width: 0 !important;
		max-width: none !important;
	}

	body.follo-ui .buddypress .data-export .submit,
	body.follo-ui #buddypress .data-export .submit,
	body.follo-ui .buddypress .request-data-export,
	body.follo-ui #buddypress .request-data-export {
		margin-bottom: 52px !important;
	}

	body.follo-ui .buddypress .drag-drop-inside,
	body.follo-ui #buddypress .drag-drop-inside,
	body.follo-ui .buddypress #drag-drop-area .drag-drop-inside,
	body.follo-ui #buddypress #drag-drop-area .drag-drop-inside {
		min-height: 150px;
		padding: 22px 14px;
	}
}

@media (max-width: 767px) {
	body.follo-ui .buddypress-wrap .subnav-filters .select-wrap,
	body.follo-ui #buddypress .subnav-filters .select-wrap,
	body.follo-ui .buddypress-wrap .notifications-options-nav .select-wrap,
	body.follo-ui #buddypress .notifications-options-nav .select-wrap {
		width: 100% !important;
		min-width: 0 !important;
		flex-basis: 100% !important;
	}

	body.follo-ui .buddypress-wrap .subnav-filters select,
	body.follo-ui #buddypress .subnav-filters select,
	body.follo-ui .buddypress-wrap .notifications-options-nav select,
	body.follo-ui #buddypress .notifications-options-nav select,
	body.follo-ui #buddypress select[name="notification-filter"],
	body.follo-ui #buddypress select[name="members-order-by"],
	body.follo-ui #buddypress select[name="groups-order-by"] {
		width: 100% !important;
		min-width: 0 !important;
		max-width: none !important;
	}

	body.follo-ui .follo-data-erase-heading {
		margin-top: 44px !important;
	}
}


@media (max-width: 767px) {
	body.follo-ui .buddypress .bp-avatar-nav ul,
	body.follo-ui #buddypress .bp-avatar-nav ul {
		flex-wrap: nowrap !important;
		overflow-x: auto !important;
		padding: 0 4px 2px !important;
		scrollbar-width: none;
	}
	body.follo-ui .buddypress .bp-avatar-nav ul::-webkit-scrollbar,
	body.follo-ui #buddypress .bp-avatar-nav ul::-webkit-scrollbar {
		display: none;
	}
	body.follo-ui .buddypress .bp-avatar-nav li,
	body.follo-ui #buddypress .bp-avatar-nav li {
		flex: 0 0 auto;
	}
	body.follo-ui .buddypress .bp-avatar-nav li a,
	body.follo-ui #buddypress .bp-avatar-nav li a {
		white-space: nowrap !important;
	}
}


@media (max-width: 767px) {
	body.follo-ui.settings .buddypress .bp-navs.bp-subnavs,
	body.follo-ui.settings #buddypress .item-list-tabs#subnav,
	body.follo-ui.settings #buddypress .bp-navs.bp-subnavs {
		padding: 8px !important;
		overflow: hidden;
	}

	body.follo-ui.settings .buddypress .bp-navs.bp-subnavs ul,
	body.follo-ui.settings #buddypress .item-list-tabs#subnav ul,
	body.follo-ui.settings #buddypress .bp-navs.bp-subnavs ul {
		flex-wrap: nowrap !important;
		overflow-x: auto !important;
		scrollbar-width: none;
	}
	body.follo-ui.settings .buddypress .bp-navs.bp-subnavs ul::-webkit-scrollbar,
	body.follo-ui.settings #buddypress .item-list-tabs#subnav ul::-webkit-scrollbar,
	body.follo-ui.settings #buddypress .bp-navs.bp-subnavs ul::-webkit-scrollbar {
		display: none;
	}

	body.follo-ui .buddypress #send_message_form .submit,
	body.follo-ui #buddypress #send_message_form .submit {
		display: grid !important;
		grid-template-columns: 1fr !important;
	}

	body.follo-ui .buddypress #send_message_form input[type="submit"],
	body.follo-ui #buddypress #send_message_form input[type="submit"],
	body.follo-ui .buddypress #send_message_form input[type="reset"],
	body.follo-ui #buddypress #send_message_form input[type="reset"],
	body.follo-ui .buddypress #send_message_form button[type="submit"],
	body.follo-ui #buddypress #send_message_form button[type="submit"],
	body.follo-ui .buddypress #send_message_form button[type="reset"],
	body.follo-ui #buddypress #send_message_form button[type="reset"] {
		width: 100% !important;
	}
}


@media (max-width: 767px) {
	body.follo-ui .buddypress .bp-navs.bp-subnavs,
	body.follo-ui #buddypress .bp-navs.bp-subnavs,
	body.follo-ui #buddypress .item-list-tabs#subnav,
	body.follo-ui .buddypress .item-list-tabs#subnav {
		padding: 7px !important;
		border-radius: 10px !important;
	}

	body.follo-ui .buddypress .bp-navs.bp-subnavs li a,
	body.follo-ui #buddypress .bp-navs.bp-subnavs li a,
	body.follo-ui #buddypress .item-list-tabs#subnav li a,
	body.follo-ui .buddypress .item-list-tabs#subnav li a {
		min-height: 38px !important;
		padding: 8px 12px !important;
	}

	body.follo-ui .buddypress .bp-avatar table,
	body.follo-ui #buddypress .bp-avatar table {
		display: block;
		overflow-x: auto;
	}
}


@media (max-width: 767px) {
	body.follo-ui .buddypress .bp-navs.bp-subnavs,
	body.follo-ui #buddypress .bp-navs.bp-subnavs,
	body.follo-ui #buddypress .item-list-tabs#subnav,
	body.follo-ui .buddypress .item-list-tabs#subnav {
		border-radius: 9px !important;
	}

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

	body.follo-ui .buddypress .bp-navs.bp-subnavs li a,
	body.follo-ui #buddypress .bp-navs.bp-subnavs li a,
	body.follo-ui #buddypress .item-list-tabs#subnav li a,
	body.follo-ui .buddypress .item-list-tabs#subnav li a {
		min-height: 42px !important;
		padding: 9px 13px !important;
	}
}


@media (max-width: 980px) {
	/* Preserve single-row Settings subnav with horizontal scroll when necessary. */
	body.follo-ui.settings .buddypress .bp-navs.bp-subnavs li,
	body.follo-ui.settings #buddypress .bp-navs.bp-subnavs li,
	body.follo-ui.settings #buddypress .item-list-tabs#subnav li,
	body.follo-ui.settings .buddypress .item-list-tabs#subnav li {
		flex: 0 0 auto !important;
		min-width: max-content !important;
	}

	body.follo-ui.settings .buddypress .bp-navs.bp-subnavs li a,
	body.follo-ui.settings #buddypress .bp-navs.bp-subnavs li a,
	body.follo-ui.settings #buddypress .item-list-tabs#subnav li a,
	body.follo-ui.settings .buddypress .item-list-tabs#subnav li a {
		padding-left: 12px !important;
		padding-right: 12px !important;
	}
}


@media (max-width: 767px) {
	body.follo-ui .buddypress .bp-avatar-nav,
	body.follo-ui #buddypress .bp-avatar-nav {
		padding-left: 6px !important;
	}

	body.follo-ui .buddypress .bp-navs.bp-subnavs,
	body.follo-ui #buddypress .bp-navs.bp-subnavs,
	body.follo-ui #buddypress .item-list-tabs#subnav,
	body.follo-ui .buddypress .item-list-tabs#subnav {
		margin-top: 4px !important;
	}
}


@media (max-width: 980px) {
	body.follo-ui .buddypress .bp-navs.bp-subnavs,
	body.follo-ui #buddypress .bp-navs.bp-subnavs,
	body.follo-ui #buddypress .item-list-tabs#subnav,
	body.follo-ui .buddypress .item-list-tabs#subnav {
		margin-top: 1px !important;
	}

	/* On narrower screens Settings uses the same one-row horizontal scroll
	   behavior as the rest of BuddyPress subnavs. */
	body.follo-ui.settings .buddypress .bp-navs.bp-subnavs li,
	body.follo-ui.settings #buddypress .bp-navs.bp-subnavs li,
	body.follo-ui.settings #buddypress .item-list-tabs#subnav li,
	body.follo-ui.settings .buddypress .item-list-tabs#subnav li {
		flex: 0 0 auto !important;
		min-width: max-content !important;
	}

	body.follo-ui.settings .buddypress .bp-navs.bp-subnavs li a,
	body.follo-ui.settings #buddypress .bp-navs.bp-subnavs li a,
	body.follo-ui.settings #buddypress .item-list-tabs#subnav li a,
	body.follo-ui.settings .buddypress .item-list-tabs#subnav li a {
		padding-left: 12px !important;
		padding-right: 12px !important;
	}
}


@media (max-width: 980px) {
	body.follo-ui .buddypress .bp-navs.bp-subnavs,
	body.follo-ui #buddypress .bp-navs.bp-subnavs,
	body.follo-ui #buddypress .item-list-tabs#subnav,
	body.follo-ui .buddypress .item-list-tabs#subnav {
		width: calc(100% - 20px) !important;
		max-width: calc(100% - 20px) !important;
		margin-left: 10px !important;
		margin-right: 10px !important;
	}

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

	body.follo-ui .buddypress .bp-navs.bp-subnavs li a,
	body.follo-ui #buddypress .bp-navs.bp-subnavs li a,
	body.follo-ui #buddypress .item-list-tabs#subnav li a,
	body.follo-ui .buddypress .item-list-tabs#subnav li a {
		padding-left: 13px !important;
		padding-right: 13px !important;
	}
}


@media (max-width: 767px) {
	body.follo-ui .buddypress .bp-navs.bp-subnavs,
	body.follo-ui #buddypress .bp-navs.bp-subnavs,
	body.follo-ui #buddypress .item-list-tabs#subnav,
	body.follo-ui .buddypress .item-list-tabs#subnav {
		margin-top: 7px !important;
	}
}


@media (max-width: 767px) {
	body.follo-ui .buddypress .bp-navs.bp-subnavs,
	body.follo-ui #buddypress .bp-navs.bp-subnavs,
	body.follo-ui #buddypress .item-list-tabs#subnav,
	body.follo-ui .buddypress .item-list-tabs#subnav {
		transform: translateY(-13px) !important;
		margin-bottom: 15px !important;
	}
}