// Activity Post Form default view
[class*="bb-rl-activity-form"] {
	background-color: var(--bb-rl-background-color);
	border: 1px solid var(--bb-rl-border-tertiary-color);
	border-radius: var(--bb-rl-radius-lg);

	.bb-rl-bb-model-header {
		display: none;
	}

	.bb-rl-whats-new-form-header {
		display: flex;
		cursor: pointer;
	}

	.bb-rl-activity-post-avatar {
		display: flex;
		padding: var(--bb-rl-space-200) var(--bb-rl-space-200) var(--bb-rl-space-200) var(--bb-rl-space-300);

		img {
			height: 48px;
			width: 48px;
			object-fit: contain;
			border-radius: var(--bb-rl-radius-full);
		}
	}

	#bb-rl-whats-new-content {
		flex: 1;

		.bb-rl-whats-new-title {
			display: none;
		}
	}

	.bb-rl-activity-post-user-name,
	#bb-rl-activity-privacy-point {
		display: none;
	}

	#bb-rl-whats-new,
	#bb-rl-whats-new-placeholder {
		display: flex;
		align-items: center;
		min-height: 80px;

		&[contenteditable="true"]:empty:before {
			content: attr(placeholder);
			font-size: 1rem;
			color: var(--bb-rl-text-tertiary-color);
		}
	}

	.bb-rl-activity-privacy-stage,
	#bb-rl-editor-toolbar,
	#bb-rl-whats-new-toolbar,
	#bb-rl-activity-privacy-point {
		display: none;
	}

	div#bb-rl-activity-privacy-point.bb-rl-activity-edit-group {
		opacity: 0.5;
		cursor: default;
	}
}

.bb-rl-activity-form-placeholder- {
	display: none;
}

// Activity Post Form modal
.bb-rl-activity-update-form.modal-popup {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	padding: 10px 0;
	background-color: rgba(0, 0, 0, 0.5);
	backdrop-filter: blur(2px);
	z-index: var(--bb-rl-z-index-modal);
	display: flex;
	align-items: center;
	justify-content: center;
	max-height: 100%;
	overflow: auto;

	body.bb-rl-activity-modal-open & {
		z-index: 999999;
	}

	.bb-rl-activity-update-form-overlay {
		position: fixed;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
	}

	#bb-rl-whats-new-form {
		width: 800px;
		max-width: 90%;
		margin: auto;
		box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.1);
	}
}

#bb-rl-whats-new-form:not(.bb-rl-activity-edit--privacy-idle) #bb-rl-activity-privacy-point[data-bp-tooltip][data-bp-tooltip-pos="up"] {

	&:after,
	&:before {
		display: none;
	}
}

.bb-rl-activity-form {

	.activity-header-data {
		color: var(--bb-rl-text-color);
		font-size: 18px;
		font-weight: 600;
		line-height: 1.5;
	}

	.bb-rl-model-close-button {
		margin-left: auto;
		line-height: 1;

		span {
			color: var(--bb-rl-icon-color);
			font-size: var(--bb-rl-base-line);
		}
	}

	&.has-draft.bb-rl-focus-in {

		#bb-rl-discard-draft-activity {
			display: block;
		}
	}

	// Activity Post Form in modal view
	&.bb-rl-focus-in {
		position: relative;

		.bb-rl-bb-model-header {
			display: flex;
			border-bottom: 1px solid var(--bb-rl-border-secondary-color);
			padding: var(--bb-rl-space-200) var(--bb-rl-space-300);
			margin: 0;
		}

		.bb-rl-whats-new-form-header {
			flex-flow: column;
			cursor: auto;
		}

		.bb-rl-activity-post-avatar {
			padding: var(--bb-rl-space-50) var(--bb-rl-space-200) 0 0;
		}

		.bp-activity-huddle {
			display: flex;
			padding: var(--bb-rl-space-200) var(--bb-rl-space-300);
		}

		.bb-rl-activity-post-name-status {
			max-width: 60%;
		}

		.bb-rl-activity-post-user-name,
		#bb-rl-activity-privacy-point {
			display: block;
		}

		#bb-rl-whats-new-content {
			width: 100%;

			.bb-rl-whats-new-title {
				display: block;
				margin: 0 var(--bb-rl-space-300);
				padding: var(--bb-rl-space-200) 0;
				border: 0;
				border-top: 1px solid var(--bb-rl-border-secondary-color);
				border-bottom: 1px solid var(--bb-rl-border-secondary-color);
				border-radius: 0;
				color: var(--bb-rl-text-color);
				font-size: 18px;
				font-weight: 600;
				line-height: 1.5;
				width: calc(100% - var(--bb-rl-space-600));
				outline: none;
			}
		}

		.bb-rl-activity-post-user-name {
			color: var(--bb-rl-text-color);
			font-size: 15px;
			font-weight: 500;
			line-height: 1.6;
		}

		#bb-rl-activity-privacy-point {
			display: flex;
			align-items: center;
			background-color: var(--bb-rl-background-secondary-color);
			border: 1px solid var(--bb-rl-border-secondary-color);
			font-size: 12px;
			font-weight: 500;
			line-height: 1;
			padding: 5px 6px;
			margin-top: var(--bb-rl-space-50);
			cursor: pointer;
			border-radius: 6px;

			.bb-rl-privacy-point-icon:before {
				color: var(--bb-rl-icon-secondary-color);
				font-size: 20px;
				font-family: bb-icons-rl;
				line-height: 1;
				font-style: normal;
				font-weight: 400;
				speak: never;
				margin-right: 5px;
			}

			&.public .bb-rl-privacy-point-icon:before {
				content: "\e288";
			}

			&.loggedin .bb-rl-privacy-point-icon:before {
				content: "\e68c";
			}

			&.friends .bb-rl-privacy-point-icon:before {
				content: "\e4d6";
			}

			&.onlyme .bb-rl-privacy-point-icon:before {
				content: "\e2fa";
			}

			&.group .group-bb-rl-privacy-point-icon img {
				height: 20px;
				width: 20px;
				margin-right: 5px;
				border-radius: 3px;
			}

			[class*="bb-icons-rl-"] {
				color: var(--bb-rl-icon-color);
				font-size: 12px;
				margin-left: 6px;
			}
		}

		#bb-rl-whats-new-textarea {
			margin: 0 var(--bb-rl-space-300) var(--bb-rl-space-200);
		}

		#bb-rl-whats-new {
			display: block;
			outline: none;
			min-height: 110px;
			padding: var(--bb-rl-space-200) 0;
			margin-bottom: var(--bb-rl-space-200);
		}

		.bb-rl-whats-new-form-footer {
			display: flex;
			justify-content: space-between;
			border-top: 1px solid var(--bb-rl-border-secondary-color);
			padding: var(--bb-rl-space-200) var(--bb-rl-space-300);
		}

		#bb-rl-whats-new-toolbar {
			display: flex;
			align-items: center;
			position: relative;
		}

		.bb-rl-whats-new-toolbar--inner:after {
			content: "";
			width: 1px;
			background-color: var(--bb-rl-border-tertiary-color);
			height: 16px;
			margin: 0 var(--bb-rl-space-100);
		}

		[class*="post-elements-buttons-item"] {
			position: relative;
			margin-right: var(--bb-rl-space-100);
			line-height: 1;

			&.disable {
				pointer-events: none;
				opacity: 0.4;
			}

			&.bb-rl-document-support-hide,
			&.bb-rl-video-support-hide,
			&.bb-rl-post-gif-hide,
			&.bb-rl-media-support-hide {
				display: none;
			}

			&:last-child {
				margin-right: 0;
			}

			[class*="toolbar-button"] {
				display: flex;
				color: var(--bb-rl-icon-secondary-color);
				font-size: var(--bb-rl-base-line);
				padding: var(--bb-rl-space-50);
				border: 0.5px solid transparent;
				cursor: pointer;

				&:hover {
					color: var(--bb-rl-icon-color);
				}

				i {
					color: var(--bb-rl-icon-secondary-color);
					font-family: bb-icons-rl;
					font-size: 24px;
				}
			}

			&.active [class*="toolbar-button"] {
				color: var(--bb-rl-icon-color);
				background-color: var(--bb-rl-background-secondary-hover-color);
				border: 0.5px solid var(--bb-rl-border-secondary-color);
				border-radius: var(--bb-rl-radius-md);
			}
		}

		.post-elements-buttons-item.post-poll {

			.bb-icon-l:before {
				content: "\e150";
				font-family: bb-icons-rl;
				font-style: normal;
			}
		}

		#bb-rl-activity-form-submit-wrapper {
			display: flex;
			align-items: center;
		}

		#bb-rl-discard-draft-activity {
			display: none;
			color: var(--bb-rl-text-secondary-color);
			font-size: 14px;
			font-weight: 500;
			background-color: transparent;
			padding: 0;
			border: 0;
			margin-right: var(--bb-rl-space-200);
			cursor: pointer;

			&:hover {
				color: var(--bb-rl-text-color);
			}
		}

		#whats-new-submit {
			display: flex;
			flex-flow: row-reverse;
			gap: var(--bb-rl-space-100);
			position: relative;

			&:hover:not(:has(#bb-rl-aw-whats-new-reset:hover)) .bb-topic-tooltip-wrapper {

				.bb-rl-ac-topic-required & {
					opacity: 1;
					cursor: default;
				}
			}
		}

		.bb-rl-button {
			font-size: 0.85rem;
		}

		.bb-rl-whats-new-scroll-view {
			max-height: calc(100vh - 280px);
			overflow: auto;
			width: 100%;
			overscroll-behavior: contain;
			padding-bottom: var(--bb-rl-space-100);
		}

		#bb-rl-editor-toolbar {
			display: flex;
		}
	}

	&.bb-rl-focus-in--empty {

		#aw-whats-new-submit {
			background-color: var(--bb-rl-background-brand-disabled-color);
			cursor: default;
			pointer-events: none;
		}
	}

	// Activity Post Form privacy view
	&.bb-rl-focus-in--privacy {

		.bb-rl-activity-privacy-stage {
			display: block;
		}

		&:not(.focus-in--group) .bb-rl-privacy-status-form-footer {
			visibility: hidden;
			height: 0;
			width: 0;
			opacity: 0;
			border: 0;
		}
	}

	&.bb-rl-focus-in--group {

		#bb-rl-whats-new-post-in {
			display: none;
		}

		.bb-rl-whats-new-post-in-box-header {
			display: flex;
			border-bottom: 1px solid var(--bb-rl-border-secondary-color);
			padding: var(--bb-rl-space-200) var(--bb-rl-space-300);
			margin: 0;

			h3 {
				color: var(--bb-rl-text-color);
				font-size: 18px;
				font-weight: 600;
				line-height: 1.5;
			}

			.bb-rl-model-close-button {
				margin-left: auto;
				line-height: 1;

				span {
					color: var(--bb-rl-icon-color);
					font-size: var(--bb-rl-base-line);
				}
			}
		}

		#bb-rl-whats-new-post-in-box {
			display: block;
			position: fixed;
			z-index: var(--bb-rl-z-index-modal);
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			width: 720px;
			max-width: 90%;
			background-color: var(--bb-rl-background-color);
			border-radius: var(--bb-rl-radius-lg);

			#bb-rl-activity-group-ac-items {
				min-height: 130px;
				max-height: 280px;
				overflow: auto;
				padding: var(--bb-rl-space-100) 0;
			}

			.bb-rl-activity-object {

				label {
					display: flex;
					align-items: center;
					padding: var(--bb-rl-space-100) var(--bb-rl-space-300);
					cursor: pointer;

					&:hover {
						background-color: var(--bb-rl-background-secondary-hover-color);
					}
				}

				.bb-rl-radio-style {
					height: auto;
					width: auto;
					visibility: visible;
					opacity: 1;
					margin-right: var(--bb-rl-space-300);
				}

				.avatar {
					height: 40px;
					width: 40px;
					border-radius: var(--bb-rl-radius-md);
					margin-right: var(--bb-rl-space-200);
				}

				.bp-item-name {
					color: var(--bb-rl-text-color);
					font-size: 15px;
					font-weight: 500;
					line-height: 1.6;
				}
			}

			.bb-rl-privacy-status-form-footer {
				display: block;
				visibility: visible;
				opacity: 1;
				height: auto;
				width: auto;
			}

			.bb-rl-privacy-status-actions {
				display: flex;
				justify-content: flex-end;
				align-items: center;
				padding: var(--bb-rl-space-200) var(--bb-rl-space-300);
				border-top: 1px solid var(--bb-rl-border-secondary-color);
				gap: var(--bb-rl-space-100);
			}

			.activity-autocomplete-wrapper {
				display: flex;
				padding: var(--bb-rl-space-200) var(--bb-rl-space-300);
				position: relative;

				&:before {
					content: "\e30c";
					font-family: bb-icons-rl;
					font-size: 20px;
					color: var(--bb-rl-icon-secondary-color);
					position: absolute;
					top: 50%;
					left: var(--bb-rl-space-400);
					transform: translateY(-50%);
				}

				input {
					background-color: var(--bb-rl-background-color);
					color: var(--bb-rl-text-tertiary-color);
					font-size: 14px;
					padding: var(--bb-rl-space-100) var(--bb-rl-space-400) var(--bb-rl-space-100);
					width: 100%;
					border: 1px solid var(--bb-rl-border-tertiary-color);
					border-radius: var(--bb-rl-radius-md);
				}

				.activity-autocomplete-clear {
					position: absolute;
					top: 50%;
					right: var(--bb-rl-space-400);
					transform: translate(0, -50%);
					z-index: 6;
					width: 20px;
					height: 20px;
					cursor: pointer;
					display: none;

					i {
						display: block;
						font-size: 20px;
						color: var(--bb-rl-icon-secondary-color);
					}
				}
			}

			#bb-rl-privacy-status-back {
				display: none;
			}

			.activity-is-autocomplete .activity-autocomplete-clear {
				display: inline-block;
			}
		}

		&.bb-rl-focus-in--blank-group #bb-rl-privacy-status-submit {
			opacity: 0.6;
			cursor: default;
			pointer-events: none;
		}

		.bb-rl-whats-new-post-in-box--overlay {
			position: fixed;
			inset: 0;
			background-color: rgba(0, 0, 0, 0.5);
			backdrop-filter: blur(2px);
		}

		#bb-rl-activity-post-form-privacy {
			display: none;
		}

		.groups-selection {
			display: flex;
			align-items: center;
			gap: var(--bb-rl-space-100);
			font-size: 0.9rem;
			color: var(--bb-rl-text-secondary-color);
			font-weight: 500;
			justify-content: center;
			margin: var(--bb-rl-space-100) 0;
		}
	}

	// Activity Post Form Privacy stage
	.bb-rl-activity-privacy-stage {
		background-color: var(--bb-rl-background-color);
		border-radius: var(--bb-rl-radius-md);
		box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.15);
		padding: var(--bb-rl-space-100) 0;
		position: absolute;
		top: 145px;
		left: 90px;
		z-index: var(--bb-rl-z-index-dropdown);
		width: 280px;

		.bb-rl-privacy-radio {
			display: block;
			height: 0;
			width: 0;
			visibility: hidden;
			opacity: 0;
		}

		.bb-rl-privacy-tag-wrapper {
			display: flex;
			align-items: flex-start;
			gap: var(--bb-rl-space-100);
		}

		.bb-rl-privacy-figure {
			color: var(--bb-rl-icon-secondary-color);
			font-size: var(--bb-rl-base-line);
			line-height: 1;
			margin-top: 2px;

			&:before {
				font-family: bb-icons-rl;
			}

			&.bb-rl-privacy-figure--public:before {
				content: "\e288";
			}

			&.bb-rl-privacy-figure--loggedin:before {
				content: "\e68c";
			}

			&.bb-rl-privacy-figure--friends:before {
				content: "\e4d6";
			}

			&.bb-rl-privacy-figure--onlyme:before {
				content: "\e2fa";
			}

			&.bb-rl-privacy-figure--group:before {
				content: "\e68e";
			}
		}

		.bb-rl-privacy-tag {
			display: flex;
			flex-direction: column;
		}

		.bb-rl-privacy-label {
			color: var(--bb-rl-text-color);
			font-size: 0.85rem;
			font-weight: 500;
			line-height: 1.5;
		}

		.bb-rl-privacy-sub-label {
			color: var(--bb-rl-text-secondary-color);
			font-size: 11px;
			line-height: 1.4;
		}
	}

	.bb-rl-activity-privacy__list > label {
		display: block;
		padding: var(--bb-rl-space-100) var(--bb-rl-space-200);
		cursor: pointer;

		&:has(input:checked),
		&:hover {
			background-color: var(--bb-rl-background-secondary-hover-color);
		}
	}

	label.bb-rl-activity-privacy__label-group {
		padding-right: 40px;
		position: relative;

		&:after {
			content: "\e13a";
			color: var(--bb-rl-icon-secondary-color);
			font-family: bb-icons-rl;
			font-size: var(--bb-rl-font-size-base);
			position: absolute;
			top: var(--bb-rl-space-100);
			right: var(--bb-rl-space-200);
		}
	}

	#bb-rl-whats-new-post-in-box {
		display: none;
	}

	#bb-rl-whats-new-privacy-stage-footer {
		display: none;
	}

	// Notice
	#message-feedback {
		position: absolute;
		top: 58px;
		margin: 15px 25px 0;
		width: calc(100% - 50px);
		min-width: initial;
	}

	// GIF Preview
	div[class*="attached-gif-container"] {
		position: relative;
		margin-bottom: 0;
		height: auto !important;
		background-repeat: no-repeat;
		max-width: 100%;
		border-radius: var(--bb-rl-radius-lg);
		overflow: hidden;

		.gif-image-container {

			img {
				max-width: 100%;
			}
		}

		.gif-image-overlay {
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 14px;
			line-height: 1;
			color: var(--bb-rl-icon-secondary-color);
			background-color: var(--bb-rl-background-secondary-color);
			border-radius: var(--bb-rl-radius-full);
			height: 20px;
			width: 20px;
			text-align: center;
			position: absolute;
			top: var(--bb-rl-space-100);
			right: var(--bb-rl-space-100);
			cursor: pointer;
		}
	}

	#bb-rl-whats-new-attachments .bb-rl-activity-attached-gif-container {
		margin: 0 var(--bb-rl-space-300);
	}

	#bb-rl-whats-new-toolbar {

		.bb-rl-post-emoji {
			padding: 0;
			border: 0;
		}

		.emojionearea-picker.emojionearea-picker-position-top {
			top: inherit;
			bottom: 40px;
		}

		.emojionearea-button {
			border: 0.5px solid transparent;
			display: flex;
			align-items: center;
			justify-content: center;
			padding: var(--bb-rl-space-50);

			&:before {
				content: "\e436";
				font-size: var(--bb-rl-base-line);
				font-family: bb-icons-rl;
			}

			&.active {
				color: var(--bb-rl-icon-color);
				background-color: var(--bb-rl-background-secondary-hover-color);
				border-color: var(--bb-rl-border-secondary-color);
				border-radius: var(--bb-rl-radius-md);
			}
		}
	}
}

// Medium Editor
#bb-rl-editor-toolbar {
	display: flex;
	align-items: center;
	padding: var(--bb-rl-space-100) var(--bb-rl-space-300);

	.medium-editor-toolbar {
		position: static;
		visibility: hidden;
		opacity: 0;
		background-color: transparent;
		border-radius: 0;
		transition: opacity ease 0.3s;

		&.active {
			visibility: visible;
			opacity: 1;
		}
	}

	.bb-rl-post-mention {
		visibility: hidden;
		opacity: 0;
		transition: opacity ease 0.3s;
	}

	&:has(.medium-editor-toolbar.active) {
		opacity: 0.4;

		&:has(.medium-editor-toolbar-active) {
			opacity: 1;
		}

		.bb-rl-post-mention {
			visibility: visible;
			opacity: 1;
		}
	}

	&:has(.medium-editor-toolbar-form.medium-editor-toolbar-form-active) .bb-rl-post-mention {
		visibility: hidden;
		opacity: 0;
	}

	.medium-editor-action {
		padding: var(--bb-rl-space-50);
		background-color: transparent;
		border-radius: var(--bb-rl-radius-md);
		height: auto;
		min-width: auto;
		margin-right: var(--bb-rl-space-100);
		transition: none;
		border: 0.5px solid transparent;

		b {
			display: flex;
			font-size: 0;
			line-height: 24px;
			height: auto;
			width: auto;

			&:before {
				color: var(--bb-rl-icon-secondary-color);
				font-family: bb-icons-rl;
				font-size: 24px;
			}
		}

		&.medium-editor-button-active {
			background-color: var(--bb-rl-background-secondary-hover-color);
			border-color: var(--bb-rl-border-secondary-color);

			b:before {
				color: var(--bb-rl-icon-color);
			}
		}
	}

	.medium-editor-action-bold b:before {
		content: "\e5be";
	}

	.medium-editor-action-italic b:before {
		content: "\e5c0";
	}

	.medium-editor-action-unorderedlist b:before {
		content: "\e2f2";
	}

	.medium-editor-action-orderedlist b:before {
		content: "\e2f6";
	}

	.medium-editor-action-quote b:before {
		content: "\e660";
	}

	.medium-editor-action-anchor b:before {
		content: "\e2e2";
	}

	.medium-editor-action-pre b:before {
		content: "\e1bc";
	}

	.medium-editor-action-h3 b:before {
		content: "\e6c0";
	}

	.medium-editor-action-h4 b:before {
		content: "\e6c2";
	}

	.medium-editor-toolbar-form {
		background-color: transparent;
		border-radius: 0;

		.medium-editor-toolbar-input {
			color: var(--bb-rl-text-color);
			background-color: transparent;
			border: 1px solid var(--bb-rl-border-secondary-color);
			height: 35px;
			border-radius: var(--bb-rl-radius-md);
			padding: var(--bb-rl-space-100) var(--bb-rl-space-200);

			&.isNotValid {
				border-color: var(--bb-rl-border-danger-secondary-color);
			}

			&:focus {
				color: var(--bb-rl-text-color);
			}

			&::-webkit-input-placeholder {
				color: var(--bb-rl-text-color);
			}
		}


		> a {
			font-size: 0;

			&:before {
				content: "\e182";
				color: var(--bb-rl-icon-secondary-color);
				font-family: bb-icons-rl;
				font-size: 22px;
			}

			&.medium-editor-toolbar-save:before {
				content: "\e182";
			}

			&.medium-editor-toolbar-close:before {
				content: "\e4f6";
			}
		}
	}
}

.bb-rl-whats-new-toolbar--addon {

	.bb-rl-post-elements-buttons-item {
		display: flex;
		position: relative;
		color: var(--bb-rl-icon-secondary-color);
		font-size: var(--bb-rl-base-line);
		line-height: 1;
		border: 0.5px solid transparent;
		padding: var(--bb-rl-space-50);
		margin-right: var(--bb-rl-space-100);
		cursor: pointer;

		&.active {
			color: var(--bb-rl-icon-color);
			background-color: var(--bb-rl-background-secondary-hover-color);
			border-color: var(--bb-rl-border-secondary-color);
			border-radius: var(--bb-rl-radius-md);

			[class*="toolbar-button"].bb-rl-toolbar-button {
				border: 0;
			}
		}

		[class*="toolbar-button"].bb-rl-toolbar-button {
			padding: 0;
			border: 0;
		}
	}
}

// Activity Link Preview
.activity-url-scrapper-container {
	display: flex;
	flex-flow: column;
	padding: var(--bb-rl-space-100) var(--bb-rl-space-300);
}

.activity-url-scrapper-loading {
	display: flex;
	align-items: center;
	gap: var(--bb-rl-space-100);
	color: var(--bb-rl-text-secondary-color);
	font-size: 0.85rem;
	padding: var(--bb-rl-space-100) 0;

	i {
		height: 18px;
		width: 18px;
	}
}

.activity-link-preview-image-cover {
	position: relative;
	overflow: hidden;
	border-radius: var(--bb-rl-radius-lg) var(--bb-rl-radius-lg) 0 0;

	img {
		height: 285px;
		width: 100%;
		object-fit: cover;
	}
}

.activity-link-preview-info {
	background-color: var(--bb-rl-background-secondary-color);
	border-radius: var(--bb-rl-radius-lg);
	padding: var(--bb-rl-space-200) var(--bb-rl-space-200);
	margin-bottom: var(--bb-rl-space-300);
}

#activity-url-scrapper-img-holder + .activity-link-preview-info {
	border-radius: 0 0 var(--bb-rl-radius-lg) var(--bb-rl-radius-lg);
}


.activity-url-scrapper-container.activity-post-form-link-wp-embed .activity-link-preview-info {
	background-color: transparent;
	padding: 0;
}

.activity-link-preview-link-name {
	color: var(--bb-rl-text-tertiary-color);
	font-size: 0.85rem;
	font-weight: 500;
	line-height: 1.5;
	text-transform: uppercase;

	.bb-rl-activity-list .bb-rl-activity-inner & {
		margin: 0;
	}
}

.activity-link-preview-title {
	color: var(--bb-rl-text-color);
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.3;
	display: block;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	width: 100%;
	margin-top: var(--bb-rl-space-50);

	a {
		color: var(--bb-rl-text-color);
	}

	.bb-rl-activity-list .bb-rl-activity-inner & {
		margin: var(--bb-rl-space-50) 0 0 0;
	}
}

#activity-url-scrapper-img-holder {
	position: relative;
}

.activity-link-preview-excerpt {
	color: var(--bb-rl-text-secondary-color);
	font-size: 0.85rem;
	font-weight: 500;
	line-height: 1.5;
	margin-top: var(--bb-rl-space-50);

	iframe {
		border-radius: var(--bb-rl-radius-lg);
		width: 100%;
	}
}

#activity-close-link-suggestion {
	color: var(--bb-rl-text-color);
	font-size: 0.85rem;
	font-weight: 500;
	line-height: 1.5;
	padding: var(--bb-rl-space-100);
	align-self: flex-end;
}

.activity-link-preview-icons {
	position: absolute;
	left: 15px;
	top: 15px;
	display: flex;
	flex-direction: row;
	gap: var(--bb-rl-space-100);
	width: calc(100% - 30px);

	a {
		display: flex;
		justify-content: center;
		align-items: center;
		color: var(--bb-rl-icon-secondary-color);
		background-color: var(--bb-rl-background-secondary-color);
		font-size: 22px;
		line-height: 1;
		border-radius: var(--bb-rl-radius-full);
		box-shadow: 0 1px 1.5px rgba(0, 0, 0, 0.08);
		height: 35px;
		width: 35px;

		&#activity-link-preview-select-image {
			display: none;
			margin-left: auto;

			i {
				height: 35px;
				width: 35px;
				display: flex;
				justify-content: center;
				align-items: center;
			}
		}
	}
}

.activity-url-thumb-nav {
	display: inline-block;
	position: absolute;
	width: 100%;
	top: 50%;
	text-align: center;
	margin: auto;
	height: 40px;
	transform: translate(0, -50%);

	#activity-url-scrapper-img-count {
		display: none;
	}

	button {
		cursor: pointer;
		margin: 0 var(--bb-rl-space-50);
		padding: 0;
		border: 0;
		height: 40px;
		width: 40px;
		position: absolute;
		top: 0;
		left: 0;
		background-color: transparent;
		display: none;

		[class*="bb-icons-rl"]:before {
			font-size: 40px;
			text-shadow: 0 0 4px rgba(0, 0, 0, 0.3);
			color: var(--bb-rl-text-white-color);
		}

		&#activity-url-nextPicButton {
			left: inherit;
			right: 0;
		}
	}
}

.twitter-timeline {
	width: 100% !important;
}


.whats-new-topic-selector {
	position: relative;
	margin-right: var(--bb-rl-space-300);

	.bb-rl-topic-selector-button {
		background-color: var(--bb-rl-background-secondary-color);
		border: 1px solid var(--bb-rl-border-secondary-color);
		color: var(--bb-rl-text-color);
		font-size: var(--bb-rl-font-size-sm);
		font-weight: 500;
		padding: var(--bb-rl-space-100) var(--bb-rl-space-300) var(--bb-rl-space-100) var(--bb-rl-space-100);
		border-radius: var(--bb-rl-radius-md);
		display: block;
		cursor: pointer;
		max-width: 160px;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;

		&:after {
			content: "\e136";
			color: var(--bb-rl-icon-color);
			font-size: 14px;
			font-family: bb-icons-rl;
			font-weight: 600;
			margin: 0;
			position: absolute;
			top: 50%;
			right: var(--bb-rl-space-100);
			transform: translateY(-50%);
		}
	}

	.bb-rl-topic-selector-list {
		position: absolute;
		top: 45px;
		left: 0;
		width: 200px;
		display: none;

		ul {
			list-style: none;
			border: 1px solid var(--bb-rl-border-secondary-color);
			border-radius: var(--bb-rl-radius-base);
			background: var(--bb-rl-background-color);
			box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.12);
			padding: var(--bb-rl-space-100) 0;
			width: 200px;
			z-index: 99;
			max-height: 160px;
			overflow: auto;
			margin-bottom: var(--bb-rl-space-300);

			a {
				display: block;
				padding: var(--bb-rl-space-100) var(--bb-rl-space-200);
				color: var(--bb-rl-text-secondary-color);
				font-size: var(--bb-rl-font-size-sm);
				font-weight: 500;
				line-height: 1.5;
				text-decoration: none;

				&:hover {
					color: var(--bb-rl-text-color);
					background-color: var(--bb-rl-background-secondary-hover-color);
				}
			}
		}
	}

	&.is-active {

		.bb-rl-topic-selector-list {
			display: block;
		}
	}
}

.bb-topic-tooltip-wrapper {
	position: absolute;
	z-index: 99999;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.15s;
	bottom: calc(100% + 15px);
	right: 0;

	&.active {
		opacity: 1;
		pointer-events: auto;
	}

	.bb-topic-tooltip {
		background: var(--bb-rl-background-black-color);
		color: var(--bb-rl-text-white-color);
		padding: var(--bb-rl-space-100) var(--bb-rl-space-200);
		border-radius: var(--bb-rl-radius-md);
		font-size: 12px;
		font-weight: 600;
		white-space: nowrap;
		box-shadow: 0 2.45px 3.68px 0 rgba(0, 0, 0, 0.15);
		position: relative;
	}

	&:after {
		content: "";
		position: absolute;
		bottom: -7px;
		right: 20px;
		transform: translateX(-50%);
		border-width: 7px 7px 0 7px;
		border-style: solid;
		border-color: var(--bb-rl-background-black-color) transparent transparent transparent;
		width: 0;
		height: 0;
		display: block;
	}
}

.bb-rl-activity-modal-open {
	overflow: hidden;
}

.bb-rl-modal-header-actions {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-left: auto;
}

.bb-rl-activity-form--schedule .bb-rl-bb-model-header {

	.bb-rl-modal-header-actions {
		margin-left: 0;
		order: 99;
	}
}

@media screen and (max-width: 680px) {

	.bb-rl-activity-form.bb-rl-focus-in {

		.bb-rl-whats-new-form-footer {
			flex-flow: column;
			align-items: center;
			gap: var(--bb-rl-space-100);
		}

		.bb-rl-gif-media-search-dropdown {
			left: -60px;
		}
	}
}

@media screen and (max-width: $sm) {

	.bb-rl-activity-update-form.modal-popup #bb-rl-whats-new-form {
		max-width: 95%;
	}

	[class*="bb-rl-activity-form"] #bb-rl-whats-new[contenteditable="true"]:empty:before,
	[class*="bb-rl-activity-form"] #bb-rl-whats-new-placeholder[contenteditable="true"]:empty:before {
		font-size: 14px;
	}

	.bb-rl-activity-form.bb-rl-focus-in {

		#bb-rl-whats-new {
			font-size: 14px;
		}

		[class*="post-elements-buttons-item"] {
			margin-right: var(--bb-rl-space-50);

			[class*="toolbar-button"] i {
				font-size: 22px;
			}
		}

		.dropzone.open {
			margin: var(--bb-rl-space-100) var(--bb-rl-space-200);
		}

		.medium-editor-toolbar-form {

			.medium-editor-toolbar-input {
				font-size: 13px;
				width: 158px;
			}

			a {
				margin: 0 6px;
			}

			.medium-editor-toolbar-close {
				margin-right: 0;
			}
		}

		.bb-rl-gif-media-search-dropdown {
			left: -120px;
		}
	}

	#bb-rl-editor-toolbar {
		padding: var(--bb-rl-space-100) var(--bb-rl-space-200);

		[class*="toolbar-button"] i {
			font-size: 18px;
		}

		.medium-editor-toolbar-form > a:before {
			font-size: 18px;
		}

		.medium-editor-action {
			margin-right: 2px;

			b:before {
				font-size: 18px;
			}
		}
	}

	#bb-rl-activity-form-submit-wrapper:has(.whats-new-topic-selector) {
		flex-wrap: wrap;
		justify-content: center;
	}

	.whats-new-topic-selector {
		order: -1;
		display: block;
		width: 60%;
		text-align: center;
		max-width: 350px;
		margin: 15px 20% 5px;

		.bb-rl-topic-selector-list {
			z-index: 9;
		}

		.bb-rl-topic-selector-button {
			max-width: 100%;
			margin-bottom: var(--bb-rl-space-200);

			&:after {
				top: 18px;
			}
		}
	}
}
