.rich-text {
	border: 1px solid #d0d5dd;
	border-radius: 8px;
	overflow: hidden;
	background: #fff;
}

.rich-text:focus-within {
	border-color: #86b7fe;
	box-shadow: 0 0 0 0.25rem rgba(0, 102, 230, 0.15);
}

.rich-text-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2px;
	padding: 6px 8px;
	background: #f8f9fa;
	border-bottom: 1px solid #e4e7ec;
}

.rich-text-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 30px;
	height: 30px;
	padding: 0 6px;
	border: 1px solid transparent;
	border-radius: 6px;
	background: transparent;
	color: #475467;
	font-size: 0.95rem;
	line-height: 1;
	cursor: pointer;
}

.rich-text-btn:hover { background: #eceff3; color: #101828; }

.rich-text-btn.is-active {
	background: #e7f0ff;
	border-color: #b6d4fe;
	color: #0066e6;
}

.rich-text-sep {
	width: 1px;
	height: 18px;
	margin: 0 4px;
	background: #e4e7ec;
}

.rich-text-surface.form-control {
	min-height: 140px;
	max-height: 420px;
	overflow-y: auto;
	border: 0;
	border-radius: 0;
	box-shadow: none;
}

.rich-text-surface.form-control:focus { box-shadow: none; }

.rich-text-surface > :first-child { margin-top: 0; }
.rich-text-surface > :last-child  { margin-bottom: 0; }

.rich-text-surface h3,
.rich-text-surface h4 { font-size: 1.05rem; font-weight: 600; margin: 0.75rem 0 0.35rem; }
.rich-text-surface p  { margin: 0 0 0.6rem; }
.rich-text-surface ul,
.rich-text-surface ol { margin: 0 0 0.6rem; padding-left: 1.3rem; }
.rich-text-surface blockquote {
	margin: 0 0 0.6rem;
	padding-left: 0.8rem;
	border-left: 3px solid #e4e7ec;
	color: #667085;
}

.rich-text-content > :last-child { margin-bottom: 0; }
.rich-text-content ul,
.rich-text-content ol { padding-left: 1.3rem; }
.rich-text-content blockquote {
	padding-left: 0.8rem;
	border-left: 3px solid #e4e7ec;
	color: #667085;
}