@use "~admin-stylesheets/colors";

.nelio-content-social-message-medium-preview {
	background: #fff;
	border: 1px solid #dbdbdb;
	border-radius: 3px;
	color: #262626;
	cursor: default;
	display: flex;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
		Helvetica, Arial, sans-serif;
	height: 250px;
	margin: 1em;
	user-select: none;

	&__content {
		display: flex;
		flex-direction: column;
		flex-shrink: 0;
		font-size: 14px;
		width: 100%;
		overflow-y: auto;
	}

	&__title {
		font-size: 1.5rem;
		line-height: 1.5;
		font-weight: 700;
		padding: 1rem;
		padding-bottom: 0;
	}

	&__profile-and-name {
		border-bottom: 1px solid #efefef;
		display: flex;
		padding: 1em;
	}

	.nelio-content-social-profile-icon {
		float: left;
		font-size: 32px;
	}

	&__display-name-and-date {
		display: flex;
		flex-direction: column;
		margin-left: 1em;
	}

	&__display-name {
		font-size: 12px;
	}

	&__date {
		color: #aaa;
		font-size: 10px;
	}

	&__medium-toolbar {
		display: flex;
		justify-content: space-between;
		padding: 1em;
		border-bottom: 1px solid #efefef;
	}

	&__medium-toolbar-section {
		display: flex;
		gap: 1em;
	}
}

/* MESSAGE */

.nelio-content-social-message-medium-preview
	.nelio-content-computed-text-preview {
	color: #222;
	cursor: auto;
	line-height: 15px;
	margin-top: 1em;
	padding: 0 1rem;
	user-select: auto;
	word-break: break-word;
	overflow-wrap: break-word;

	&--empty {
		opacity: 0.6;
	}

	* {
		max-width: 100%;
	}
}