/* Inline TinyMCE description box for forms and form items (ptb-form-desc-editor.js): looks like a field; toolbar floats above it while editing */
.ptb-desc-editor { min-height: 110px; padding: 8px 12px; margin-bottom: 4px; background: #fff; border: 1px solid var(--ptb-border, #e6eaef); border-radius: 8px; font-family: var(--font-sans, 'Inter', sans-serif); font-size: 14px; line-height: 1.5; color: var(--ptb-text, #333); overflow-wrap: anywhere; }
.ptb-desc-editor:focus { outline: none; border-color: var(--ptb-sky-dark, #109edb); box-shadow: 0 0 0 3px rgba(16,158,219,.15); }
.ptb-desc-editor p, .ptb-desc-editor li { font-size: inherit; line-height: inherit; margin: 0 0 8px; }
.ptb-desc-editor ul, .ptb-desc-editor ol { margin: 0 0 8px 20px; }
/* The floating toolbar is attached to <body>, so it is styled by TinyMCE's own classes. */
.tox.tox-tinymce-inline .tox-editor-header { border: 1px solid #cdd6e0 !important; border-radius: 10px !important; box-shadow: 0 6px 20px rgba(0,0,0,.18) !important; overflow: hidden; }
.tox.tox-tinymce-inline .tox-toolbar-overlord, .tox.tox-tinymce-inline .tox-toolbar, .tox.tox-tinymce-inline .tox-toolbar__primary { background: #f1f5f9 !important; }
/* Match how the description renders on the form pages (.ptb-rich-text in new-form.css) */
.ptb-desc-editor h3, .ptb-desc-editor h4 { font-family: inherit; font-weight: 700; line-height: 1.3; color: inherit; margin: .4em 0; }
.ptb-desc-editor h3 { font-size: 1.25em; }
.ptb-desc-editor h4 { font-size: 1.1em; }
.ptb-desc-editor strong, .ptb-desc-editor b { font-family: inherit; font-weight: 700; }
.ptb-desc-editor blockquote { font-size: inherit; padding: 0 0 0 1em; margin: 0 0 8px; border-left: 3px solid #d6dde5; }
/* TinyMCE gives the inline toolbar no z-index, so it would sit under Foundation reveal popups (1005); keep it below TinyMCE's own menus/dialogs (1300) */
.tox.tox-tinymce-inline { z-index: 1250 !important; }