/*
 * Shared rich-content typography.
 *
 * Goal: blog post content and event description/finePrint render IDENTICALLY in
 * every context — the public site, the Team dashboard (Trix editor + preview)
 * and the Business panel (Trix editor + preview).
 *
 * Spacing is deliberately collapse-free: only bottom margins (never top
 * margins) plus padding-top on headings. Margin collapsing behaves differently
 * inside a Trix contenteditable than in a static render, so relying on it made
 * the editor look more spaced than the published page. Units are rem (not em)
 * so spacing doesn't drift with the editor's font-size. Text colour is
 * inherited so each theme (dark site/panel, light Team) stays readable.
 */

.rich-content,
.wysiwyg-content,
.org-html-content,
trix-editor,
trix-editor.org-trix-editor {
    line-height: 1.6;
    font-size: 0.9375rem;
    color: inherit;
    word-break: break-word;
}

/* Headings — size + weight */
.rich-content h1, .wysiwyg-content h1, .org-html-content h1, trix-editor h1, trix-editor.org-trix-editor h1 { font-size: 1.5rem; }
.rich-content h2, .wysiwyg-content h2, .org-html-content h2, trix-editor h2, trix-editor.org-trix-editor h2 { font-size: 1.3rem; }
.rich-content h3, .wysiwyg-content h3, .org-html-content h3, trix-editor h3, trix-editor.org-trix-editor h3 { font-size: 1.125rem; }
.rich-content h4, .wysiwyg-content h4, .org-html-content h4, trix-editor h4, trix-editor.org-trix-editor h4 { font-size: 1rem; }

/* Block spacing — bottom margins only; headings get padding-top for breathing
   room above (padding never collapses, so editor === render). */
.rich-content :is(h1, h2, h3, h4), .wysiwyg-content :is(h1, h2, h3, h4),
.org-html-content :is(h1, h2, h3, h4), trix-editor :is(h1, h2, h3, h4) {
    font-weight: 700;
    line-height: 1.3;
    margin: 0 0 0.5rem;
    padding-top: 0.6rem;
}

.rich-content p, .wysiwyg-content p, .org-html-content p, trix-editor p {
    margin: 0 0 0.85rem;
}

/* Keep intentional blank lines (empty <p> or a lone <br>) visible. An empty
   block self-collapses to zero height in a static render, so a blank line a
   user typed would vanish on the page while still showing in the editor —
   give it a line's height so editor and render stay identical. */
.rich-content p:empty, .wysiwyg-content p:empty, .org-html-content p:empty, trix-editor p:empty,
.rich-content p:has(> br:only-child), .wysiwyg-content p:has(> br:only-child),
.org-html-content p:has(> br:only-child), trix-editor p:has(> br:only-child) {
    min-height: 1.5rem;
}

.rich-content ul, .rich-content ol,
.wysiwyg-content ul, .wysiwyg-content ol,
.org-html-content ul, .org-html-content ol,
trix-editor ul, trix-editor ol,
trix-editor.org-trix-editor ul, trix-editor.org-trix-editor ol {
    margin: 0 0 0.85rem;
    padding-left: 1.5rem;
}
.rich-content ul, .wysiwyg-content ul, .org-html-content ul, trix-editor ul { list-style: disc; }
.rich-content ol, .wysiwyg-content ol, .org-html-content ol, trix-editor ol { list-style: decimal; }
.rich-content li, .wysiwyg-content li, .org-html-content li, trix-editor li {
    margin: 0 0 0.35rem;
}

.rich-content blockquote, .wysiwyg-content blockquote, .org-html-content blockquote,
trix-editor blockquote, trix-editor.org-trix-editor blockquote {
    border-left: 3px solid rgba(127, 127, 127, 0.35);
    padding-left: 1rem;
    margin: 0 0 0.85rem;
    color: inherit;
    opacity: 0.85;
}

/* No leading gap before the very first block */
.rich-content > :first-child, .wysiwyg-content > :first-child,
.org-html-content > :first-child, trix-editor > :first-child {
    margin-top: 0;
    padding-top: 0;
}

/* Inline */
.rich-content strong, .wysiwyg-content strong, .org-html-content strong, trix-editor strong { font-weight: 700; }
.rich-content em, .wysiwyg-content em, .org-html-content em, trix-editor em { font-style: italic; }
.rich-content a, .wysiwyg-content a, .org-html-content a, trix-editor a, trix-editor.org-trix-editor a {
    color: #ff006b;
    text-decoration: none;
}
.rich-content a:hover, .wysiwyg-content a:hover, .org-html-content a:hover, trix-editor a:hover {
    text-decoration: underline;
}

/* Media */
.rich-content img, .wysiwyg-content img, .org-html-content img, trix-editor img {
    max-width: 100%;
    height: auto;
    border-radius: 0.5rem;
}

/*
 * Editor override: Trix injects its own stylesheet at runtime that sets its own
 * block margins, and it often loads after this file so it wins on equal
 * specificity. Re-assert the exact same collapse-free spacing with !important so
 * what you type matches what gets published. (Only affects the editable area.)
 */
trix-editor :is(h1, h2, h3, h4) { margin: 0 0 0.5rem !important; padding-top: 0.6rem !important; }
trix-editor p { margin: 0 0 0.85rem !important; }
trix-editor p:empty, trix-editor p:has(> br:only-child) { min-height: 1.5rem !important; }
trix-editor ul, trix-editor ol { margin: 0 0 0.85rem !important; padding-left: 1.5rem !important; }
trix-editor li { margin: 0 0 0.35rem !important; }
trix-editor blockquote { margin: 0 0 0.85rem !important; }
trix-editor > :first-child { margin-top: 0 !important; padding-top: 0 !important; }
