/* Shared visual contract: Tiptap, admin previews and public delivery content. */
.rich-content img, .markdown-content img { max-width: 100%; height: auto; vertical-align: middle; border-radius: .5rem; }
.image-upload-label { display: inline-flex; position: relative; align-items: center; padding: .5rem .75rem; border: 1px solid #99f6e4; border-radius: .5rem; color: #0f766e; cursor: pointer; font-size: .8rem; }
.image-upload-label input { position: absolute; inset: 0; width: 100%; opacity: 0; cursor: pointer; }
.image-upload-label:focus-within { outline: 2px solid #0d9488; outline-offset: 2px; }
.image-help { display: inline-block; margin: .5rem; color: #64748b; font-size: .75rem; }
.image-input [role=alert] { color: #be123c; font-size: .8rem; }
.image-input [role=alert] button { text-decoration: underline; }
.image-thumbnails { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: .75rem; }
.image-thumbnails figure { margin: 0; max-width: 140px; }
.image-thumbnails img { max-width: 140px; max-height: 120px; object-fit: contain; border-radius: .5rem; }
.image-thumbnails figcaption { color: #64748b; font-size: .7rem; }
.content-image-actions { display: inline-flex; flex-wrap: wrap; gap: .75rem; margin: .5rem; font-size: .8rem; }
.content-image-actions button, .content-image-actions a { color: #0f766e; cursor: pointer; text-decoration: underline; }
.content-image-viewer { width: min(96vw, 1200px); max-height: 95vh; padding: 1rem; border: none; border-radius: 1rem; }
.content-image-viewer::backdrop { background: rgb(0 0 0 / 70%); }
.content-image-viewer img { display: block; max-width: 100%; height: auto; margin: .75rem auto; }
.content-image-viewer button { padding: .5rem 1rem; border: 1px solid #99f6e4; border-radius: .5rem; cursor: pointer; }
.rt-color-red { color: #dc2626; }
.rt-color-orange { color: #ea580c; }
.rt-color-green { color: #16a34a; }
.rt-color-blue { color: #2563eb; }
.rt-color-purple { color: #9333ea; }
.rt-color-gray { color: #64748b; }
.rt-align-left { text-align: left; }
.rt-align-center { text-align: center; }
.rt-align-right { text-align: right; }
.rich-content h1, .markdown-content h1 { font-size: 1.75em; font-weight: 800; line-height: 1.35; margin: .8em 0 .4em; }
.rich-content h2, .markdown-content h2 { font-size: 1.5em; font-weight: 800; line-height: 1.35; margin: .8em 0 .4em; }
.rich-content h3, .markdown-content h3 { font-size: 1.25em; font-weight: 700; line-height: 1.35; margin: .8em 0 .4em; }
.rich-content h4, .markdown-content h4 { font-size: 1.1em; font-weight: 700; line-height: 1.35; margin: .8em 0 .4em; }
.rich-content h5, .markdown-content h5, .rich-content h6, .markdown-content h6 { font-weight: 700; }
.rich-content p { margin: .4em 0; }
.rich-content p:empty, .markdown-content p:empty { min-height: 1.75em; }
.rich-content ul, .markdown-content ul { list-style: disc; padding-left: 1.5em; }
.rich-content ol, .markdown-content ol { list-style: decimal; padding-left: 1.5em; }
.rich-content a { color: #0f766e; text-decoration: underline; }
.rich-content pre { white-space: pre-wrap; padding: .8rem; background: #152725; color: #eaf7f4; border-radius: .5rem; }
.rich-content code { font-family: ui-monospace, monospace; }
.rich-content .rt-placeholder { border-radius: .25rem; background: #e0f2fe; border: 1px solid #bae6fd; padding: 0 .15rem; white-space: pre-wrap; }
.rich-content .ProseMirror-selectednode { outline: 2px solid #0d9488; }
.rich-content .ProseMirror { white-space: pre-wrap; overflow-wrap: anywhere; }
.rich-content strong { font-weight: bold; } .rich-content em { font-style: italic; }
.rich-swatch { width: 1rem; height: 1rem; border-radius: 50%; }
.swatch-red { background: #dc2626; } .swatch-orange { background: #ea580c; } .swatch-green { background: #16a34a; }
.swatch-blue { background: #2563eb; } .swatch-purple { background: #9333ea; } .swatch-gray { background: #64748b; }
.rich-editor-footer { border-top: 1px solid #e2e8f0; padding: .5rem .8rem; font-size: .75rem; color: #64748b; }
.rich-editor-footer [role=alert], .rich-link-form [role=alert] { color: #be123c; }
.rich-link-form { display: flex; flex-wrap: wrap; align-items: end; gap: .5rem; padding: .75rem; background: #f0fdfa; font-size: .8rem; }
.rich-link-form label { flex: 1 1 100%; }
.rich-link-form input { display: block; width: 100%; border: 1px solid #99f6e4; border-radius: .4rem; padding: .5rem; }
.rich-link-form button { padding: .4rem; border: 1px solid #99f6e4; border-radius: .4rem; }
.rich-tool:focus-visible { outline: 2px solid #0d9488; outline-offset: 1px; }
@media(max-width: 640px) { .rich-tool { min-width: 2.25rem; height: 2.25rem; } .rich-group { flex-wrap: wrap; } .rich-content { padding: .65rem; } }