/*
 * Canonical styles for editor-managed page content.
 * This file is loaded after Jodit/Tailwind and the same .rich-content class is
 * used by both the editor canvas and the public page output.
 */
.rich-content {
    box-sizing: border-box;
    display: flow-root;
    width: 100%;
    padding: 1.25rem 1.4rem;
    color: #3d485b;
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 1rem;
    line-height: 1.7;
    overflow-wrap: anywhere;
}

/* Override Jodit's built-in 8px canvas padding with the canonical content inset. */
[data-page-editor] .jodit-container .jodit-workplace .jodit-wysiwyg.rich-content {
    padding: 1.25rem 1.4rem;
}

.rich-content *,
.rich-content *::before,
.rich-content *::after {
    box-sizing: border-box;
}

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

.rich-content :where(p, ul, ol, blockquote, pre, table, figure) {
    margin-top: 0;
    margin-bottom: 1.25em;
}

.rich-content :where(h1, h2, h3, h4, h5, h6) {
    margin-top: 1.45em;
    margin-bottom: .55em;
    color: #141a28;
    font-family: "Plus Jakarta Sans", Inter, system-ui, sans-serif;
    font-weight: 700;
    line-height: 1.25;
}

.rich-content h1 { font-size: 2.1em; }
.rich-content h2 { font-size: 1.7em; }
.rich-content h3 { font-size: 1.35em; }
.rich-content h4 { font-size: 1.12em; }
.rich-content :where(h5, h6) { font-size: 1em; }

.rich-content :where(strong, b) { color: #253044; font-weight: 700; }
.rich-content :where(em, i) { font-style: italic; }
.rich-content a {
    color: var(--brand-gold-text, #d49520);
    text-decoration: underline;
    text-underline-offset: 3px;
}
.rich-content a:hover { color: var(--brand-gold-text, #d49520); }

.rich-content :where(ul, ol) { padding-left: 1.55em; }
.rich-content ul { list-style: disc; }
.rich-content ol { list-style: decimal; }
.rich-content li { margin: .3em 0; padding-left: .15em; }
.rich-content li > :where(ul, ol) { margin-top: .35em; margin-bottom: .35em; }

.rich-content blockquote {
    padding-left: 1em;
    border-left: 3px solid #d49520;
    color: #566377;
    font-style: italic;
}

.rich-content hr {
    height: 0;
    margin: 2em 0;
    border: 0;
    border-top: 1px solid #d7dee8;
}

.rich-content :where(img, video, iframe) { max-width: 100%; }
.rich-content img {
    height: auto;
    border-radius: 0;
    box-shadow: none;
}
.rich-content video { height: auto; }
.rich-content iframe { border: 0; }

.rich-content .content-image-left { float: left; }
.rich-content .content-image-right { float: right; }
.rich-content .content-image-center {
    display: block;
    margin-right: auto;
    margin-left: auto;
}
.rich-content .content-image-full {
    display: block;
    width: 100%;
    height: auto;
}

.rich-content figure { max-width: 100%; }
.rich-content figcaption {
    margin-top: .4em;
    color: #64748b;
    font-size: .82em;
    line-height: 1.45;
}

.rich-content table {
    display: table;
    width: 100%;
    max-width: 100%;
    border-collapse: collapse;
}
.rich-content tr > :is(th, td) {
    padding: .7rem .8rem;
    border: 1px solid #d7dee8;
    text-align: left;
    vertical-align: top;
}
.rich-content th { background: #f5f7fa; color: #14213d; font-weight: 700; }
.rich-content tr:nth-child(even) td { background: #fbfcfd; }

.rich-content :where(pre, .ql-syntax) {
    overflow-x: auto;
    padding: 1rem 1.15rem;
    border-radius: .5rem;
    background: #f6f8fa;
    color: #24292f;
    font: 14px/1.55 ui-monospace, SFMono-Regular, Menlo, monospace;
}
.rich-content :not(pre) > code {
    padding: .1em .3em;
    border-radius: .25rem;
    background: #f1f5f9;
    color: #253044;
    font: .9em/1.4 ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* Compatibility for content created by the previous Quill editor. */
.rich-content [class^="ql-image-align-"] { display: contents; }
.rich-content .ql-iframe-align-left { float: left; margin: .5rem 1.5rem 1rem 0; }
.rich-content .ql-iframe-align-center { margin: 1.25rem auto; }
.rich-content .ql-iframe-align-right { float: right; margin: .5rem 0 1rem 1.5rem; }
.rich-content [class^="ql-image-align-"][data-title]::after {
    content: attr(data-title);
    width: 100%;
    padding: .4rem .2rem 0;
    color: #64748b;
    font-size: .86rem;
    line-height: 1.35;
}
.rich-content .ql-image-align-center[data-title]::after { text-align: center; }
.rich-content .ql-image-align-right[data-title]::after { text-align: right; }
.rich-content .ql-align-center { text-align: center; }
.rich-content .ql-align-right { text-align: right; }
.rich-content .ql-align-justify { text-align: justify; }
.rich-content .ql-direction-rtl { direction: rtl; text-align: inherit; }
.rich-content .ql-indent-1 { padding-left: 3em; }
.rich-content .ql-indent-2 { padding-left: 6em; }
.rich-content .ql-indent-3 { padding-left: 9em; }
.rich-content .ql-indent-4 { padding-left: 12em; }
.rich-content .ql-indent-5 { padding-left: 15em; }
.rich-content .ql-indent-6 { padding-left: 18em; }
.rich-content .ql-indent-7 { padding-left: 21em; }
.rich-content .ql-indent-8 { padding-left: 24em; }
.rich-content .ql-font-inter { font-family: Inter, system-ui, sans-serif; }
.rich-content .ql-font-jakarta { font-family: "Plus Jakarta Sans", Inter, sans-serif; }
.rich-content .ql-font-serif { font-family: Georgia, "Times New Roman", serif; }
.rich-content .ql-font-monospace { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.rich-content .ql-size-small { font-size: .8em; }
.rich-content .ql-size-large { font-size: 1.5em; }
.rich-content .ql-size-huge { font-size: 2.5em; }
.rich-content ol[data-list="checked"] > li,
.rich-content ol[data-list="unchecked"] > li { list-style: none; }
.rich-content ol[data-list="checked"] > li::before { content: "✓ "; color: #d49520; font-weight: 800; }
.rich-content ol[data-list="unchecked"] > li::before { content: "□ "; color: #64748b; }

@media (max-width: 640px) {
    .rich-content {
        padding: 1rem;
        font-size: 1rem;
    }
    [data-page-editor] .jodit-container .jodit-workplace .jodit-wysiwyg.rich-content { padding: 1rem; }

    .rich-content :where(
        img[style*="float: left"], img[style*="float:left"],
        img[style*="float: right"], img[style*="float:right"],
        .content-image-left, .content-image-right
    ) {
        float: none !important;
        display: block;
        margin-right: 0 !important;
        margin-left: 0 !important;
    }

    .rich-content :where(.ql-iframe-align-left, .ql-iframe-align-right) {
        float: none;
        margin: 1rem auto;
    }
    .rich-content :where(.ql-indent-3, .ql-indent-4, .ql-indent-5, .ql-indent-6, .ql-indent-7, .ql-indent-8) {
        padding-left: 3em;
    }

    .rich-content table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}