﻿/**
 * ClubPress — dsb-single.css
 * Single post / page layout styles.
 * Loaded conditionally: is_singular()
 */
/* ================================================================
   X-85: Single-Post Layout — Richtung C
   Warme Hintergrundfarbe, prominentes Bild, 4-Ebenen-Tags,
   Card-Navigation, überarbeitete Related-Cards.
   ================================================================ */

/* Warmer Seitenhintergrund auf Einzelbeitragsseiten */
body.single-post,
body.single {
    background-color: var(--sk-surface-warm) !important;
}

/* --- Hauptbild -------------------------------------------------- */
.sk-article-image {
    margin-bottom: 0 !important;
}
.sk-article-image img,
.sk-article-image .wp-block-post-featured-image img {
    width: 100%;
    height: auto;                   /* natürliches Bildformat — kein Beschnitt */
    aspect-ratio: unset !important; /* WP-Block setzt 16/7 inline → überschreiben */
    object-fit: unset !important;   /* WP-Block setzt cover inline → überschreiben */
    border-radius: 10px !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.13);
    display: block;
}

/* --- Kontextsensitiver Zurück-Button (JS eingefügt vor Hero-Bild) --- */
.sk-back-link {
    display: inline-flex;
    align-items: center;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--wp--preset--color--primary, #1a4a1a) !important;
    text-decoration: none !important;
    opacity: 0.72;
    margin-bottom: 0.6rem;
    transition: opacity 0.15s;
    line-height: 1;
}
.sk-back-link:hover { opacity: 1; }

/* --- Titel ------------------------------------------------------ */
.single .wp-block-post-title {
    font-weight: 800 !important;
    letter-spacing: -0.3px;
}

/* Beitragsart-Icon vor dem Einzelbeitragstitel */
.single .wp-block-post-title .sk-post-title-icon,
.single .wp-block-post-title .dashicons {
    display: inline-block;
    font-size: 0.9em !important;
    width: 0.9em !important;
    height: 0.9em !important;
    vertical-align: middle;
    margin-right: 0.2em;
    flex-shrink: 0;
    line-height: 1;
}

/* --- 4-Ebenen Tag-Zeile ----------------------------------------- */
.sk-tag-row {
    display: flex !important;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

/* Block-Container transparent im Flex-Flow */
.sk-tag-row .sk-tag-block {
    display: contents;
}

/* Gemeinsame Pill-Basis (WP rendert <a> ohne eigene Klasse) */
.sk-tag-row a,
.sk-tag-row .wp-block-post-terms__link {
    display: inline-block;
    font-size: 10px !important;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    padding: 3px 10px;
    border-radius: 3px;
    text-decoration: none !important;
    line-height: 1.6;
    transition: opacity 0.15s, background-color 0.15s, color 0.15s;
}

/* L1: sk_content_type — gold Hintergrund, dunkelgrün Text (klar unterscheidbar von L2) */
.sk-tag-l1 a,
.sk-tag-l1 .wp-block-post-terms__link {
    background-color: var(--wp--preset--color--gold) !important;
    color: var(--wp--preset--color--primary-dark) !important;
    border: 1.5px solid var(--wp--preset--color--gold);
}
.sk-tag-l1 a:hover,
.sk-tag-l1 .wp-block-post-terms__link:hover { opacity: 0.82; }

/* L2: WP category — dunkelgrün, weiß */
.sk-tag-l2 a,
.sk-tag-l2 .wp-block-post-terms__link {
    background-color: var(--wp--preset--color--primary-dark) !important;
    color: var(--wp--preset--color--surface) !important;
    border: 1.5px solid var(--wp--preset--color--primary-dark);
}
.sk-tag-l2 a:hover,
.sk-tag-l2 .wp-block-post-terms__link:hover { opacity: 0.82; }

/* L3: sk_disziplin — Rahmen grün, Füllung transparent */
.sk-tag-l3 a,
.sk-tag-l3 .wp-block-post-terms__link {
    background-color: transparent !important;
    color: var(--wp--preset--color--primary-dark) !important;
    border: 1.5px solid var(--wp--preset--color--primary-dark);
}
.sk-tag-l3 a:hover,
.sk-tag-l3 .wp-block-post-terms__link:hover {
    background-color: var(--wp--preset--color--primary-dark) !important;
    color: var(--wp--preset--color--surface) !important;
}

/* L4: sk_disziplin_kategorie — sehr subtil, grau */
/* X-93: tokenisiert auf --sk-text-meta (#666, WCAG AA ≥5:1 auf weiß) */
.sk-tag-l4 a,
.sk-tag-l4 .wp-block-post-terms__link {
    background-color: transparent !important;
    color: var(--sk-text-meta) !important;
    border: 1.5px solid var(--sk-border-light);
}
.sk-tag-l4 a:hover,
.sk-tag-l4 .wp-block-post-terms__link:hover {
    border-color: var(--sk-text-muted);
    color: var(--sk-text-strong) !important;
}

/* Separator zwischen mehreren Terms verstecken */
.sk-tag-row .wp-block-post-terms__separator {
    display: none;
}

/* Pill-Basis für L-Tags außerhalb .sk-tag-row (Search, Aktuelles, Related Cards, etc.)
 * Innerhalb .sk-tag-row gibt .sk-tag-row a dieselben Werte — keine Kollision. */
.sk-tag-l1 a, .sk-tag-l2 a, .sk-tag-l3 a, .sk-tag-l4 a,
.sk-tag-l1 .wp-block-post-terms__link,
.sk-tag-l2 .wp-block-post-terms__link,
.sk-tag-l3 .wp-block-post-terms__link,
.sk-tag-l4 .wp-block-post-terms__link {
    display: inline-block;
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 4px;
    text-decoration: none !important;
    white-space: nowrap;
    transition: opacity .15s;
}

/* sk-disziplin-badge: Kategorie-Pille im Aktuelles-Plugin (L2 Dunkelgrün) */
.sk-disziplin-badge {
    display: inline-block;
    background-color: var(--wp--preset--color--primary-dark);
    color: var(--wp--preset--color--surface) !important;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 4px;
    text-decoration: none;
    white-space: nowrap;
}

/* --- Post-Navigation — Card Style ------------------------------ */
.sk-post-nav {
    border-top: 1px solid var(--sk-border-warm);
}

/* Card-Styling auf den Block-Container (label + link liegen beide drin) */
.sk-post-nav .wp-block-post-navigation-link {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 14px 16px;
    background: var(--wp--preset--color--surface);
    border-radius: 8px;
    border: 1.5px solid var(--sk-border-warm);
    box-shadow: 0 1px 4px rgba(0,0,0,0.05);
    transition: border-color 0.15s, box-shadow 0.15s;
    min-width: 160px;
    max-width: 48%;
    text-decoration: none;
}
.sk-post-nav .wp-block-post-navigation-link:hover {
    border-color: var(--wp--preset--color--primary-dark);
    box-shadow: 0 2px 10px rgba(var(--sk-primary-dark-rgb),0.10);
}

/* Label (← Vorheriger / Nächster →) */
.sk-post-nav .post-navigation-link__label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--sk-text-muted);
}

/* Altes Alias für WP-Versionen die __label noch mit wp-block-prefix rendern */
.sk-post-nav .wp-block-post-navigation-link__label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--sk-text-muted);
}

/* Post-Titel-Link in Navigation (kein eigenes Card-Styling mehr) */
.sk-post-nav .wp-block-post-navigation-link a {
    display: block !important;
    text-decoration: none !important;
    font-size: 13px !important;
    font-weight: 700;
    color: var(--wp--preset--color--body-text);
    line-height: 1.3;
    /* Card-Werte zurücksetzen die ggf. aus alten Regeln durchschlagen */
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    min-width: unset !important;
    max-width: unset !important;
}
.sk-post-nav .wp-block-post-navigation-link a:hover {
    color: var(--wp--preset--color--primary, #1a4a1a);
}

/* "Nächster →" — rechtsbündig (Text + Margin) */
.sk-post-nav .post-navigation-link-next {
    text-align: right;
    margin-left: auto;
}

/* --- Ähnliche Beiträge — Heading ------------------------------- */
.sk-related-heading {
    border-bottom: 2px solid var(--wp--preset--color--primary, #1a4a1a) !important;
    padding-bottom: 0.6rem !important;
}

/* --- Related Posts: 3-Spalten-Grid erzwingen ------------------- */
.sk-related-posts .wp-block-post-template {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 16px !important;
    list-style: none !important;
}

/* --- Related Cards — Card-Style mit Hover-Lift ----------------- */
.sk-related-card {
    background: var(--wp--preset--color--surface) !important;
    border-radius: 10px !important;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,0.07);
    border: 1px solid rgba(0,0,0,0.05) !important;
    transition: transform 0.15s, box-shadow 0.15s;
    display: flex !important;
    flex-direction: column;
}
.sk-related-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.12);
}

/* Bild-Bereich: Placeholder wenn kein Beitragsbild.
   Fix X-85: sk-redaktion erzeugt <a (post-link)><a (lightbox)><img> (nested).
   Browser trennt die Anker: Post-Link-Anker (leer) und Lightbox-Anker (mit Bild)
   werden Geschwister. Lösung: Post-Link-Anker = absolutes Overlay, Lightbox-Anker
   bleibt im normalen Flow → figure-Höhe ergibt sich aus dem natürlichen Bildformat. */
.sk-related-card .wp-block-post-featured-image {
    position: relative !important;
    margin: 0 !important;
    border-radius: 0 !important;
    background: linear-gradient(135deg, var(--wp--preset--color--primary-dark) 0%, var(--wp--preset--color--primary) 100%);
    aspect-ratio: unset !important; /* WP-Block setzt 3/2 inline → überschreiben */
    overflow: hidden;
}
/* Lightbox-Anker (zweiter im DOM, enthält Bild): im normalen Flow,
   damit die figure ihre Höhe aus dem natürlichen Bildformat bezieht. */
.sk-related-card .wp-block-post-featured-image > a {
    display: block !important;
    position: static !important;
    inset: unset !important;
    height: auto !important;
}
/* Post-Link-Anker (leer, erster im DOM): absolutes Klick-Overlay über dem Bild
   :not(:has(img)) → Video-Posts haben das <img> direkt im Link; dort NICHT anwenden */
.sk-related-card .wp-block-post-featured-image > a:first-child:not(:has(img)) {
    position: absolute !important;
    inset: 0 !important;
    z-index: 2;
}
/* Bild in natürlicher Größe — kein Beschnitt */
.sk-related-card .wp-block-post-featured-image img {
    display: block !important;
    width: 100% !important;
    height: auto !important;       /* natürliche Höhe — kein Crop */
    object-fit: unset !important;  /* WP-Block setzt cover inline → zurücksetzen */
    position: static !important;
    inset: unset !important;
    border-radius: 0 !important;
}

/* --- Related Card Tags: Farbkodierung + Kommas weg ------------- */
.sk-related-card .wp-block-post-terms {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-bottom: 4px !important;
}
.sk-related-card .wp-block-post-terms__separator {
    display: none;
}
.sk-related-card .wp-block-post-terms a {
    display: inline-block !important;
    font-size: 9px !important;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 2px 7px;
    border-radius: 3px;
    text-decoration: none !important;
    line-height: 1.5;
}
/* L1 (sk_content_type) in Related Cards: gold
   Höhere Spezifität (0,4,1) nötig um alte single-post Regel zu schlagen */
.single-post .dsb-content-area .sk-related-card .sk-tag-l1 a {
    background-color: var(--wp--preset--color--gold) !important;
    color: var(--wp--preset--color--primary-dark) !important;
    border: 1px solid var(--wp--preset--color--gold);
}
/* L2 (category) in Related Cards: dunkelgrün */
.single-post .dsb-content-area .sk-related-card .sk-tag-l2 a {
    background-color: var(--wp--preset--color--primary-dark) !important;
    color: var(--wp--preset--color--surface) !important;
    border: 1px solid var(--wp--preset--color--primary-dark);
}

/* sk-search-thumb → in dsb-archive.css verschoben (is_search lädt archive, nicht single) */

/* --- Inline-Taxonomie-Klassen (injiziert via sksb-post-taxonomy-tags) ----------
 * Kommen NACH .sk-tag-l2 a — gleiche Spezifizität (0,1,1), spätere Regel gewinnt.
 * Überschreiben den L2-Dunkelgrün-Hintergrund mit dem korrekten L-Typ-Farbe. */

/* L1: sk_content_type — gold, dunkelgrüner Text */
a.sk-tag-inline-l1 {
    background-color: var(--wp--preset--color--gold) !important;
    color: var(--wp--preset--color--primary-dark) !important;
    border: 1.5px solid var(--wp--preset--color--gold) !important;
}
a.sk-tag-inline-l1:hover { opacity: 0.82; }

/* L3: sk_disziplin Cluster — Rahmen grün, transparent */
a.sk-tag-inline-l3 {
    background-color: transparent !important;
    color: var(--wp--preset--color--primary-dark) !important;
    border: 1.5px solid var(--wp--preset--color--primary-dark) !important;
}
a.sk-tag-inline-l3:hover {
    background-color: var(--wp--preset--color--primary-dark) !important;
    color: var(--wp--preset--color--surface) !important;
}

/* L4: sk_disziplin DSB-Nummern — sehr subtil, grau */
/* X-93: tokenisiert auf --sk-text-meta (#666, WCAG AA ≥5:1 auf weiß) */
a.sk-tag-inline-l4 {
    background-color: transparent !important;
    color: var(--sk-text-meta) !important;
    border: 1.5px solid var(--sk-border-light) !important;
}
a.sk-tag-inline-l4:hover {
    border-color: var(--sk-text-muted);
    color: var(--sk-text-strong) !important;
}

/* Mobile: Navigation untereinander */
@media (max-width: 599px) {
    .sk-post-nav {
        flex-direction: column !important;
    }
    .sk-post-nav .wp-block-post-navigation-link a {
        max-width: 100%;
        min-width: 0;
    }
    .related-grid,
    .sk-related-posts .wp-block-post-template {
        grid-template-columns: 1fr 1fr !important;
    }
}

/* -----------------------------------------------------------------------
   Kreisportal: Login-Ansicht (nicht eingeloggte Nutzer)
   Ziel: kompaktes, dezentes Formular statt doppelter Karten-Optik
   Rollback: diesen Block entfernen
   ----------------------------------------------------------------------- */
.skp-portal:has(> .skp-login-box) {
    max-width: 380px;
    padding: 1.5rem;
    box-shadow: none;
    border-color: var(--wp--preset--color--border, #e2e8f0);
    margin-left: auto;
    margin-right: auto;
}
/* Innere Login-Box im Gast-Kontext: kein eigenes Card-Styling (äußeres reicht) */
.skp-portal > .skp-login-box {
    max-width: 100%;
    background: transparent;
    border: none;
    padding: 0;
}
.skp-portal > .skp-login-box h3 {
    font-size: 0.95rem;
    font-weight: 700;
    margin-bottom: 0.35rem;
}
.skp-portal > .skp-login-box > p {
    font-size: 0.8rem;
    color: var(--wp--preset--color--text-light, #64748b);
    margin-bottom: 1rem;
}
/* Eingabefelder und Button leicht verkleinern */
.skp-portal > .skp-login-box input[type="text"],
.skp-portal > .skp-login-box input[type="password"] {
    padding: 0.35rem 0.6rem;
    font-size: 0.875rem;
}
.skp-portal > .skp-login-box input[type="submit"] {
    padding: 0.4rem 1rem;
    font-size: 0.875rem;
}

/* ================================================================
   16. RELATION BOX — verknüpfter Termin (X-85)
   Extrahiert aus dsb-theme.css v2.1.132 — lädt nur via is_singular()
   ================================================================ */

.sk-relation-box {
    border-left: 4px solid var(--wp--preset--color--primary-dark);
    border-radius: 0 8px 8px 0;
    background: var(--wp--preset--color--primary-tint);
    padding: 1rem 1.25rem;
    margin: 1.5rem 0;
}
.sk-relation-label {
    display: block;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    /* X-98 Fix: primary-dark (#1a4a1a) auf primary-tint (#f0f7ee) ≈ 7:1 — WCAG AA PASS. */
    color: var(--wp--preset--color--primary-dark);
    margin-bottom: 0.4rem;
}
.sk-relation-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--wp--preset--color--body-text);
    margin: 0 0 0.75rem;
    line-height: 1.4;
}
.sk-relation-buttons {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}
.sk-relation-btn {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
    padding: 5px 14px;
    border-radius: 4px;
    transition: opacity 0.15s;
}
.sk-relation-btn-primary {
    background: var(--wp--preset--color--primary-dark);
    color: var(--wp--preset--color--surface) !important;
}
.sk-relation-btn-secondary {
    background: transparent;
    color: var(--wp--preset--color--primary-dark) !important;
    border: 1.5px solid var(--wp--preset--color--primary-dark);
}
.sk-relation-btn:hover { opacity: 0.82; }

/* Dark Mode */
body.sk-dark .sk-relation-box {
    background: var(--sk-dm-surface-green);
    border-left-color: var(--wp--preset--color--primary-vivid);
}
body.sk-dark .sk-relation-title { color: var(--sk-dm-text); }
body.sk-dark .sk-relation-btn-primary {
    background: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--surface) !important;
}
body.sk-dark .sk-relation-btn-secondary {
    color: var(--wp--preset--color--primary-vivid) !important;
    border-color: var(--wp--preset--color--primary-vivid);
}

/* ================================================================
   17. ÄHNLICHE BEITRÄGE (sk-related-posts / sk-related-card)
   Extrahiert aus dsb-theme.css v2.1.132 — lädt nur via is_singular()
   ================================================================ */

.sk-related-section {
    padding-bottom: 2rem;
    background: var(--wp--preset--color--surface);
    border-radius: 0 0 8px 8px;
    box-shadow: 0 4px 24px rgba(0,0,0,0.08), 0 1px 4px rgba(0,0,0,0.05);
    border: 1px solid var(--wp--preset--color--border);
    border-top: 4px solid var(--wp--preset--color--primary-dark);
    overflow: hidden;
}

.sk-related-section > .wp-block-heading {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.sk-related-posts {
    display: grid;
    grid-template-columns: 2.5rem 1fr 2.5rem;
    grid-template-rows: auto;
    gap: 0 0.75rem;
    align-items: center;
}

.sk-related-posts > ul.wp-block-post-template,
.sk-related-posts .wp-block-post-template {
    grid-column: 2;
    grid-row: 1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    list-style: none;
    padding: 0;
    margin: 0;
}

.sk-related-pagination {
    display: contents !important;
}

.sk-related-pagination > .wp-block-query-pagination-previous {
    grid-column: 1;
    grid-row: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background: var(--wp--preset--color--primary-light);
    color: var(--wp--preset--color--primary-dark);
    font-size: 0;
    overflow: hidden;
    text-decoration: none;
    transition: background 0.15s, color 0.15s;
    justify-self: center;
    align-self: center;
}

.sk-related-pagination > .wp-block-query-pagination-next {
    grid-column: 3;
    grid-row: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background: var(--wp--preset--color--primary-light);
    color: var(--wp--preset--color--primary-dark);
    font-size: 0;
    overflow: hidden;
    text-decoration: none;
    transition: background 0.15s, color 0.15s;
    justify-self: center;
    align-self: center;
}

.sk-related-pagination > .wp-block-query-pagination-previous:hover,
.sk-related-pagination > .wp-block-query-pagination-next:hover {
    background: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--surface);
}

.sk-related-pagination .wp-block-query-pagination-previous-arrow,
.sk-related-pagination .wp-block-query-pagination-next-arrow {
    font-size: 1.4rem;
    line-height: 1;
    margin: 0;
    display: block;
}

.sk-related-card .wp-block-post-featured-image {
    margin-bottom: 0.5rem;
    border-radius: 4px;
    overflow: hidden;
    background: var(--wp--preset--color--border-accent);
}

.sk-related-card .wp-block-post-featured-image img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    object-fit: scale-down !important;
    border-radius: 4px !important;
}

.sk-related-card .wp-block-post-featured-image .sk-fallback-img,
.sk-related-card .wp-block-post-featured-image .wp-block-cover__image-background {
    object-fit: cover !important;
    max-width: none !important;
}

.sk-related-card .wp-block-post-title a {
    color: var(--wp--preset--color--body-text);
    text-decoration: none;
    font-size: 0.9rem;
    transition: color 0.15s;
}
.sk-related-card .wp-block-post-title a:hover {
    color: var(--wp--preset--color--primary);
    text-decoration: underline;
}

/* Dark Mode */
body.sk-dark .sk-related-section {
    background: var(--sk-dm-surface-alt);
    border-color: var(--sk-dm-border-alt);
    border-top-color: var(--wp--preset--color--primary);
    box-shadow: 0 2px 16px rgba(0,0,0,0.25);
}
body.sk-dark .sk-related-card .wp-block-post-title a { color: var(--sk-dm-text); }
body.sk-dark .sk-related-pagination > .wp-block-query-pagination-previous,
body.sk-dark .sk-related-pagination > .wp-block-query-pagination-next {
    background: rgba(255,255,255,0.12);
    color: var(--wp--preset--color--surface);
}
body.sk-dark .sk-related-pagination > .wp-block-query-pagination-previous:hover,
body.sk-dark .sk-related-pagination > .wp-block-query-pagination-next:hover {
    background: var(--wp--preset--color--primary);
}

@media (max-width: 599px) {
    .sk-related-posts > ul.wp-block-post-template,
    .sk-related-posts .wp-block-post-template {
        grid-template-columns: 1fr;
    }
}

/* ================================================================
   18. SINGLE POST — CARD-WRAP & CONTENT
   Extrahiert aus dsb-theme.css v2.1.132 — lädt nur via is_singular()
   ================================================================ */

.single-post .dsb-content-area > .wp-block-group:first-child {
    background: var(--wp--preset--color--surface);
    border-radius: 0 0 8px 8px;
    box-shadow: 0 4px 24px rgba(0,0,0,0.10), 0 1px 4px rgba(0,0,0,0.06);
    overflow: hidden;
    border: 1px solid var(--wp--preset--color--border);
    border-top: 4px solid var(--wp--preset--color--primary);
    padding-bottom: 2.5rem;
}

.single-post .dsb-content-area > .wp-block-group:first-child > .sk-rubrik-header {
    border-radius: 0;
    margin-top: 0;
    margin-bottom: 0;
}
/* Video-Posts: Rubrik-Cover ausblenden — Click-to-Play uebernimmt die Bildrolle */
body.sk-has-video .sk-rubrik-header { display: none; }
/* Video-Posts: Hero-Beitragssbild ausblenden — sk-video-hero übernimmt die Position */
body.sk-has-video .sk-article-image { display: none !important; }
/* Video-Hero: Click-to-Play repraesentiert das Headerbild */
.sk-has-video .sk-video-hero {
    width: 100%;
    margin: 0;
    border-radius: 8px 8px 0 0;
    overflow: hidden;
    cursor: pointer;
}
.sk-has-video .sk-video-hero img,
.sk-has-video .sk-video-hero video {
    width: 100%;
    display: block;
    border-radius: 0;
}

.single-post .dsb-content-area > .wp-block-group:first-child > .wp-block-shortcode,
.single-post .dsb-content-area > .wp-block-group:first-child > .wp-block-group:not(:last-child),
.single-post .dsb-content-area > .wp-block-group:first-child > .wp-block-post-content {
    padding-left: 1.75rem;
    padding-right: 1.75rem;
}

.single-post .dsb-content-area .wp-block-post-terms:not(.sk-tag-block):not(.sk-tag-l1):not(.sk-tag-l2):not(.sk-tag-l3) a {
    background: var(--wp--preset--color--primary) !important;
    color: var(--wp--preset--color--surface) !important;
    border-color: var(--wp--preset--color--primary) !important;
    font-size: 0.65rem;
    padding: 2px 8px;
    border-radius: 3px;
}

.single-post .dsb-content-area > .wp-block-group:first-child .wp-block-post-title {
    font-size: 1.9rem !important;
    font-weight: 800 !important;
    line-height: 1.2;
    letter-spacing: -0.01em;
}

.single-post .dsb-content-area > .wp-block-group:first-child > .wp-block-group:not(:last-child) {
    background: linear-gradient(180deg, rgba(var(--sk-primary-rgb),0.04) 0%, transparent 100%);
    padding-top: 1rem;
    padding-bottom: 0.75rem;
}

.single-post .dsb-content-area > .wp-block-group:first-child > .wp-block-separator {
    margin-left: 1.75rem !important;
    margin-right: 1.75rem !important;
    border-color: var(--wp--preset--color--primary-light) !important;
    background: var(--wp--preset--color--primary-light) !important;
    height: 2px !important;
    opacity: 0.6;
}

.single-post .dsb-content-area > .wp-block-group:first-child > .wp-block-post-content {
    padding-top: 0.5rem;
}

.single-post .dsb-content-area > .wp-block-group:first-child > .wp-block-group:last-child {
    border-top: 1px solid var(--wp--preset--color--border);
    padding: 1.25rem 1.75rem 0;
    margin-top: 1rem;
    font-size: 0.85rem;
    font-weight: 600;
}

/* Dark Mode */
body.sk-dark .single-post .dsb-content-area > .wp-block-group:first-child {
    border-color: var(--sk-dm-border-alt);
    border-top-color: var(--wp--preset--color--primary);
    box-shadow: 0 4px 24px rgba(0,0,0,0.35);
}
body.sk-dark .single-post .dsb-content-area > .wp-block-group:first-child > .wp-block-group:not(:last-child) {
    background: linear-gradient(180deg, rgba(var(--sk-primary-rgb),0.12) 0%, transparent 100%);
}


/* ── sk-related-tags: Karussell-Karten Badge-Farben (hohe Spezifizität) ──────
 * WP-Core global-styles kann allgemeine .sk-tag-l1 a Regeln überschreiben.
 * Diese Regeln greifen direkt auf den .sk-related-tags Container. */
.sk-related-tags .sk-tag-l1 a,
.sk-related-tags .sk-tag-l1 .wp-block-post-terms__link {
    display: inline-block !important;
    background-color: var(--wp--preset--color--gold, #c8a951) !important;
    color: var(--wp--preset--color--primary-dark, #1a4012) !important;
    border: 1px solid var(--wp--preset--color--gold, #c8a951) !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: .05em !important;
    text-transform: uppercase !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}
.sk-related-tags .sk-tag-l2 a,
.sk-related-tags .sk-tag-l2 .wp-block-post-terms__link {
    display: inline-block !important;
    background-color: var(--wp--preset--color--primary-dark, #1a4012) !important;
    color: #ffffff !important;
    border: 1px solid var(--wp--preset--color--primary-dark, #1a4012) !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: .05em !important;
    text-transform: uppercase !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}
.sk-related-tags .sk-tag-l3 a,
.sk-related-tags .sk-tag-l3 .wp-block-post-terms__link {
    display: inline-block !important;
    background-color: transparent !important;
    color: var(--wp--preset--color--primary-dark, #1a4012) !important;
    border: 1.5px solid var(--wp--preset--color--primary-dark, #1a4012) !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: .05em !important;
    text-transform: uppercase !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
    text-decoration: none !important;
    white-space: nowrap !important;
}
/* Dark Mode */
body.sk-dark .sk-related-tags .sk-tag-l1 a,
body.sk-dark .sk-related-tags .sk-tag-l1 .wp-block-post-terms__link {
    background-color: var(--wp--preset--color--gold, #c8a951) !important;
    color: var(--wp--preset--color--primary-dark, #1a4012) !important;
}
body.sk-dark .sk-related-tags .sk-tag-l3 a,
body.sk-dark .sk-related-tags .sk-tag-l3 .wp-block-post-terms__link {
    color: var(--sk-primary, #4ade80) !important;
    border-color: var(--sk-primary, #4ade80) !important;
}

/* ── Karussell-Badges: Überlange Texte mit Ellipsis abschneiden ─────────────
 * white-space:nowrap verhindert Zeilenumbruch im Badge; max-width:100% +
 * overflow:hidden + text-overflow:ellipsis sorgt dafür, dass kein Badge
 * breiter als seine Karte wird (verhindert Overflow nach Rechts). */
/* min-width:0 auf Flex-Items ist Voraussetzung fuer text-overflow in flex */
.sk-related-tags .sk-tag-l1,
.sk-related-tags .sk-tag-l2,
.sk-related-tags .sk-tag-l3 {
    min-width: 0;
    overflow: hidden;
}
.sk-related-tags .sk-tag-l1 a,
.sk-related-tags .sk-tag-l1 .wp-block-post-terms__link,
.sk-related-tags .sk-tag-l2 a,
.sk-related-tags .sk-tag-l2 .wp-block-post-terms__link,
.sk-related-tags .sk-tag-l3 a,
.sk-related-tags .sk-tag-l3 .wp-block-post-terms__link {
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
