.sh-rich-text {
	display: flex;
	flex-direction: column;
	gap: 0;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
	background: #fff;
	overflow: hidden;
	box-shadow: inset 0 1px 2px rgb(15 23 42 / 4%);
}

.sh-rich-text--tiptap {
	border-color: #94a3b8;
}

.sh-rich-text.is-invalid {
	border-color: #dc2626;
	box-shadow: 0 0 0 1px #dc2626;
}

.tiptap-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.125rem;
	padding: 0.375rem 0.5rem;
	border-bottom: 1px solid #e2e8f0;
	background: #f8fafc;
}

.tiptap-toolbar__group {
	display: inline-flex;
	align-items: center;
	gap: 0.125rem;
}

.tiptap-toolbar__separator {
	width: 1px;
	height: 1.25rem;
	margin: 0 0.25rem;
	background: #cbd5e1;
	flex-shrink: 0;
}

.tiptap-toolbar__button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2rem;
	height: 2rem;
	padding: 0;
	border: 0;
	border-radius: 0.375rem;
	background: transparent;
	color: #334155;
	font-size: 1rem;
	line-height: 1;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease, opacity 0.15s ease;
}

.tiptap-toolbar__button:hover:not(:disabled),
.tiptap-toolbar__button:focus-visible:not(:disabled) {
	background: #e2e8f0;
	color: #0f172a;
	outline: none;
}

.tiptap-toolbar__button.is-active {
	background: #dbeafe;
	color: #1d4ed8;
}

.tiptap-toolbar__button.is-disabled,
.tiptap-toolbar__button:disabled {
	opacity: 0.35;
	cursor: not-allowed;
}

.tiptap-toolbar__button svg,
.tiptap-toolbar__icon {
	width: 1rem !important;
	height: 1rem !important;
	min-width: 1rem;
	min-height: 1rem;
	display: block;
	flex-shrink: 0;
	fill: none !important;
	stroke: currentColor;
	overflow: visible;
}

.tiptap-toolbar .sh-icon {
	display: block;
	flex-shrink: 0;
	fill: none;
	stroke: currentColor;
}

.sh-rich-text__editor {
	min-height: 9rem;
	padding: 0.75rem 0.85rem;
	font-size: 0.9375rem;
	line-height: 1.55;
	color: #0f172a;
	background: #fff;
	outline: none;
	overflow-y: auto;
}

.sh-rich-text__editor:focus,
.sh-rich-text--tiptap .sh-rich-text__editor:focus-visible {
	outline: none;
	box-shadow: none;
}

.sh-rich-text--tiptap:has(.ProseMirror-focused) {
	box-shadow: inset 0 0 0 2px rgb(37 99 235 / 18%);
}

.sh-rich-text--fallback .sh-rich-text__toolbar,
.sh-rich-text--fallback .tiptap-toolbar {
	display: none;
}

.sh-rich-text--fallback .sh-rich-text__editor {
	display: none;
}

.sh-rich-text--fallback .sh-rich-text__input {
	display: block !important;
	min-height: 9rem;
	padding: 0.75rem 0.85rem;
	font-size: 0.9375rem;
	line-height: 1.55;
	color: #0f172a;
	background: #fff;
	border: 0;
	border-radius: 0;
	resize: vertical;
}

.sh-rich-text__plain {
	min-height: 9rem;
	padding: 0.75rem 0.85rem;
	font-size: 0.9375rem;
	line-height: 1.55;
	color: #0f172a;
	background: #fff;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
	resize: vertical;
	width: 100%;
	box-sizing: border-box;
}

.sh-rich-text__editor.ProseMirror,
.sh-rich-text__editor.ProseMirror:focus,
.sh-rich-text__editor.ProseMirror:focus-visible,
.sh-rich-text__editor.tiptap:focus,
.sh-rich-text__editor.tiptap:focus-visible {
	outline: none !important;
	box-shadow: none;
}

[data-sh-rich-text] .ProseMirror p,
[data-sh-rich-text] .tiptap p,
[data-sh-rich-text] .ProseMirror li,
[data-sh-rich-text] .ProseMirror p.ProseMirror-selectednode,
[data-sh-rich-text] .ProseMirror p[data-placeholder],
body.support-hub-admin-screen #wpbody-content #sh-reply-form [data-sh-rich-text] .ProseMirror p,
body.support-hub-admin-screen #wpbody-content [data-sh-rich-text] .ProseMirror p:focus-visible,
[data-sh-rich-text] .ProseMirror p:focus,
[data-sh-rich-text] .ProseMirror p:focus-visible,
[data-sh-rich-text] .tiptap p:focus,
[data-sh-rich-text] .tiptap p:focus-visible,
[data-sh-rich-text] .ProseMirror *:focus,
[data-sh-rich-text] .ProseMirror *:focus-visible,
[data-sh-rich-text] .tiptap *:focus,
[data-sh-rich-text] .tiptap *:focus-visible {
	outline: none !important;
	outline-width: 0 !important;
	outline-style: none !important;
	outline-color: transparent !important;
	-webkit-focus-ring-color: transparent !important;
	border: none !important;
	box-shadow: none !important;
}

.sh-rich-text__editor p.sh-is-empty:first-child::before {
	content: attr(data-placeholder);
	color: #94a3b8;
	float: left;
	height: 0;
	pointer-events: none;
}

/* Empty editor: expand click target so placeholder text is clickable */
.sh-rich-text__editor > p.sh-is-empty:first-child:only-child,
.sh-rich-text__editor > p.sh-is-empty.sh-is-editor-empty:first-child {
	min-height: 1.55em;
}

.sh-rich-text__editor :where(p, ul, ol) {
	margin: 0 0 0.65em;
}

.sh-rich-text__editor :where(p:last-child, ul:last-child, ol:last-child) {
	margin-bottom: 0;
}

.sh-rich-text__editor :where(ul, ol) {
	padding-left: 1.35rem;
}

.sh-rich-text__editor a {
	color: #2563eb;
	text-decoration: underline;
}

.sh-rich-text__input {
	display: none !important;
}

.sh-ticket-reply-form__rich-text .sh-rich-text__editor {
	min-height: 9rem;
}

@media (max-width: 782px) {
	.tiptap-toolbar {
		padding: 0.3rem 0.35rem;
		gap: 0.1rem;
	}

	.tiptap-toolbar__button {
		width: 1.85rem;
		height: 1.85rem;
	}

	.tiptap-toolbar__separator {
		margin: 0 0.15rem;
	}

	.sh-rich-text__editor {
		min-height: 7.5rem;
		padding: 0.65rem 0.75rem;
		font-size: 16px;
	}
}