/* Einheitliche Typografie fuer Rich-Text-Inhalte (Blog, Wiki) in allen Identities - gilt fuer die Darstellung
   (.prose-blog) UND fuer den TinyMCE-Editor (.mce-content-body): Blocksatz, Zeilenabstand 1,25, Ueberschriften h1-h6.
   Farben/Schrift kommen aus den Design-Tokens der Identity (--brand-*). Im Editor-iframe setzt
   static/js/tinymce_theme.js diese Variablen aus der Seite; die Fallbacks greifen nur, wenn sie fehlen. */
:is(.prose-blog, .mce-content-body) {
  --pr-text: var(--brand-text, #1d1d1b);
  --pr-muted: var(--brand-text-muted, #737373);
  --pr-accent: var(--brand-600, #1d4ed8);
  --pr-line: var(--brand-border, #e5e5e5);
  --pr-head-font: var(--font-serif, ui-serif, Georgia, Cambria, 'Times New Roman', serif);
  line-height: 1.25;
}
:is(.prose-blog, .mce-content-body) :is(p, li) {
  line-height: 1.25; text-align: justify; hyphens: auto; -webkit-hyphens: auto; overflow-wrap: break-word;
}
:is(.prose-blog, .mce-content-body) p { margin: 0 0 1.5em; }
:is(.prose-blog, .mce-content-body) :is(ul, ol) { margin: 0 0 1.5em; padding-left: 1.5em; }
:is(.prose-blog, .mce-content-body) ul { list-style: disc; }
:is(.prose-blog, .mce-content-body) ol { list-style: decimal; }
:is(.prose-blog, .mce-content-body) li { margin: 0 0 .5em; }

/* Ueberschriften: Tailwind-Preflight setzt h1-h6 zurueck, deshalb hier vollstaendig definiert */
:is(.prose-blog, .mce-content-body) :is(h1, h2, h3, h4, h5, h6) {
  font-family: var(--pr-head-font); color: var(--pr-text); font-weight: 700;
  line-height: 1.2; text-align: left; hyphens: none; -webkit-hyphens: none; letter-spacing: -.01em;
  margin: 1.5em 0 .5em;
}
:is(.prose-blog, .mce-content-body) h1 { font-size: 2.1em; font-weight: 800; color: var(--pr-accent); margin-top: 1.2em; padding-bottom: .25em; border-bottom: 3px solid var(--pr-accent); }
:is(.prose-blog, .mce-content-body) h2 { font-size: 1.6em; padding-bottom: .2em; color: var(--pr-accent); border-bottom: 1px solid color-mix(in srgb, var(--pr-accent) 35%, transparent); }
:is(.prose-blog, .mce-content-body) h3 { font-size: 1.3em; color: var(--pr-accent); }
:is(.prose-blog, .mce-content-body) h4 { font-size: 1.1em; }
:is(.prose-blog, .mce-content-body) h5 { font-family: inherit; font-size: .95em; text-transform: uppercase; letter-spacing: .06em; color: var(--pr-muted); }
:is(.prose-blog, .mce-content-body) h6 { font-family: inherit; font-size: .85em; text-transform: uppercase; letter-spacing: .08em; color: var(--pr-muted); font-weight: 600; }
:is(.prose-blog, .mce-content-body) :is(h1, h2, h3, h4, h5, h6):first-child { margin-top: 0; }

:is(.prose-blog, .mce-content-body) blockquote { margin: 1.2em 0; padding-left: 1em; border-left: 4px solid var(--pr-accent); color: var(--pr-muted); }
:is(.prose-blog, .mce-content-body) a { color: var(--pr-accent); }
:is(.prose-blog, .mce-content-body) img { max-width: 100%; height: auto; border-radius: 10px; margin: .8em auto; }
:is(.prose-blog, .mce-content-body) :is(pre, code) { text-align: left; hyphens: none; }
:is(.prose-blog, .mce-content-body) table { border-collapse: collapse; margin: 1em 0; max-width: 100%; }
:is(.prose-blog, .mce-content-body) :is(td, th) { border: 1px solid var(--pr-line); padding: 6px 10px; text-align: left; }

/* Einleitung ueber dem Beitrag (Blog): gleiche Typografie wie der Inhalt, abgesetzt mit Akzentbalken */
.blog-intro-box {
  margin: 0 0 1.6em; padding: .9em 1.2em; border-left: 4px solid var(--brand-600, #1d4ed8);
  background: var(--brand-50, rgba(0,0,0,.03)); border-radius: 0 10px 10px 0; color: var(--brand-text);
  font-size: 1.05em; line-height: 1.25; text-align: justify; hyphens: auto; -webkit-hyphens: auto;
}
.blog-intro-box :is(p, li) { line-height: 1.25; text-align: justify; hyphens: auto; -webkit-hyphens: auto; margin: 0 0 .6em; }
.blog-intro-box > :last-child { margin-bottom: 0; }

/* Zitat: grosse Anfuehrungszeichen, Serifenschrift, ohne Hintergrund */
:is(.prose-blog, .mce-content-body) blockquote.pr-quote {
  position: relative; margin: 2em 0; padding: .2em 1em .2em 3.2em; border: 0; color: var(--pr-text);
  font-family: var(--pr-head-font); font-style: italic; font-size: 1.15em; line-height: 1.4;
}
:is(.prose-blog, .mce-content-body) blockquote.pr-quote::before {
  content: "\201C"; position: absolute; left: 0; top: -.15em; font-size: 4.2em; line-height: 1; font-style: normal;
  font-family: Georgia, serif; color: var(--pr-accent); opacity: .85;
}
:is(.prose-blog, .mce-content-body) blockquote.pr-quote p { text-align: left; margin: 0 0 .6em; }

/* Fazit: Hinweis-Karte mit Akzentstreifen oben und Etikett "Fazit" */
:is(.prose-blog, .mce-content-body) div.pr-fazit {
  position: relative; margin: 2.4em 0 1.6em; padding: 1.7em 1.4em .4em; border-radius: 14px;
  background: var(--brand-50, rgba(0,0,0,.04)); border: 1px solid var(--pr-line); border-top: 4px solid var(--pr-accent);
}
:is(.prose-blog, .mce-content-body) div.pr-fazit::before {
  content: "Fazit"; position: absolute; top: -.85em; left: 1.2em; padding: .15em .9em; border-radius: 999px;
  background: var(--pr-accent); color: #fff; font: 700 .72em/1.6 inherit; font-family: inherit;
  letter-spacing: .1em; text-transform: uppercase;
}
:is(.prose-blog, .mce-content-body) div.pr-fazit > :last-child { margin-bottom: 1.1em; }

/* Codebloecke (Seite + Editor): dunkle Karte, Monospace, Prism-Farben; Zeilennummern/Kopieren macht static/js/code_blocks.js */
:is(.prose-blog, .mce-content-body) pre {
  margin: 1.6em 0; padding: 1em 1.2em; border-radius: 12px; background: #1e1f26; color: #e6e6ea; overflow: auto;
  font: 400 .88em/1.55 'JetBrains Mono', 'Roboto Mono', ui-monospace, Menlo, Consolas, monospace; text-align: left; tab-size: 4;
  white-space: pre; hyphens: none; -webkit-hyphens: none;
}
:is(.prose-blog, .mce-content-body) pre code { font: inherit; background: none; color: inherit; padding: 0; text-align: left; }
.mce-content-body pre.line-numbers::before { content: "1 2 3 \2026  Zeilennummern"; display: block; margin-bottom: .6em; font: 600 .75em/1 sans-serif; letter-spacing: .06em; color: #8b8d98; }
.pr-code { position: relative; margin: 1.6em 0; border-radius: 12px; background: #1e1f26; overflow: hidden; }
.pr-code-head { display: flex; align-items: center; justify-content: space-between; padding: .45em .8em; background: #2a2b34; color: #a9abb8; font: 600 .72rem/1 ui-sans-serif, system-ui, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.pr-code-copy { border: 0; cursor: pointer; border-radius: 8px; padding: .45em .85em; font: 600 .72rem/1 ui-sans-serif, system-ui, sans-serif; background: #3a3b47; color: #fff; }
.pr-code-copy:hover { background: var(--brand-600, #1d4ed8); }
.pr-code-body { display: flex; }
.pr-code .pr-ln { flex: none; padding: 1em .8em 1em 1em; text-align: right; color: #6b6d7a; user-select: none; border-right: 1px solid #34353f; white-space: pre; font: 400 .88em/1.55 'JetBrains Mono', 'Roboto Mono', ui-monospace, Menlo, Consolas, monospace; }
.pr-code pre { flex: 1; min-width: 0; margin: 0; border-radius: 0; }
.pr-code pre code { display: block; }
.token.comment, .token.prolog, .token.doctype, .token.cdata { color: #7f8394; font-style: italic; }
.token.punctuation { color: #b8bacb; }
.token.property, .token.tag, .token.constant, .token.symbol, .token.deleted, .token.boolean, .token.number { color: #ff8f8f; }
.token.selector, .token.attr-name, .token.string, .token.char, .token.builtin, .token.inserted { color: #9ee493; }
.token.operator, .token.entity, .token.url, .token.variable { color: #e6c07b; }
.token.atrule, .token.attr-value, .token.keyword { color: #7fb4ff; }
.token.function, .token.class-name { color: #d6a5ff; }
.token.regex, .token.important { color: #f5b97b; }

/* Aufzaehlungsstile (9) und Nummerierungsstile (9): Marker in der Akzentfarbe */
:is(.prose-blog, .mce-content-body) :is(ul, ol) > li::marker { color: var(--pr-accent); font-weight: 700; }
:is(.prose-blog, .mce-content-body) ul { padding-left: 1.7em; }
:is(.prose-blog, .mce-content-body) ol { padding-left: 2.4em; }
:is(.prose-blog, .mce-content-body) ul.pr-ul-circle { list-style-type: circle; }
:is(.prose-blog, .mce-content-body) ul.pr-ul-square { list-style-type: square; }
:is(.prose-blog, .mce-content-body) ul.pr-ul-arrow > li::marker { content: "\27A4  "; }
:is(.prose-blog, .mce-content-body) ul.pr-ul-check > li::marker { content: "\2713  "; }
:is(.prose-blog, .mce-content-body) ul.pr-ul-dash > li::marker { content: "\2013  "; }
:is(.prose-blog, .mce-content-body) ul.pr-ul-diamond > li::marker { content: "\25C6  "; }
:is(.prose-blog, .mce-content-body) ul.pr-ul-star > li::marker { content: "\2605  "; }
:is(.prose-blog, .mce-content-body) ul.pr-ul-double > li::marker { content: "\00BB  "; }
:is(.prose-blog, .mce-content-body) ol.pr-ol-paren > li::marker { content: counter(list-item) ")  "; }
:is(.prose-blog, .mce-content-body) ol.pr-ol-parens > li::marker { content: "(" counter(list-item) ")  "; }
:is(.prose-blog, .mce-content-body) ol.pr-ol-lower-alpha { list-style-type: lower-alpha; }
:is(.prose-blog, .mce-content-body) ol.pr-ol-upper-alpha { list-style-type: upper-alpha; }
:is(.prose-blog, .mce-content-body) ol.pr-ol-lower-roman { list-style-type: lower-roman; }
:is(.prose-blog, .mce-content-body) ol.pr-ol-upper-roman { list-style-type: upper-roman; }
:is(.prose-blog, .mce-content-body) ol.pr-ol-zero { list-style-type: decimal-leading-zero; }
:is(.prose-blog, .mce-content-body) ol.pr-ol-greek { list-style-type: lower-greek; }

/* Tabellenstile 1-9 (Klasse pr-tbl-N auf der Tabelle), Farben aus dem Design der Identity */
:is(.prose-blog, .mce-content-body) table[class*="pr-tbl-"] { width: 100%; border-collapse: collapse !important; border: 0; font-size: .95em; }
:is(.prose-blog, .mce-content-body) table[class*="pr-tbl-"] :is(td, th) { padding: .55em .8em; border: 0; vertical-align: top; }
:is(.prose-blog, .mce-content-body) table[class*="pr-tbl-"] th { font-weight: 700; text-align: left; }
:is(.prose-blog, .mce-content-body) table.pr-tbl-1 :is(td, th) { border: 1px solid var(--pr-line); }
:is(.prose-blog, .mce-content-body) table.pr-tbl-1 th { background: var(--brand-50, rgba(0,0,0,.05)); }
:is(.prose-blog, .mce-content-body) table.pr-tbl-2 tr:nth-child(even) > td { background: var(--brand-50, rgba(0,0,0,.04)); }
:is(.prose-blog, .mce-content-body) table.pr-tbl-2 th { border-bottom: 2px solid var(--pr-accent); }
:is(.prose-blog, .mce-content-body) table.pr-tbl-3 th { background: var(--pr-accent); color: #fff; }
:is(.prose-blog, .mce-content-body) table.pr-tbl-3 td { border-bottom: 1px solid var(--pr-line); }
:is(.prose-blog, .mce-content-body) table.pr-tbl-4 th { background: var(--pr-accent); color: #fff; }
:is(.prose-blog, .mce-content-body) table.pr-tbl-4 tr:nth-child(even) > td { background: var(--brand-50, rgba(0,0,0,.04)); }
:is(.prose-blog, .mce-content-body) table.pr-tbl-5 :is(td, th) { border-bottom: 1px solid var(--pr-line); }
:is(.prose-blog, .mce-content-body) table.pr-tbl-5 th { border-bottom: 2px solid var(--pr-text); }
:is(.prose-blog, .mce-content-body) table.pr-tbl-6 th { color: var(--pr-muted); font-size: .8em; text-transform: uppercase; letter-spacing: .08em; }
:is(.prose-blog, .mce-content-body) table.pr-tbl-7 { border-collapse: separate !important; border-spacing: 0; border: 1px solid var(--pr-line); border-radius: 14px; overflow: hidden; box-shadow: 0 6px 20px rgba(0,0,0,.08); }
:is(.prose-blog, .mce-content-body) table.pr-tbl-7 th { background: var(--brand-50, rgba(0,0,0,.05)); border-bottom: 1px solid var(--pr-line); }
:is(.prose-blog, .mce-content-body) table.pr-tbl-7 td { border-bottom: 1px solid var(--pr-line); }
:is(.prose-blog, .mce-content-body) table.pr-tbl-7 tr:last-child > td { border-bottom: 0; }
:is(.prose-blog, .mce-content-body) table.pr-tbl-8 td:first-child, :is(.prose-blog, .mce-content-body) table.pr-tbl-8 th:first-child { background: var(--brand-50, rgba(0,0,0,.05)); font-weight: 700; border-right: 3px solid var(--pr-accent); }
:is(.prose-blog, .mce-content-body) table.pr-tbl-8 td { border-bottom: 1px solid var(--pr-line); }
:is(.prose-blog, .mce-content-body) table.pr-tbl-9 th { background: #1e1f26; color: #fff; }
:is(.prose-blog, .mce-content-body) table.pr-tbl-9 td { border-bottom: 1px solid var(--pr-line); }
:is(.prose-blog, .mce-content-body) table.pr-tbl-9 tr:nth-child(even) > td { background: rgba(127,127,127,.12); }
