/* -----------------------------------------------------------------------------
   Single Group Feed Composer
   ----------------------------------------------------------------------------- */

.bond-group-feed__composer-shell {
	margin-bottom: 1rem;

	/* Keep the compact group composer styling out of the expanded BuddyBoss modal. */
	& #bp-nouveau-activity-form:not(.modal-popup) {
		border: 1px solid var(--color-border);
		border-radius: 4px;
		overflow: hidden;
		background: #fff;
		box-shadow: none;

		& .activity-update-form-overlay,
		& #activity-header,
		& #whats-new-heading,
		& #whats-new-status,
		& #activity-schedule-section,
		& #whats-new-privacy-stage,
		& #whats-new-title,
		& .activity-post-name-status {
			display: none;
		}

		& form.activity-form {
			display: flex;
			flex-direction: column;
		}

		& .whats-new-scroll-view {
			overflow: visible;
		}

		& .whats-new-form-header {
			min-height: 77px;
		}

		& #user-status-huddle.bp-activity-huddle {
			display: flex;
			align-items: stretch;
		}

		& #whats-new-avatar {
			flex: 0 0 78px;
			padding: 16px;
		}

		& .activity-post-avatar-container,
		& .activity-post-avatar {
			display: flex;
		}

		& .activity-post-avatar img.avatar {
			width: 45px;
			height: 45px;
			border-radius: 22.5px;
			object-fit: cover;
		}

		& #whats-new-content {
			display: flex;
			flex: 1 1 auto;
			align-items: center;
			min-height: 77px;
			padding-right: 15px;
		}

		& #whats-new-textarea {
			display: flex;
			align-items: center;
			width: 100%;
			min-height: 77px;
			padding: 24.25px 0;
		}

		& #whats-new {
			width: 100%;
			min-height: 28.5px;
			height: 28.5px;
			margin: 0;
			padding: 0;
			background: transparent;
			border: 0;
			box-shadow: none;
			color: transparent;
			font-size: 19px;
			line-height: 28.5px;
			overflow: hidden;

			&.medium-editor-placeholder::after {
				content: var(--bond-group-post-placeholder, "Share a post with the group...");
				position: static;
				display: block;
				color: #989482;
				font-size: 19px;
				line-height: 28.5px;
			}
		}

		& #whats-new-toolbar {
			display: flex;
			align-items: center;
			gap: 0;
			padding: 13px 16px 12px;
			background: #f4f4f2;
			border-top: 1px solid #f4f4f2;

			& .post-elements-buttons-item {
				display: inline-flex;
				align-items: center;
				margin: 0;
				padding-right: 10px;
			}

			& .toolbar-button {
				display: inline-flex;
				align-items: center;
				justify-content: center;
				width: 24px;
				height: 24px;
				padding: 0;
				background: transparent;
				border: 0;
				border-radius: 0;
				color: #545246;
				text-decoration: none;

				&:hover,
				&:focus {
					background: transparent;
					color: #545246;
				}

				& i {
					font-size: 24px;
					line-height: 1;
				}
			}
		}
	}

}

.activity-update-form .activity-form.focus-in #editor-toolbar .post-elements-buttons-item,
.bp-nouveau-activity-form-placeholder- .activity-form.focus-in #editor-toolbar .post-elements-buttons-item {
	margin-right: 10px;
	height: 36px;
	display: flex;
	align-items: center;
}

.activity-update-form .whats-new-title,
.bp-nouveau-activity-form-placeholder- .whats-new-title {
	border: none !important;
	font-size: 20px !important;
	font-weight: 300 !important;
	padding: 0 !important;
	background: none !important;
}

.activity-update-form #whats-new-submit #aw-whats-new-submit,
.bp-nouveau-activity-form-placeholder- #whats-new-submit #aw-whats-new-submit {
	height: 35px;
	max-height: 35px;
	padding: 0 1rem;
	border: 1px solid var(--color-bond-red-darker);
	border-radius: 4px;
	background: var(--color-bond-red-darker);
	color: #fff;
	line-height: 1.2;
	box-shadow: none;
}

.activity-update-form #whats-new-submit #aw-whats-new-submit:hover,
.activity-update-form #whats-new-submit #aw-whats-new-submit:focus,
.activity-update-form #whats-new-submit #aw-whats-new-submit:active,
.bp-nouveau-activity-form-placeholder- #whats-new-submit #aw-whats-new-submit:hover,
.bp-nouveau-activity-form-placeholder- #whats-new-submit #aw-whats-new-submit:focus,
.bp-nouveau-activity-form-placeholder- #whats-new-submit #aw-whats-new-submit:active {
	border-color: var(--color-bond-red-darkest);
	background: var(--color-bond-red-darkest);
	color: #fff;
	box-shadow: none;
}

.bond-group-feed__composer-shell--has-topics {
	margin-bottom: 1.5rem;

	& .activity-topic-selector {
		margin-top: 1rem;
	}
}
