﻿/**
 * ClubPress — Haupt-CSS (dsb-theme.css)
 *
 * Prinzip: Nur das, was theme.json NICHT leisten kann.
 * Layout/Colors/Spacing werden über theme.json + Templates gesteuert.
 * Hier:
 *  - Layout-Variablen (Spacing, Breiten, CSS Tokens)
 *  - Sidebar-Flex-Struktur
 *  - Block-Overrides (Submenu, Mobile-Drawer, Dropdowns)
 *  - Plugin-Content-Styling (Taxonomie-Tags, Filter-Bar)
 *  - Dark Mode (alle Seiten)
 *  - Responsive + Accessibility + Print
 *  - Startseiten-Layout (Hero, CTA-Karten)
 *
 * Single-Post-spezifisch (Relation Box, Related Posts, Card-Wrap):
 *  → dsb-single.css (lädt nur auf is_singular())
 *
 * Post-Card-Styles (Archiv, Suche):
 *  → dsb-archive.css (lädt nur auf is_archive/home/search)
 *
 * Version: 2.1.158
 */

/* ================================================================
   EDITOR STYLES — .editor-styles-wrapper
   Stellt sicher dass der Block-Editor visuell dem Frontend ähnelt.
   theme.json übernimmt Farben/Typo — hier nur strukturelle Korrekturen.
   ================================================================ */
.editor-styles-wrapper {
    font-family: var(--wp--preset--font-family--system);
    font-size: var(--wp--preset--font-size--base);
    line-height: 1.6;
    color: var(--wp--preset--color--body-text);
    background: var(--wp--preset--color--page-bg);
}
.editor-styles-wrapper h1,
.editor-styles-wrapper h2,
.editor-styles-wrapper h3,
.editor-styles-wrapper h4,
.editor-styles-wrapper h5,
.editor-styles-wrapper h6 {
    color: var(--wp--preset--color--primary-dark);
    font-weight: 700;
    line-height: 1.3;
}
.editor-styles-wrapper a {
    color: var(--wp--preset--color--primary);
}
.editor-styles-wrapper a:hover {
    color: var(--wp--preset--color--primary-dark);
}
/* Prevent editor toolbar from inheriting theme bg */
.editor-styles-wrapper .block-editor-block-list__layout.is-root-container > * {
    max-width: 1200px;
}

/* ================================================================
   X-98 ACCESSIBILITY — WCAG 2.1 AA
   Skip-Link, Focus-Visible, Kontrast-Korrekturen
   ================================================================ */

/* --- Skip-Link (WCAG 2.4.1) ----------------------------------- */
.dsb-skip-link {
    position: absolute;
    left: -9999px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}
.dsb-skip-link:focus {
    position: fixed;
    top: 0;
    left: 0;
    width: auto;
    height: auto;
    padding: 1rem 1.5rem;
    background: var(--wp--preset--color--primary-dark);
    color: var(--wp--preset--color--surface);
    z-index: 9999;
    font-size: 1rem;
    font-weight: 700;
    text-decoration: none;
    border-radius: 0 0 4px 0;
    outline: 3px solid var(--wp--preset--color--gold);
}

/* --- Focus-Visible (WCAG 2.4.7) ------------------------------- */
:focus-visible {
    outline: 3px solid var(--wp--preset--color--primary);
    outline-offset: 2px;
    border-radius: 2px;
}
.wp-block-navigation-item__content:focus-visible,
.wp-block-button__link:focus-visible {
    outline: 3px solid var(--wp--preset--color--gold);
    outline-offset: 3px;
}

/* --- Dark Mode Toggle Button (sk-dm-btn) ---------------------- */
.sk-dm-btn {
    background: none;
    border: none;
    color: #fff;
    cursor: pointer;
    font-size: 0.8rem;
    padding: 3px 8px;
    border-radius: 3px;
    transition: background 0.2s;
    line-height: 1.4;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
.sk-dm-btn:hover {
    background: rgba(255, 255, 255, 0.15);
}
.sk-dm-btn:focus-visible {
    outline: 2px solid var(--wp--preset--color--gold);
    outline-offset: 2px;
}
body.sk-dark .sk-dm-btn {
    color: var(--wp--preset--color--gold, #c8a951);
}

/* ================================================================
   1. LAYOUT-VARIABLEN
   Spacings und Breiten die theme.json nicht als Custom Properties
   exportiert, aber mehrfach gebraucht werden.
   ================================================================ */
:root {
    --global-content-width: 1200px;
    --global-content-narrow-width: 842px;
    --global-content-edge-padding: 1.5rem;
    --global-content-boxed-padding: 2rem;

    --global-sm-spacing: 0.75rem;
    --global-md-spacing: 1.5rem;
    --global-lg-spacing: 2rem;

    /* === SK Color Tokens: Dark Mode structural === */
    --sk-dm-bg-deep:        #111;
    --sk-dm-bg:             #1a1a1a;
    --sk-dm-surface:        #222;
    --sk-dm-surface-alt:    #2a2a2a;
    --sk-dm-surface-green:  #1e2e1e;
    --sk-dm-border:         #333;
    --sk-dm-border-alt:     #3a3a3a;
    --sk-dm-border-mid:     #444;
    --sk-dm-border-light:   #555;
    --sk-dm-text:           #e5e5e5;
    --sk-dm-text-muted:     #ccc;
    --sk-dm-text-subtle:    #aaa;
    --sk-dm-text-dim:       #919191; /* X-98: #777→#919191 (WCAG AA: 4.55:1 on #2a2a2a) */
    --sk-dm-text-faint:     #666;
    --sk-dm-text-ticker:    #e8f5e1;
    --sk-dm-text-ticker-hover: #c8e8b8;

    /* === SK Color Tokens: Light Mode Utility === */
    --sk-text-strong:       #333;
    --sk-text-meta:         #666;
    --sk-text-muted:        var(--wp--preset--color--text-muted); /* X-204: war #767676 — nur 4.33:1 auf getönten Flächen (page-bg #F7FAFC) u. 3.99:1 auf der Breadcrumb-Leiste (#f0f0f1). Jetzt theme.json-Token text-muted (#4A5568, >=6.6:1 auf allen Light-Flächen). Token-Hoheit im Theme. */
    /* X-204-Nachlauf F3: --sk-text-subtle Token-Hoheit ins Theme (Muster wie X-204). War design-tokens.css
       :root = --sk-gray-400 (#8c8f94) -> nur 2.85:1 auf der Breadcrumb-Leiste (#f0f0f1). #646970 (WP gray-500)
       = 4.85:1 auf #f0f0f1, >=5.5:1 auf Weiss. design-tokens.css bleibt ueberschriebener Fallback (laedt vor dsb-theme.css). */
    --sk-text-subtle:       #646970;
    /* X-204-Nachlauf F3: Header-Tagline. wp:site-tagline trug has-footer-text-color (#a8c8a0) = nur 3.58:1
       auf Header-Gruen (#2d6a1f). #d4edbe (SKSB-Gruen-auf-Gruen, = Aktuelles-Cover-Untertitel) = 5.2:1, AA Light+Dark. */
    --sk-header-tagline:    #d4edbe;
    --sk-border-light:      #ccc;
    --sk-border-warm:       #e8e4da;
    --sk-surface-warm:      #f5f3ee;
    --sk-surface-filter:    #f3f4f6;

    /* === SK Color Tokens: Alpha/RGB for rgba() === */
    --sk-primary-rgb:       45, 106, 31;     /* #2d6a1f */
    --sk-primary-dark-rgb:  26, 74, 26;      /* #1a4a1a */
    --sk-gold-rgb:          200, 169, 81;    /* #c8a951 */
}


/* ================================================================
   2. SEITEN-LAYOUT (Flex-Container für Sidebar-Layouts)
   theme.json kennt keinen Sidebar-Flex — wird hier manuell gebaut.
   ================================================================ */

/* X-97 CWV: content-visibility für Below-Fold-Sektionen (Rendering-Budget-Optimierung).
   Nur auf strukturelle Gruppen, nicht auf Hero (above fold) oder main content. */
.wp-block-group.alignfull:not(:first-child),
.dsb-content-area,
.dsb-layout-with-sidebar {
    content-visibility: auto;
    contain-intrinsic-size: auto 400px; /* Schätz-Höhe verhindert CLS beim Scroll */
}

body { margin: 0; }

.wp-site-blocks {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.wp-site-blocks > main,
.wp-site-blocks > .wp-block-group > main { flex: 1; }

.dsb-content-area {
    padding: 1rem var(--global-content-edge-padding) var(--global-lg-spacing);
}

.dsb-layout-with-sidebar {
    display: flex;
    gap: 2rem;
    align-items: flex-start;
}

.dsb-layout-with-sidebar > .dsb-content-main { flex: 1; min-width: 0; }
.dsb-layout-with-sidebar > .dsb-sidebar { flex-basis: 26% !important; flex-shrink: 0 !important; max-width: 26% !important; }

/* Sidebar-Spalten in wp:columns-Layouts (flex-basis inline style override) */
.wp-block-column[style*="flex-basis:38.2%"] {
    flex-basis: 26% !important;
    max-width: 26% !important;
}
.wp-block-column[style*="flex-basis:61.8%"] {
    flex-basis: 74% !important;
}

/* ================================================================
   3. TOPBAR
   ================================================================ */

/* Topbar-Leiste: gleiche Höhe wie Breadcrumb-Leiste (30px) */
.wp-block-group.alignfull.has-primary-dark-background-color {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
.dsb-topbar {
    min-height: 24px;
    align-items: center;
}
/* overflow fuer .site-header-top-section-center direkt in sksb-topbar.php korrigiert */


/* ================================================================
   4. HEADER: Submenu-Dropdown + Site-Title
   Position, BG, Padding, Nav-Color kommen aus theme.json + Template.
   ================================================================ */

/* X-84: Wappen-Logo — feiner Goldring + Schatten
   Höhere Spezifität (0,2,0) nötig, da WP Core .wp-block-site-logo img { border-radius: inherit } (0,1,1) setzt
   object-fit/position: PNG-Wappen hat 1px asymm. Transparent-Padding (3px oben/links, 6px unten/rechts),
   daher Emblem-Mittelpunkt bei (49,49) statt (50,50) — 1px-Korrektur per object-position. */
.wp-block-site-logo .custom-logo {
    border-radius: 50% !important;
    box-shadow: 0 0 0 2px var(--wp--preset--color--gold), 0 4px 18px rgba(0,0,0,0.45);
    object-fit: none;
    object-position: calc(50% + 1px) calc(50% + 1px);
}

/* Site-Tagline im Header (wp:site-tagline).
   X-204-Nachlauf F3: trug has-footer-text-color (#a8c8a0) = nur 3.58:1 auf Header-Gruen (#2d6a1f).
   --sk-header-tagline (#d4edbe) = 5.2:1 (Light+Dark, Header bleibt gruen). Spez. 0,2,0 schlaegt die
   Preset-Utility has-footer-text-color (0,1,0). Der fruehere Selektor .site-description war ein
   Classic-Theme-Relikt und traf im Block-Theme kein Element (Tagline = .wp-block-site-tagline). */
.dsb-header-branding .wp-block-site-tagline {
    color: var(--sk-header-tagline) !important; /* WP generiert .has-footer-text-color mit !important; 0,2,0-important schlaegt 0,1,0-important */
}

/* Submenu-Dropdown */
.dsb-header-main .wp-block-navigation:not(.has-background) .wp-block-navigation__submenu-container,
.dsb-header-main .wp-block-navigation .wp-block-navigation__submenu-container {
    background: var(--wp--preset--color--primary);
    box-shadow: 0 2px 13px rgba(0,0,0,0.1);
    border: none;
    min-width: 200px;
}

.dsb-header-main .wp-block-navigation__submenu-container li {
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

.dsb-header-main .wp-block-navigation__submenu-container a {
    padding: 1em;
    font-size: 0.85rem;
}

.dsb-header-main .wp-block-navigation__submenu-container a:hover {
    background: var(--wp--preset--color--primary-dark);
}

.dsb-header-main .wp-block-navigation__submenu-container .wp-block-navigation__submenu-container {
    background: var(--wp--preset--color--primary-dark);
}


/* ================================================================
   5. CONTENT & ENTRY
   ================================================================ */
.content-bg, .dsb-content-main {
    background: var(--wp--preset--color--surface);
}

.entry.single-entry { box-shadow: 0 15px 15px -10px rgba(0,0,0,0.05); }
.entry-content-wrap { padding: var(--global-content-boxed-padding); }

.entry-meta {
    font-size: 0.85rem;
    color: var(--wp--preset--color--text-light);
    display: flex;
    gap: 0.5em;
    align-items: center;
    flex-wrap: wrap;
}


/* ================================================================
   6. POST LOOP / QUERY BLOCK CARDS
   ================================================================ */
.entry.loop-entry { box-shadow: 0 15px 15px -10px rgba(0,0,0,0.05); }
.loop-entry .entry-content-wrap { padding: var(--global-content-boxed-padding); }

/* ================================================================
   *** HAUSREGEL BEITRAGSBILDER (SKT-8, 12.09.2026) — HIER DEFINIERT ***
   ================================================================
   Bis EINSCHLIESSLICH 120 px gerenderter Breite:  object-fit: cover
   Ueber 120 px gerenderter Breite:                object-fit: scale-down

   Herleitung (zwei PO-Beanstandungen, vom PO am 12.09.2026 zur Regel erhoben):
     02.09. "das Beitragsbild wird auf der Startseite abgeschnitten"  -> grosse
            Flaechen nie beschneiden, Beschnitt zerstoert dort den Bildinhalt.
     12.09. "die Bilder in der Suche sind zu klein"                   -> kleine
            Flaechen fuellen, bei 80-120 px erkennt niemand Details; ein
            Streifen mit Rand wirkt schlampig, eine gefuellte Kachel aufgeraeumt.
   PO-Freigabe der Schwelle: "schwelle bei 120 px".

   MASSGEBLICH IST DIE TATSAECHLICH GERENDERTE BREITE, NICHT DER CSS-WERT.
   Am Objekt messen, Desktop UND 375 px:
     [...document.querySelectorAll('<selektor> img')].map(i=>{const r=
       i.getBoundingClientRect();return r.width+'x'+r.height+' '+
       getComputedStyle(i).objectFit;})

   Anwendung an allen bekannten Stellen (Stand 12.09.2026, alle live gemessen):
     >120 px, scale-down:
       .sksb-card-img-wrap img      274-306 / 210 px   dsb-archive.css
       .sk-article-image img        780 / 326 px       dsb-single.css
       .sk-related-card img         213 / 187 px       dsb-single.css
       .sk-sidebar-bild img         (latent, ~38,2%-Spalte)  weiter unten
       dieser generische Basisstil  (Netz fuer kuenftige Query-Bloecke)
     <=120 px, cover:
       .sk-search-thumb img         120 px             dsb-archive.css
       .sk-disziplin-thumb img      80 px              mu-plugins/sksb-disziplin-shortcode.php
     Begruendete Ausnahmen:
       .sksb-gallery-grid img       210/326 px, cover  — einheitliches Quadratraster
                                    IST der Zweck; Lightbox zeigt das ganze Bild
       #sksb-lb-img (Lightbox)      contain            — ganzes Bild ist der Zweck
       .wp-block-site-logo .custom-logo  none          — Wappen-PNG, asymmetrischer
                                    Transparenzrand, 1px-Korrektur per object-position
       wp-block-cover Hintergrundbilder  cover         — ein Cover-Hintergrund fuellt
                                    per Definition; WP-Core-CSS, keine Hausregel

   ELFTE STELLE? Dann hier eintragen, nicht anders patchen.
   Auch im Feature-Register vermerken: memory/sksb-features.md.

   WARUM UEBERALL !important — und warum NICHT wegen dieser Regel hier:
   WordPress schreibt object-fit und height INLINE ans <img> (Core-Block
   core/post-featured-image, wp-includes/blocks/post-featured-image.php:64f.,
   aus dem Block-Attribut "scale", Default "cover"). Roh gemessen 12.09.:
     Suchtreffer:  style="border-radius:6px;height:auto;width:120px;object-fit:cover;"
     Loop-Karte:   style="height:160px;object-fit:cover;"
   Ein Inline-Style schlaegt jede Autoren-Regel ohne !important. Die frueher
   vermutete Ursache — dieser generische Basisstil — ist es NICHT: er gewinnt
   an keiner einzigen Stelle der Seite (12.09. auf Start, /aktuelles/, Suche,
   Einzelbeitrag, /2026/, Kategorie-Archiv, Fotogalerie geprueft: kein einziges
   Bild, bei dem er die wirksame Regel waere). Ihn zu entfernen wuerde also
   KEIN !important einsparen. Der einzige echte Wurzelfix waere, in den
   Templates "scale":"scale-down" am Block zu setzen, damit der Inline-Style
   selbst stimmt (safecss_filter_attr laesst den Wert durch) — betrifft
   home/archive/taxonomy/single.html PLUS den Query-Block im post_content der
   Startseite (Seite 92) und bringt optisch null. Bewusst nicht getan, siehe
   Rueckmeldung SKT-8.
   ================================================================ */

/* Basisstil für alle Query-Post-Items ohne neue Card-Klasse.
   SKT-8: war object-fit:cover. Umgestellt auf scale-down, weil dieser Basisstil
   fuer grosse Kacheln gilt (feste Bandhoehe 180px) und damit in den >120px-Ast
   der Hausregel faellt. Heute ohne sichtbare Wirkung — an jeder realen Stelle
   gewinnt eine spezifischere Regel (s.o.); die Umstellung sorgt dafuer, dass ein
   kuenftig im Editor gebauter Query-Block automatisch der Hausregel folgt statt
   ihr zu widersprechen. Kein !important: spezifischere Regeln sollen weiter
   muehelos gewinnen. */
.wp-block-query:not(.sk-related-posts) .wp-block-post-featured-image { margin: 0; }
.wp-block-query:not(.sk-related-posts) .wp-block-post-featured-image img {
    width: 100%;
    height: 180px;
    object-fit: scale-down;
}


/* ================================================================
   7. TAXONOMIE-TAGS (Plugin sksb-post-taxonomy-tags)
   ================================================================ */
.taxonomy-links,
.wp-block-post-terms {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    margin-bottom: 0.3rem;
}

.wp-block-post-terms a,
.taxonomy-links a {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--wp--preset--color--primary);
    text-decoration: none;
    padding: 1px 6px;
    border: 1px solid var(--wp--preset--color--primary-light);
    border-radius: 3px;
    background: var(--wp--preset--color--primary-bg);
}

.wp-block-post-terms a:hover,
.taxonomy-links a:hover {
    background: var(--wp--preset--color--primary-light);
}


/* ================================================================
   8. BLOCK-FEINHEITEN (Tables, Quotes, Captions, Gallery)
   ================================================================ */
.wp-block-table { border-collapse: collapse; }
.wp-block-table thead { border-bottom: 3px solid var(--wp--preset--color--text-light); }
.wp-block-table tfoot { border-top: 3px solid var(--wp--preset--color--text-light); }
.wp-block-table td,
.wp-block-table th {
    padding: 0.5em;
    border: 1px solid var(--wp--preset--color--text-light);
}

.wp-block-quote.has-text-align-right {
    border-left: none;
    border-right: 4px solid var(--wp--preset--color--body-text);
    padding-left: 0;
    padding-right: 1em;
}
.wp-block-quote.has-text-align-center { border: none; padding-left: 0; }

.wp-block-separator:not(.is-style-wide):not(.is-style-dots) { max-width: 160px; }
.wp-block-separator.has-background:not(.is-style-dots) {
    border-bottom: none;
    height: 1px;
}

.wp-block-image { margin-bottom: 0; }

.wp-block-image figcaption,
.wp-block-embed figcaption,
.wp-block-table figcaption,
.wp-block-audio figcaption,
.wp-block-video figcaption {
    color: var(--wp--preset--color--text-muted);
    font-size: 80%;
    text-align: center;
}

.wp-block-cover { display: flex; align-items: center; }
/* Rubrik-Header Hero: Focal Point Default — verhindert abgeschnittene Koepfe */
/* Kein !important — Inline-Style vom Focal-Point-Picker (Gutenberg) schlaegt diese Regel */
.sk-rubrik-header .wp-block-cover__image-background {
    object-position: center 25%;
}


/* ================================================================
   9. SIDEBAR (Widgets)
   ================================================================ */

/* ── SKR-31: Schutz-Marker (dashicons-Schloss) ────────────── */
/* Sicherheits-Indikator fuer geschuetzte Beitraege (private + _skr_nur_geschuetzt).
   Inline-tauglich (dashicons-Basisklasse ist 20px-Block -> hier auf Textfluss getrimmt). */
.skr-lock.dashicons {
    font-size: 0.85em;
    width: auto;
    height: auto;
    line-height: 1;
    vertical-align: -0.08em;
    color: var(--wp--preset--color--gold, #c8a951);
}

/* ── Sidebar-Bild (.sk-sidebar-bild) über der Navigation ─────────── */
/* SKT-8 12.09.2026: object-fit war cover. Umgestellt auf scale-down nach der
   Hausregel oben (>120 px nie beschneiden). Die Klasse sitzt in vier Seiten
   (/kreis/, /kreisvorstand/, /kreis/fotogalerien/, /kreis/vereine-des-kreises/)
   an einem wp:image-Block in einer 38,2%-Spalte, also bei ~300-440 px Breite.
   Heute rendert davon NICHTS: der Block hat kein Bild ausgewaehlt (<img alt=""/>
   ohne src), und WP verwirft einen core/image-Block ohne Quelle komplett — am
   12.09. per curl an allen vier Seiten geprueft, die Klasse kommt im
   ausgelieferten HTML 0x vor. Die Umstellung ist deshalb heute unsichtbar und
   entschaerft nur die Falle fuer den Tag, an dem jemand dort ein Bild einsetzt.
   Fond transparent, damit der Letterbox-Rand den Spaltenhintergrund zeigt —
   in Light und Dark automatisch richtig, gleiches Muster wie .sksb-card-img-wrap. */
.sk-sidebar-bild {
    width: 100%;
    margin-bottom: 1rem;
}
.sk-sidebar-bild img {
    width: 100%;
    height: 180px;
    object-fit: scale-down;
    background-color: transparent;
    display: block;
    border-radius: 4px;
}
.dsb-sidebar .widget { margin-bottom: 1.5rem; }
.dsb-sidebar .widget-title {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--wp--preset--color--primary-dark);
    margin-bottom: 0.75rem;
}


/* ================================================================
   10. FOOTER  (X-83 — Gold-Polish)
   ================================================================ */
.dsb-footer {
    background: var(--wp--preset--color--footer-bg);
    color: var(--wp--preset--color--footer-text);
    padding: 2rem;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* Links erben Absatzfarbe; Hover/Focus → Gold */
.dsb-footer a { color: inherit; text-decoration: none; transition: color .15s ease; }
.dsb-footer a:hover { color: var(--wp--preset--color--gold) !important; text-decoration: none; }
.dsb-footer a:focus-visible { outline: 2px solid var(--wp--preset--color--gold); outline-offset: 2px; }

/* X-204-Nachlauf F3: Aufrufe-Zaehler [post-views] erbt .entry-meta color = --wp--preset--color--text-light
   (#626d7e) = nur 2.77:1 auf Footer-Gruen (#1a2e14). Footer-Text (#a8c8a0) = 8.06:1. Footer-scoped,
   0,2,0 schlaegt .entry-meta (0,1,0); betrifft nur den Footer, .entry-meta bleibt auf hellen Flaechen unberuehrt. */
.dsb-footer .post-views { color: var(--wp--preset--color--footer-text); }

/* Spaltentitel Gold — Fallback (primär via has-gold-color im Template) */
.dsb-footer h4 {
    color: var(--wp--preset--color--gold);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(var(--sk-gold-rgb),.15);
}

/* Bottom-Bar — kein border-top (HR-Separator im Template übernimmt die Trennlinie) */
.dsb-footer-bottom {
    padding-top: 14px;
    margin-top: 24px;
    font-size: 12px;
    color: rgba(255,255,255,.6);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.dsb-footer-bottom a { color: rgba(255,255,255,.6); text-decoration: none; }
.dsb-footer-bottom a:hover { color: var(--wp--preset--color--gold) !important; }

@media (max-width: 599px) {
    .dsb-footer-bottom {
        flex-direction: column;
        gap: 8px;
        align-items: flex-start;
    }
}


/* ================================================================
   11. DARK MODE
   body.sk-dark wird via sksb-topbar.php JS gesetzt.
   ================================================================ */
body.sk-dark {
    background: var(--sk-dm-bg);
    color: var(--sk-dm-text);
    /* X-204: --sk-text-muted Dark-Override (Token-Hoheit im Theme; lag zuvor im
       mu-plugin uploads/sk-data/design-tokens.css). Light-Wert kommt aus theme.json
       (text-muted #4A5568); im Dark Mode braucht gedämpfter Text einen helleren Wert. */
    --sk-text-muted: #9ca3af; /* >=5.6:1 auf allen Dark-Surfaces (#1a1a1a / #2a2a2a / #111) */
    /* X-204-Nachlauf F3: --sk-text-subtle Dark-Override (Token-Hoheit im Theme). War design-tokens.css
       #6b7280 (nur 3.4:1 auf #1a1e2a). #868e9c = 5.7:1 auf #111 (Breadcrumb-Balken), 5.0:1 auf #1a1e2a. */
    --sk-text-subtle: #868e9c;
}

/* Globale Schrift- und Hintergrundfarben */
body.sk-dark .dsb-content-main,
body.sk-dark .content-bg { background: var(--sk-dm-surface-alt); color: var(--sk-dm-text); }

body.sk-dark p,
body.sk-dark li,
body.sk-dark td,
body.sk-dark th { color: var(--sk-dm-text); }

body.sk-dark h1, body.sk-dark h2, body.sk-dark h3,
body.sk-dark h4, body.sk-dark h5, body.sk-dark h6 { color: var(--wp--preset--color--surface); }

/* Query-Cards */
body.sk-dark .wp-block-query .wp-block-post {
    background: var(--sk-dm-surface-alt);
    border-color: var(--sk-dm-border-alt);
}
body.sk-dark .home .wp-block-post .wp-block-read-more {
    border-top-color: var(--sk-dm-border-alt);
}

/* Breadcrumb-Leiste */
body.sk-dark #sk-bc-bar {
    background: var(--sk-dm-bg-deep);
    border-bottom-color: var(--sk-dm-border);
}
body.sk-dark #sk-bc-bar a { color: var(--wp--preset--color--primary-vivid); }
body.sk-dark #sk-bc-bar .sk-bc-current { color: var(--sk-dm-text); }
/* X-204-Nachlauf F3: Trenner nutzten --sk-dm-border-light (#555) = nur 2.53:1 auf dem Balken (#111).
   Jetzt --sk-text-subtle (dark #868e9c) = 5.7:1. (Das MU-Plugin nutzt fuer die Trenner ohnehin
   --sk-text-subtle; diese Theme-Regel ueberstimmte es bislang mit #555.) */
body.sk-dark #sk-bc-bar .sk-bc-sep,
body.sk-dark #sk-bc-bar .sk-bc-dot { color: var(--sk-text-subtle); }
/* X-204-Nachlauf F2: Besuchte Breadcrumb-Siblings fallen per Chromium-:visited-Datenschutz auf den
   :root-Wert von --sk-text-muted zurueck (#4A5568 = 2.51:1 auf #111) — der Dark-Override liegt auf
   body.sk-dark, nicht :root, und :visited erlaubt keine kontextuelle var()-Aufloesung. Literale AA-Farbe
   #9ca3af (5.99:1 auf #111) = dieselbe Farbe wie unbesuchte Dark-Siblings. */
body.sk-dark #sk-bc-bar .sk-bc-sibling:visited { color: #9ca3af; }

/* Sidebar (Suchergebnisse + Widgets + Termine-Filter) */
body.sk-dark .dsb-sidebar-widgets .sk-sidebar,
body.sk-dark .dsb-sidebar .sk-sidebar,
body.sk-dark .sk-sidebar {
    background: var(--sk-dm-surface) !important;  /* !important nötig: WP block-group override */
    border-color: var(--sk-dm-border) !important; /* !important nötig: WP block border override */
    color: var(--sk-dm-text-muted); /* X-89: kein !important mehr — Inline-Styles in kalender.php weg */
}
body.sk-dark .sk-sidebar h4,
body.sk-dark .sk-sidebar .sk-filter-label,
body.sk-dark .dsb-sidebar-widgets h4 { color: var(--wp--preset--color--primary-vivid); }
body.sk-dark .dsb-sidebar-widgets ul li a,
body.sk-dark .dsb-sidebar-widgets p { color: var(--sk-dm-text-muted); }
/* .sk-sidebar a/hover: jetzt via .sk-filter-link / .sk-filter-link:hover (X-86, kein !important mehr nötig) */

/* ── X-86: Kalender-Filter CSS-Klassen (sksb-kalender.php) ─────────────────── */
/* Sidebar-Box: .sk-sidebar Basis schon vorhanden, nur fehlende Eigenschaften */
.sk-sidebar { border: 1px solid var(--wp--preset--color--primary-light); border-radius: 10px; background: var(--wp--preset--color--primary-bg); padding: 1.25rem; margin-bottom: 1rem; }

.sk-filter-label { font-size: 0.8rem; color: var(--sk-text-meta); margin: 0 0 0.75rem; line-height: 1.4; }

.sk-filter-heading { color: var(--wp--preset--color--primary); font-size: 0.9rem; font-weight: 700; margin: 0 0 0.5rem; }
.sk-filter-heading-ics { margin-top: 0.75rem; }

.sk-filter-list { list-style: none; margin: 0 0 0.75rem; padding: 0; }
.sk-filter-month-list { margin: 0.3rem 0 0 12px; }

.sk-filter-link { color: var(--sk-text-strong); text-decoration: none; font-size: 0.85rem; }
.sk-filter-link-sm { font-size: 0.8rem; }
.sk-filter-link:hover { color: var(--wp--preset--color--primary-dark); }

.sk-filter-active { font-weight: 700; border-left: 3px solid var(--wp--preset--color--primary); padding-left: 8px; }

.sk-ics-link { display: inline-flex; align-items: center; gap: 0.3rem; font-size: 0.8rem; color: var(--wp--preset--color--primary-dark); text-decoration: none; padding: 4px 8px; background: var(--sk-surface-filter); border-radius: 4px; border: 1px solid var(--wp--preset--color--border); }
.sk-ics-link:hover { border-color: var(--wp--preset--color--primary); }
.sk-ics-hint { font-size: 0.7rem; color: var(--sk-text-muted); margin: 0.3rem 0 0; }

.sk-filter-reset-wrap { margin-top: 1rem; padding-top: 0.75rem; border-top: 1px solid var(--wp--preset--color--primary-light); }
.sk-filter-reset { display: inline-block; font-size: 0.8rem; color: var(--wp--preset--color--primary); text-decoration: none; font-weight: 600; }
.sk-filter-reset:hover { color: var(--wp--preset--color--primary-dark); }

/* Kalender-Pagination */
.sksb-kal-pagination { display: flex; justify-content: center; align-items: center; gap: 0.4rem; margin-top: 1rem; padding-top: 0.75rem; border-top: 1px solid var(--wp--preset--color--border); }
.sksb-kal-pag-btn { padding: 4px 10px; border: 1px solid var(--sk-border-light); border-radius: 4px; text-decoration: none; color: var(--sk-text-strong); font-size: 0.85rem; }
.sksb-kal-pag-btn-sm { padding: 4px 8px; border: none; }
.sksb-kal-pag-btn:hover { border-color: var(--wp--preset--color--primary); color: var(--wp--preset--color--primary-dark); }
.sksb-kal-pag-current { padding: 4px 10px; background: var(--wp--preset--color--primary); color: var(--wp--preset--color--surface); border-radius: 4px; font-size: 0.85rem; font-weight: 700; }
.sksb-kal-pag-ellipsis { color: var(--sk-text-muted); }

/* Dark Mode — X-86 */
body.sk-dark .sk-filter-label { color: var(--sk-dm-text-subtle); }
body.sk-dark .sk-filter-heading { color: var(--wp--preset--color--primary-vivid); }
body.sk-dark .sk-filter-link { color: var(--sk-dm-text-muted); }
body.sk-dark .sk-filter-link:hover { color: var(--wp--preset--color--surface); }
body.sk-dark .sk-filter-active { border-left-color: var(--wp--preset--color--primary-vivid); }
body.sk-dark .sk-ics-link { background: var(--sk-dm-surface-alt); border-color: var(--sk-dm-border-mid); color: var(--sk-dm-text-muted); }
body.sk-dark .sk-ics-link:hover { border-color: var(--wp--preset--color--primary-vivid); }
body.sk-dark .sk-ics-hint { color: var(--sk-dm-text-dim); }
body.sk-dark .sk-filter-reset-wrap { border-top-color: var(--sk-dm-border); }
body.sk-dark .sk-filter-reset { color: var(--wp--preset--color--primary-vivid); }
body.sk-dark .sksb-kal-pagination { border-top-color: var(--sk-dm-border); }
body.sk-dark .sksb-kal-pag-btn { border-color: var(--sk-dm-border-mid); color: var(--sk-dm-text-muted); }
body.sk-dark .sksb-kal-pag-btn:hover { border-color: var(--wp--preset--color--primary-vivid); color: var(--wp--preset--color--surface); }
body.sk-dark .sksb-kal-pag-current { background: var(--wp--preset--color--primary); color: var(--wp--preset--color--surface); }
body.sk-dark .sksb-kal-pag-ellipsis { color: var(--sk-dm-text-faint); }

/* Kalender-Monat + Woche: Zellhintergruende im Dark Mode */
body.sk-dark .sksb-kal-day,
body.sk-dark .sksb-kal-week-cell {
    background: var(--sk-dm-surface);
    color: var(--sk-dm-text);
}
body.sk-dark .sksb-kal-day.sksb-kal-weekend,
body.sk-dark .sksb-kal-week-cell.sksb-kal-weekend {
    background: var(--sk-dm-surface-green);
}
body.sk-dark .sksb-kal-day.sksb-kal-today,
body.sk-dark .sksb-kal-week-cell.sksb-kal-today {
    background: #1a3e1a;
}
body.sk-dark .sksb-kal-day.sksb-kal-empty {
    background: var(--sk-dm-bg);
}
body.sk-dark .sksb-kal-grid,
body.sk-dark .sksb-kal-week {
    background: var(--sk-dm-border);
    border-color: var(--sk-dm-border);
}
body.sk-dark .sksb-kal-daynum { color: var(--sk-dm-text-muted); }
body.sk-dark .sksb-kal-daynum.sksb-kal-today-num { color: var(--wp--preset--color--primary-vivid); }
body.sk-dark .sksb-kal-event { color: var(--sk-dm-text); }

/* Suchfeld (topbar + suchseite) */
body.sk-dark #sksb-inline-search input,
body.sk-dark .sk-search-box input[type="search"] {
    background: var(--sk-dm-border);
    color: var(--sk-dm-text);
    border-color: var(--sk-dm-border-light);
}
body.sk-dark .sk-search-box {
    background: transparent;
}

/* Filter-Bar */
body.sk-dark .sk-filter-bar {
    background: var(--sk-dm-surface);
    border-color: var(--sk-dm-border);
}
body.sk-dark .sk-filter-bar select,
body.sk-dark .sk-filter-bar input {
    background: var(--sk-dm-border) !important; /* !important: sksb-filter-bar.php setzt background:#fff als Inline-Style */
    color: var(--sk-dm-text) !important;
    border-color: var(--sk-dm-border-light) !important;
    color-scheme: dark; /* native Browser-Listbox (Dropdown-Popup) im Dark-Mode rendern */
}

/* Sortier-Buttons (Suchseite) */
body.sk-dark .sk-sort-btn { background: var(--sk-dm-border); color: var(--sk-dm-text-muted); border-color: var(--sk-dm-border-light); }
body.sk-dark .sk-sort-btn.active { background: var(--wp--preset--color--primary); color: var(--wp--preset--color--surface); }

/* Pagination-Buttons */
body.sk-dark .wp-block-query-pagination a,
body.sk-dark .page-numbers { color: var(--wp--preset--color--primary-vivid); }
body.sk-dark .page-numbers.current {
    background: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--surface);
}

/* Separatoren */
body.sk-dark .wp-block-separator { border-color: var(--sk-dm-border-alt); background-color: var(--sk-dm-border-alt); }

/* Tabellen */
body.sk-dark .wp-block-table td,
body.sk-dark .wp-block-table th { border-color: var(--sk-dm-border-alt); }
body.sk-dark .wp-block-table thead { border-bottom-color: var(--sk-dm-border-light); }

/* Single Post Card Dark Mode → nach dsb-single.css verschoben (v2.1.132) */
/* Related Section Dark Mode → nach dsb-single.css verschoben (v2.1.132) */

/* Links allgemein */
body.sk-dark a { color: var(--wp--preset--color--primary-vivid); }
body.sk-dark a:hover { color: var(--wp--preset--color--primary-vivid-hover); }

/* Dark mode: Hauptnavigation + Inhaltsbereich */


/* ================================================================
   12. MOBILE DRAWER (wp:navigation Responsive Overlay)
   ================================================================ */
.wp-block-navigation__responsive-container.is-menu-open {
    background-color: var(--wp--preset--color--primary-dark) !important;
    background: var(--wp--preset--color--primary-dark) !important;
    padding: 2rem 1.5rem;
    color: #fff !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
    width: 100%;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
    padding: 1em 0.5em;
    display: block;
    width: 100%;
    color: #fff !important;
    font-size: 1.1rem;
}
.wp-block-navigation__responsive-container.is-menu-open a,
.wp-block-navigation__responsive-container.is-menu-open a:hover {
    color: #fff !important;
    text-decoration: none;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
    background: transparent;
    padding-left: 1rem;
    box-shadow: none;
    position: static;
    min-width: auto;
}


/* ================================================================
   13. RESPONSIVE
   ================================================================ */
@media all and (max-width: 1024px) {
    :root { --global-content-boxed-padding: 2rem; }
    .dsb-content-area {
        padding: var(--global-md-spacing) var(--global-content-edge-padding);
    }
    .dsb-layout-with-sidebar { flex-direction: column !important; }
    .dsb-layout-with-sidebar > .dsb-sidebar { width: 100%; flex-basis: 100% !important; max-width: 100% !important; }
}

@media all and (max-width: 767px) {
    :root {
        --global-content-boxed-padding: 1.5rem;
        --global-content-edge-padding: 1rem;
    }
    .dsb-content-area {
        padding: var(--global-sm-spacing) var(--global-content-edge-padding);
    }
    .entry-content-wrap,
    .loop-entry .entry-content-wrap { padding: 1.5rem; }

    /* ── Topbar Mobile: Suchfeld in eigener Zeile (CSS Grid) ────── */
    /* sksb-topbar.php JS ersetzt .wp-block-search durch #sksb-inline-search (replaceChild) */
    /* Mu-plugin versteckt #sksb-inline-search bei ≤480px — override via .dsb-topbar-Präfix */
    div.wp-block-group.dsb-topbar {
        display: grid !important;
        grid-template-columns: auto 1fr;
        grid-template-rows: auto auto;
        row-gap: 2px;
        padding-bottom: 4px;
    }
    .dsb-topbar > #sk-dm-link { grid-row: 1; grid-column: 1; }
    .dsb-topbar > .site-header-top-section-center { grid-row: 1; grid-column: 2; justify-self: end; }
    .dsb-topbar > #sksb-inline-search { grid-row: 2; grid-column: 1 / -1; display: flex !important; width: 100%; }
    .dsb-topbar > #sksb-inline-search #sksb-search-input { flex: 1 !important; width: auto !important; min-width: 0; height: 28px; font-size: 0.8rem !important; }
    .dsb-topbar > #sksb-inline-search #sksb-search-btn { height: 28px; padding: 0 10px; }

    /* ── Sidebar Mobile: ausblenden ───────────────────────────────── */
    .dsb-sidebar { display: none !important; }
    .dsb-content-main { max-width: 100% !important; width: 100% !important; }
    /* Plugin-Sidebar in wp-block-column (Sport-Seiten) */
    .wp-block-column:has(.sk-sidebar) { display: none !important; }
    .sk-sidebar { display: none !important; }

    /* ── Breadcrumb: einzeilig mit Ellipsis auf Seitenname ────────── */
    #sk-bc-bar .sk-bc-inner { flex-wrap: nowrap !important; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
    #sk-bc-bar .sk-bc-inner::-webkit-scrollbar { display: none; }
    #sk-bc-bar .sk-bc-sep,
    #sk-bc-bar .sk-bc-link { flex-shrink: 0; white-space: nowrap; }
    #sk-bc-bar .sk-bc-current { white-space: nowrap; flex-shrink: 0; }
}


/* ================================================================
   14. FILTER-BAR (Plugin sksb-filter-bar.php)
   ================================================================ */
.sk-filter-bar {
    gap: 0.4rem;
    padding: 0.6rem 0.8rem;
}
.sk-filter-bar select {
    min-width: 80px;
    max-width: 150px;
    font-size: 0.85rem;
}
.sk-filter-bar input[type='text'] {
    min-width: 50px;
    width: 60px;
    font-size: 0.85rem;
}

/* ================================================================
   15. NAVIGATION — aktiver Menüpunkt fett
   ================================================================ */
.wp-block-navigation a[aria-current],
.wp-block-navigation .current-menu-item > a,
.wp-block-navigation .current-menu-parent > a,
.wp-block-navigation .current-menu-ancestor > a {
    font-weight: 700;
}

/* ================================================================
   16. RELATION BOX + 17. ÄHNLICHE BEITRÄGE
   → nach dsb-single.css verschoben (v2.1.132, is_singular() only)
   ================================================================ */

/* ================================================================
   17. ÄHNLICHE BEITRÄGE → nach dsb-single.css verschoben (v2.1.132)
   ================================================================ */

/* ================================================================
   18. HOME-HERO, CTA-KARTEN & GLOBALE LAYOUT-KORREKTUREN
   ================================================================ */

/* Single-Post Card-Wrap + Video-Hero → nach dsb-single.css verschoben (v2.1.132) */

/* ── X-81: Home-Hero & Entry-CTA-Cards ─────────────────── */

/* X-85: Breadcrumb-Bar auch leer anzeigen (grauer Trennstreifen auf Startseite) */
/* Boxed layout: Header und Hero auf die Content-Breite (1200px) begrenzen.
   width: min(...) statt max-width, weil margin:auto in Flex-Column sonst
   shrink-wrap auslöst (Element schrumpft auf Inhalt statt auf 1200px zu wachsen). */
header.wp-block-template-part {
    width: min(1200px, 100%);
    margin-left: auto;
    margin-right: auto;
}
/* Hero: gleiche Breite wie Header/Content (boxed layout) */
.wp-site-blocks > .wp-block-cover.sksb-home-hero {
    width: min(1200px, 100%);
    margin-left: auto;
    margin-right: auto;
    margin-top: 0 !important;
    margin-block-start: 0 !important;
}

/* Hero: Gradient-Overlay statt flat dim */
.sksb-home-hero .wp-block-cover__background {
    background: linear-gradient(180deg, rgba(var(--sk-primary-dark-rgb),.28) 0%, rgba(var(--sk-primary-dark-rgb),.65) 100%) !important;
    opacity: 1 !important;
}

/* Hero: Medaillon ausgeblendet (X-85) */
.sksb-home-hero .sksb-hero-medaillon {
    display: none !important;
}
.sksb-home-hero .sksb-hero-medaillon--hidden {
    position: absolute;
    top: 28px;
    right: 36px;
    width: 90px;
    height: 90px;
    border: 2px solid var(--wp--preset--color--gold);
    border-radius: 50%;
    display: flex !important;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.15);
    backdrop-filter: blur(4px);
    z-index: 3;
    padding: 0 !important;
}
.sksb-home-hero .sksb-hero-medaillon p {
    margin: 0;
    padding: 0;
    text-align: center;
}
@media (max-width: 600px) {
    .sksb-home-hero .sksb-hero-medaillon { display: none !important; }
    .sksb-home-hero { min-height: 280px !important; }
    .sksb-home-hero h1 { font-size: 1.7rem !important; }
}

/* CTA-Cards: Ticker trennt Hero und Cards — kein negatives Margin mehr nötig */
.sksb-cta-cards-wrapper {
    position: relative;
    z-index: 1;
    /* Padding-bottom auf 0 — Ticker folgt direkt (Karten haben eigenen Innenabstand) */
    padding-bottom: 0 !important;
}

/* CTA-Karten: Innenabstand + Gap auf 2rem anheben → identisch mit Post-Raster und Außenspalten */
/* Ergebnis: alle 3 vertikalen Trennlinien fluchten exakt (card3=976px = sidebar=976px) */
@media (min-width: 601px) {
    .sksb-cta-cards.wp-block-columns {
        padding-left: 1rem;
        padding-right: 1rem;
        gap: 2rem !important;
    }
}

/* Außenspalten-Breiten an CTA-Raster (3 × 368px + 2 × 32px = 1168px) angleichen:
   col1 = 768px = 65.75%, col2 (Sidebar) = 368px = 31.51%
   Selector: Homepage-Post-Content → flow-Group → Columns */
@media (min-width: 782px) {
    .wp-block-post-content > .wp-block-group > .wp-block-columns > .wp-block-column:first-child {
        flex-basis: 65.75% !important;
    }
    .wp-block-post-content > .wp-block-group > .wp-block-columns > .wp-block-column:last-child {
        flex-basis: 31.51% !important;
    }
}

/* CTA-Card: Schatten + Hover-Lift */
.sksb-cta-card {
    box-shadow: 0 4px 20px rgba(0,0,0,.12);
    transition: transform .18s ease, box-shadow .18s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
}
.sksb-cta-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 28px rgba(0,0,0,.16);
}
/* Icon-Box kompakt — kein Hintergrund-Rahmen */
.sksb-cta-icon {
    display: inline-flex !important;
    width: fit-content;
    background-color: transparent !important;
    padding: 0 !important;
    border-radius: 0 !important;
}

/* X-85: CTA-Card Buttons — gefüllt (normal) / Outline (hover) */
.sksb-cta-card .wp-block-button__link {
    color: var(--wp--preset--color--surface) !important;
    background-color: var(--wp--preset--color--primary) !important;
    border-color: var(--wp--preset--color--primary) !important;
}
.sksb-cta-card .wp-block-button__link:hover,
.sksb-cta-card .wp-block-button__link:focus {
    color: var(--wp--preset--color--primary) !important;
    background-color: transparent !important;
    border-color: var(--wp--preset--color--primary) !important;
}

/* X-226 (2026-09-14): CTA-Karten der Startseite ~15 % flacher (Ist 277px -> Ziel ~235px, -42px).
   PO empfand die drei Kacheln (Kreismeisterschaften / Terminuebersicht / Rundenkaempfe) als zu hoch.
   NUR vertikale Abstaende reduziert — Schrift, Icon, Button, Inhalt, horizontales Padding und die
   kalibrierten Fluchtlinien bleiben unveraendert. Die Ausgangswerte stehen als Block-Attribute
   (inline-styles) bzw. als flow-blockGap (1.5rem) im DB-Template front-page (Post 2642), darum hier
   !important-Overrides im Theme-CSS statt Eingriff in den Seiteninhalt (Redaktions-Grenze gewahrt).
   Rechnung: padding-top/bottom 24->16 (-16) + p margin-top 24->14 (-10) + p margin-bottom 16->10 (-6)
   + buttons margin-top 24->14 (-10) = -42px. */
.sksb-cta-card {
    padding-top: 1rem !important;    /* war 1.5rem (24px) */
    padding-bottom: 1rem !important; /* war 1.5rem (24px) */
}
.sksb-cta-card > p {
    margin-top: 0.875rem !important;    /* war 1.5rem blockGap (24px) */
    margin-bottom: 0.625rem !important; /* war 1rem inline (16px) */
}
.sksb-cta-card > .wp-block-buttons {
    margin-top: 0.875rem !important;    /* war 1.5rem blockGap (24px) */
}

/* Mobile: horizontal Scroll mit Snap */
@media (max-width: 600px) {
    .sksb-cta-cards-wrapper {
        padding-left: 1rem !important;
        padding-right: 0 !important;
    }
    .sksb-cta-cards.wp-block-columns {
        display: flex !important;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 0.75rem !important;
        flex-wrap: nowrap !important;
        padding-right: 1rem;
        padding-bottom: 0.5rem;
        /* Scrollbar dezent */
        scrollbar-width: thin;
        scrollbar-color: var(--wp--preset--color--gold) var(--wp--preset--color--gold-light);
    }
    .sksb-cta-cards.wp-block-columns > .wp-block-column {
        flex: 0 0 80% !important;
        width: 80% !important;
        scroll-snap-align: start;
    }
}

/* Aktiver Nav-Eintrag in Gold */
.dsb-header-main .wp-block-navigation a[aria-current="page"],
.dsb-header-main .wp-block-navigation .current-menu-item > a,
.dsb-header-main .wp-block-navigation li.sk-active > a {
    color: var(--wp--preset--color--gold) !important;
    font-weight: 700;
}
.dsb-header-main .wp-block-navigation a[aria-current="page"]:hover {
    opacity: 0.85;
    color: var(--wp--preset--color--gold) !important;
}

/* Single-Post Content-Styles → nach dsb-single.css verschoben (v2.1.132) */

/* ================================================================
   19. PAGINATION TOP (sksb-pagination-top.php)
   the_posts_pagination() via Shortcode-Kontext bekommt <br>-Tags
   durch wpautop — diese ausblenden + flex horizontal erzwingen.
   ================================================================ */
.sk-pagination-top .nav-links {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.25rem;
    margin: 0 0 1rem;
}
.sk-pagination-top .nav-links br {
    display: none !important;
}
.sk-pagination-top .nav-links .page-numbers {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    text-decoration: none;
    color: var(--wp--preset--color--primary-dark);
    font-size: 0.9rem;
    font-weight: 500;
}
.sk-pagination-top .nav-links .page-numbers.current {
    background: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--surface);
    font-weight: 700;
}
.sk-pagination-top .nav-links .page-numbers:hover {
    background: var(--wp--preset--color--primary-light);
}




/* ================================================================
   9b. TAG-PILLS — sk-tag-l1/l2/l3/l4 + sk-disziplin-badge
   Gebraucht auf Archive- UND Single-Seiten.
   ================================================================ */
.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;
}

/* =================================================================
   Abstand zwischen Beitragsblock und Footer halbieren
   main padding-bottom 32px→16px + Block-Gap 24px→12px = 56px→28px
   ================================================================= */
main.wp-block-group {
    padding-bottom: 1rem !important; /* war 2rem */
}
.wp-site-blocks > .wp-block-template-part:last-child {
    margin-block-start: 12px !important;
}

/* =================================================================
   Sidebar rechts: Abstand zwischen Nächster-Termin und Pinwand halbieren
   Spacer (24px mt + 24px h) + sksb-pinned-wrap (24px mt) = 72px → 36px
   ================================================================= */
.wp-block-post-content .wp-block-column:last-child .wp-block-spacer {
    margin-top: 12px !important;
    height: 12px !important;
}
.wp-block-post-content .wp-block-column:last-child .sksb-pinned-wrap {
    margin-top: 12px !important;
}

/* =================================================================
   X-91b: "Aktuelles" H2 + Button als Mini-Header/Footer in grüner Box
   ROLLBACK: diesen CSS-Block + add_action X-91b in functions.php entfernen
   Box: padding=20px, border-radius=12px → negative Margins exakt angepasst
   ================================================================= */

.sk-news-box > h2 {
    /* Mini-Header: weißer Text, grüne Box, Radius oben wie Container */
    color: var(--wp--preset--color--surface) !important;
    text-align: center;
    font-size: 1rem !important;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding: 0.7rem 20px;
    margin: -20px -20px 20px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 12px 12px 0 0;
}

.sk-news-box > .wp-block-buttons {
    /* Mini-Footer: leicht abgedunkelt, Radius unten wie Container */
    margin: 16px -20px -20px !important;
    padding: 0.7rem 20px;
    background: rgba(0, 0, 0, 0.12);
    border-top: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 0 0 12px 12px;
    justify-content: center;
}

/* =================================================================
   X-91: SK News-Ticker (Homepage, [sk_ticker]-Shortcode)
   ================================================================= */

.sk-ticker-wrap {
    display: flex;
    align-items: center;
    background: var(--wp--preset--color--primary-dark, #162d0e);
    color: var(--sk-dm-text-ticker);
    height: 2.25rem;
    overflow: hidden;
    font-size: 0.82rem;
    letter-spacing: 0.01em;
    /* Auf Content-Breite begrenzen, zentriert */
    width: 100%;
    max-width: var(--global-content-width, 1200px);
    margin-inline: auto;
    border-radius: 0;
    /* Abstand nach oben zu den Karten */
    margin-block-start: 12px !important;
}

.sk-ticker-label {
    flex-shrink: 0;
    padding: 0 0.9rem;
    background: var(--wp--preset--color--primary, #2d6a1f);
    color: var(--wp--preset--color--surface);
    font-weight: 700;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    height: 100%;
    display: flex;
    align-items: center;
    white-space: nowrap;
}

.sk-ticker-overflow {
    flex: 1;
    overflow: hidden;
    position: relative;
    /* Soft fade-out rechts */
    mask-image: linear-gradient(to right, black 85%, transparent 100%);
    -webkit-mask-image: linear-gradient(to right, black 85%, transparent 100%);
}

.sk-ticker-track {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    padding-left: 2rem;
    animation: sk-ticker-scroll var(--sk-ticker-dur, 40s) linear infinite;
    will-change: transform;
}

.sk-ticker-track:hover,
.sk-ticker-wrap:hover .sk-ticker-track {
    animation-play-state: paused;
}

.sk-ticker-sep {
    padding: 0 1rem;
    opacity: 0.4;
}

.sk-ticker-track a {
    color: inherit;
    text-decoration: none;
    transition: color 0.15s;
}

.sk-ticker-track a:hover {
    color: var(--sk-dm-text-ticker-hover);
    text-decoration: underline;
}

@keyframes sk-ticker-scroll {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}


/* ================================================================
   MOBILE RESPONSIVE OVERRIDES (BF-mobile)
   ================================================================ */

@media (max-width: 768px) {
    /* PDF-Chips: grössere Touch-Targets */
    .sk-pdf-chips a {
        padding: 6px 10px !important;
        font-size: 0.82rem !important;
        min-height: 36px !important;
        align-items: center;
    }

    /* Kalender-Monats-Grid: kleinere Zellen auf Phone */
    .sksb-kal-day { min-height: 56px; padding: 2px; }
    .sksb-kal-daynum { font-size: 0.7rem; }
    .sksb-kal-event { font-size: 0.6rem; }

    /* Filter-Indikator: etwas kompakter */
    .sk-disziplin-filter-info { font-size: 0.8rem; padding: 0.4rem 0.6rem; }
}

@media (max-width: 480px) {
    /* Karussell-Karten: volle Breite statt Side-Scroll-Hinweis */
    .sk-karte-grid { grid-template-columns: 1fr !important; }

    /* Spalten-Layout immer einspaltig */
    .sk-wk-layout .wp-block-column:not(:first-child) { margin-top: 1rem; }

    /* Kalender-Grid: minmax(0,1fr) verhindert, dass Event-Texte
       einzelne Spalten ueber 1fr hinaus aufblaehen (schraeger Kalender) */
    .sksb-kal-grid,
    .sksb-kal-week,
    .sksb-kal-mini-grid {
        grid-template-columns: repeat(7, minmax(0, 1fr));
    }
    .sksb-kal-day,
    .sksb-kal-weekday,
    .sksb-kal-week-cell,
    .sksb-kal-week-hd,
    .sksb-kal-mini-day {
        min-width: 0;
        overflow: hidden;
    }
    .sksb-kal-event,
    .sksb-kal-week-event {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 100%;
    }
    .sksb-kal-weekday {
        font-size: 0.6rem;
        padding: 3px 0;
    }
}

/* ================================================================
   PREFERS-REDUCED-MOTION (WCAG 2.3.3 / Animation from Interactions)
   Deaktiviert alle Animationen und Transitions für Nutzer die
   weniger Bewegung bevorzugen (Gleichgewichtsstörungen, Epilepsie etc.)
   ================================================================ */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    /* Ticker anhalten */
    .sk-ticker-track {
        animation: none !important;
        /* Statisch: ersten Eintrag zeigen */
        overflow: hidden;
    }
    /* Karten-Hover-Lift deaktivieren */
    .sksb-post-card:hover,
    .sk-related-card:hover {
        transform: none !important;
    }
    /* Fokus-Outline sofort (kein Fade) */
    :focus-visible {
        transition: none !important;
    }
}


/* ================================================================
   PRINT STYLES — @media print
   Versteckt Navigation/Sidebar/Footer, optimiert für Druck.
   ================================================================ */
@media print {
    /* Nicht-Inhalt ausblenden */
    .dsb-topbar,
    .wp-block-navigation,
    .dsb-footer,
    .sk-sidebar,
    .dsb-sidebar,
    .sk-filter-bar,
    .sksb-kal-pagination,
    .sk-ticker-wrap,
    .sk-back-link,
    .sk-sort-wrap,
    .wp-block-buttons,
    .wp-block-search,
    .wp-block-query-pagination { display: none !important; }

    /* Lesbare Basis */
    body,
    body.sk-dark {
        background: #fff !important;
        color: #000 !important;
        font-size: 12pt;
        line-height: 1.5;
    }

    /* Überschriften */
    h1, h2, h3, h4, h5, h6 {
        color: #000 !important;
        page-break-after: avoid;
    }

    /* Links */
    a { color: #000 !important; text-decoration: underline; }
    .dsb-content-main a[href]:not([href^="#"]):not([href^="javascript:"])::after {
        content: " (" attr(href) ")";
        font-size: 0.75em;
        color: #555;
        word-break: break-all;
    }

    /* Bilder */
    img, figure {
        max-width: 100% !important;
        page-break-inside: avoid;
    }

    /* Cover-Block Hero nicht drucken */
    .sksb-home-hero,
    .wp-block-cover { display: none !important; }

    /* Content-Breite für Druck */
    .dsb-content-area,
    .dsb-content-main {
        max-width: 100% !important;
        padding: 0 !important;
    }

    /* Seitenumbruch vor Hauptabschnitten */
    h2 { page-break-before: auto; }
    .sk-related-section { page-break-before: always; }
}

/* ================================================================
   19. BLOCK STYLES (register_block_style)
   Stil-Varianten für Core-Blöcke — per is-style-* Klasse aktiv.
   ================================================================ */

/* core/image → Abgerundet */
.wp-block-image.is-style-rounded img {
    border-radius: 12px;
}
.wp-block-image.is-style-rounded figcaption {
    border-radius: 0 0 12px 12px;
}

/* core/quote → Akzent */
.wp-block-quote.is-style-accent {
    border-left: 4px solid var(--wp--preset--color--primary, #2d6a1f);
    padding-left: 1.25rem;
    font-style: normal;
}
.wp-block-quote.is-style-accent cite {
    color: var(--wp--preset--color--primary-dark, #1a4012);
    font-size: .875em;
}

/* Dark Mode */
body.sk-dark .wp-block-quote.is-style-accent {
    border-left-color: var(--wp--preset--color--primary-light, #5a9e45);
}
body.sk-dark .wp-block-quote.is-style-accent cite {
    color: var(--wp--preset--color--primary-light, #5a9e45);
}

