﻿

/* =========================================
   TipTap editor preview styles (Umbraco backoffice)
========================================= */

.tiptap .rte-intro,
.ProseMirror .rte-intro {
    font-size: 1.3em !important;
    line-height: 1.45 !important;
}

.tiptap .rte-text-lg,
.ProseMirror .rte-text-lg {
    font-size: 1.25em !important;
    line-height: 1.4 !important;
}

.tiptap .rte-text-xl,
.ProseMirror .rte-text-xl {
    font-size: 1.5em !important;
    line-height: 1.35 !important;
}

.tiptap .rte-emphasis,
.ProseMirror .rte-emphasis {
    font-weight: 600 !important;
}

/* Display styles */
.tiptap .rte-display-1,
.ProseMirror .rte-display-1 {
    font-size: 2rem !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
}

.tiptap .rte-display-2,
.ProseMirror .rte-display-2 {
    font-size: 1.75rem !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
}

.tiptap .rte-lead,
.ProseMirror .rte-lead {
    font-size: 1.15em !important;
    line-height: 1.5 !important;
}

.tiptap .rte-small,
.ProseMirror .rte-small {
    font-size: 0.95em !important;
    line-height: 1.45 !important;
}

/* Optional editor-only helpers (make it obvious) */
.tiptap .rte-display-1,
.tiptap .rte-display-2,
.tiptap .rte-intro,
.ProseMirror .rte-display-1,
.ProseMirror .rte-display-2,
.ProseMirror .rte-intro {
    background: rgba(0, 0, 0, 0.04) !important;
    padding-left: 0.5rem !important;
    border-left: 3px solid rgba(0, 0, 0, 0.2) !important;
}
/* Editor-only: make emphasis obvious */
.tiptap .rte-emphasis,
.ProseMirror .rte-emphasis {
    font-weight: 600 !important;
    text-decoration: underline dotted rgba(0,0,0,0.25);
    text-underline-offset: 0.18em;
}

/* Editor-only: neutralise text styles inside headings */
.tiptap h1 .rte-intro,
.tiptap h2 .rte-intro,
.tiptap h3 .rte-intro,
.tiptap h4 .rte-intro,
.ProseMirror h1 .rte-intro,
.ProseMirror h2 .rte-intro,
.ProseMirror h3 .rte-intro,
.ProseMirror h4 .rte-intro {
    font-size: inherit !important;
    line-height: inherit !important;
}
