/* ── CMS Block Editor — TipTap ProseMirror surface styles ─────────────── */

/* Editor content area */
.cms-block-editor-content .ProseMirror {
    min-height: 160px;
    padding: 0.875rem 1rem;
    outline: none;
    color: var(--ss-text-primary, #f1f5f9);
    font-family: var(--ss-font-body, 'Outfit', sans-serif);
    font-size: 0.9375rem;
    line-height: 1.7;
    caret-color: var(--ss-accent-500, #00BBFF);
}

/* Block-level elements */
.cms-block-editor-content .ProseMirror h1,
.cms-block-editor-content .ProseMirror h2,
.cms-block-editor-content .ProseMirror h3 {
    font-family: var(--ss-font-display, 'Syne', sans-serif);
    color: var(--ss-text-primary, #f1f5f9);
    margin: 1.25rem 0 0.5rem;
    line-height: 1.3;
}

.cms-block-editor-content .ProseMirror h1 { font-size: 1.75rem; }
.cms-block-editor-content .ProseMirror h2 { font-size: 1.375rem; }
.cms-block-editor-content .ProseMirror h3 { font-size: 1.125rem; }

.cms-block-editor-content .ProseMirror p {
    margin: 0 0 0.75rem;
}

.cms-block-editor-content .ProseMirror p:last-child {
    margin-bottom: 0;
}

.cms-block-editor-content .ProseMirror strong { color: var(--ss-text-primary, #f1f5f9); }
.cms-block-editor-content .ProseMirror em { color: var(--ss-text-secondary, #cbd5e1); }
.cms-block-editor-content .ProseMirror u { text-decoration-color: var(--ss-accent-500, #00BBFF); }
.cms-block-editor-content .ProseMirror s { color: var(--ss-text-muted, #64748b); }

/* Inline code */
.cms-block-editor-content .ProseMirror code {
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 3px;
    padding: 0.1em 0.35em;
    font-family: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', ui-monospace, monospace;
    font-size: 0.85em;
    color: var(--ss-accent-500, #00BBFF);
}

/* Code block */
.cms-block-editor-content .ProseMirror pre,
.cms-block-editor-content .cms-code-block {
    background: rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-left: 3px solid var(--ss-accent-500, #00BBFF);
    border-radius: 6px;
    padding: 1rem 1.125rem;
    margin: 1rem 0;
    overflow-x: auto;
}

.cms-block-editor-content .ProseMirror pre code {
    background: none;
    border: none;
    padding: 0;
    font-size: 0.875rem;
    color: var(--ss-text-secondary, #cbd5e1);
}

/* Blockquote */
.cms-block-editor-content .ProseMirror blockquote {
    border-left: 3px solid var(--ss-accent-500, #00BBFF);
    margin: 1rem 0;
    padding: 0.5rem 1rem;
    color: var(--ss-text-secondary, #cbd5e1);
    background: rgba(0, 187, 255, 0.04);
    border-radius: 0 4px 4px 0;
}

/* Lists */
.cms-block-editor-content .ProseMirror ul,
.cms-block-editor-content .ProseMirror ol {
    padding-left: 1.5rem;
    margin: 0.5rem 0 0.75rem;
}

.cms-block-editor-content .ProseMirror li {
    margin-bottom: 0.25rem;
}

.cms-block-editor-content .ProseMirror ul li::marker {
    color: var(--ss-accent-500, #00BBFF);
}

.cms-block-editor-content .ProseMirror ol li::marker {
    color: var(--ss-text-tertiary, #94a3b8);
}

/* Horizontal rule */
.cms-block-editor-content .ProseMirror hr {
    border: none;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    margin: 1.5rem 0;
}

/* Images */
.cms-block-editor-content .ProseMirror img {
    max-width: 100%;
    height: auto;
    border-radius: 6px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    display: block;
    margin: 0.75rem 0;
}

.cms-block-editor-content .ProseMirror img.ProseMirror-selectednode {
    outline: 2px solid var(--ss-accent-500, #00BBFF);
    outline-offset: 2px;
}

/* Links */
.cms-block-editor-content .ProseMirror a {
    color: var(--ss-accent-500, #00BBFF);
    text-decoration: underline;
    text-underline-offset: 2px;
    cursor: pointer;
}

/* Placeholder */
.cms-block-editor-content .ProseMirror p.is-editor-empty:first-child::before {
    content: attr(data-placeholder);
    color: var(--ss-text-muted, #64748b);
    pointer-events: none;
    float: left;
    height: 0;
}

/* Selection */
.cms-block-editor-content .ProseMirror ::selection {
    background: rgba(0, 187, 255, 0.2);
}
