/* Contact Form 7: Felder auf volle Breite ziehen */
.wpcf7 form .wpcf7-text,
.wpcf7 form .wpcf7-email,
.wpcf7 form .wpcf7-tel,
.wpcf7 form .wpcf7-url,
.wpcf7 form .wpcf7-number,
.wpcf7 form .wpcf7-select,
.wpcf7 form textarea {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

/* Bildunterschriften mittig unter dem Bild anzeigen */
.wp-block-image figcaption,
figure.wp-caption figcaption,
.wp-caption-text,
.wp-block-image .wp-element-caption {
    text-align: center;     /* mittig */
    font-size: 0.85em;      /* etwas kleiner als der Text */
    color: #666666;         /* dezentes Grau */
    margin-top: 0.2em;      /* kleiner Abstand zum Bild */
    font-style: italic;     /* leicht hervorgehoben */
}

/* Weiterlesen-/Mehr-Link im gleichen Stil wie der Kommentar-Button */
.more-link,
.wp-block-post-excerpt__more-link,
.wp-block-read-more {
    display: block;
    width: fit-content;

    /* mehr Innenabstand = höherer, „fetter“ Button */
    padding: 1em 2.8em;

    border-radius: 100px;
    background-color: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--contrast-light) !important;

    /* größere Schrift wie beim Kommentar-Button */
    font-weight: 600;
    font-size: 1.1rem;

    text-decoration: none;
    clear: both;
    margin: 1rem auto 0;
}

/* OVERRIDE: Größe & Stil des "Weiterlesen"-Buttons */
.entry-content .more-link,
.entry-content .wp-block-post-excerpt__more-link,
.entry-content .wp-block-read-more {
    display: flex !important;          /* Block-Level, damit clear wirkt */
    align-items: center;
    justify-content: center;

    padding: 0.9rem 2.8rem !important; /* Button-Höhe/Breite */
    border-radius: 999px !important;

    clear: both !important;            /* immer UNTER alignleft/alignright */
    margin: 1.5rem auto 0 !important;  /* Abstand nach oben & zentriert */
    width: fit-content !important;
}


/* Textgröße des sichtbaren "Weiterlesen"-Labels */
.entry-content .more-link::before,
.entry-content .wp-block-post-excerpt__more-link::before,
.entry-content .wp-block-read-more::before {
    font-size: 1.1rem !important;
}

/* Hover/Fokus-Effekt passend zum Theme */
.more-link:hover,
.more-link:focus,
.wp-block-post-excerpt__more-link:hover,
.wp-block-post-excerpt__more-link:focus,
.wp-block-read-more:hover,
.wp-block-read-more:focus {
    background-color: var(--wp--preset--color--primary-hover);
    color: var(--wp--preset--color--contrast-light) !important;
}

/* Sichtbare Beschriftung des More-Buttons auf "Weiterlesen" ändern */
.more-link,
.wp-block-post-excerpt__more-link,
.wp-block-read-more {
    font-size: 0; /* Original-Text unsichtbar machen */
}

/* Neuer sichtbarer Text */
.more-link::before,
.wp-block-post-excerpt__more-link::before,
.wp-block-read-more::before {
    content: "Weiterlesen";
    font-size: 0.9rem;
    font-weight: 600;
}


/* 10px abgerundete Ecken für Bilder in Beiträgen und Seiten */
.entry-content img,
.page-content img,
.post-content img,
.wp-block-image img {
    border-radius: 10px;
}

/* Nur Smartphones/Tablets */
@media (max-width: 768px) {

  /* Podlove Web Player etwas schmaler und zentriert */
  .podlove-web-player,
  .podlove-web-player-container {
    max-width: 320px;
    margin-left: auto;
    margin-right: auto;
  }

  /* Bilder im Beitrag schmaler und zentriert */
  .wp-block-post-content img,
  .wp-block-post-content figure {
    max-width: 320px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
  }

  /* WICHTIG: ausgerichtete Bilder NICHT neben Text, sondern zentriert darüber */
  .wp-block-post-content .alignleft,
  .wp-block-post-content .alignright,
  .wp-block-post-content img[align="left"],
  .wp-block-post-content img[align="right"] {
    float: none !important;
    display: block !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 1em !important;
  }
}

/* Standard: Desktop – rechts, optisch max. 350px */
.podlove-episode-image-responsive {
    float: right;
    margin: 0 0 1em 1em;
    max-width: 350px;   /* sichtbare Größe */
    width: 100%;
    height: auto;
    border-radius: 25px;
}

/* Mobil: unter dem Titel, volle Breite */
@media (max-width: 768px) {
    .podlove-episode-image-responsive {
        float: none !important;         /* überschreibt evtl. übrige Styles */
        display: block;
        margin: 0 auto 1em auto;
        max-width: 100%;
        width: 100%;
        height: auto;
    }
}

/* Sidebar */
/* === Liste allgemein ===================================== */

.podlove-sidebar-episodes {
    list-style: none !important;
    margin: 0;
    padding: 0;
    text-align: left !important;
}

.podlove-sidebar-episodes li {
    list-style: none !important;
    margin: 0;
    padding: 0;
}

/* === Einzelne Episode ==================================== */

.podlove-sidebar-episode {
    margin: 0;
    padding: 0.4rem 0;
}

/* Trennlinie zwischen Episoden */
.podlove-sidebar-episode-separator {
    border: 0;
    border-top: 1px solid rgba(0,0,0,.2);
    margin: 0.25rem 0 0.45rem;
}

/* === Titel oben ========================================== */

.podlove-sidebar-episode-title {
    margin: 0 0 0.25rem;
    font-size: 0.9rem;
    line-height: 1.3;
}

.podlove-sidebar-episode-title a {
    text-decoration: none;
}

.podlove-sidebar-episode-title a:hover {
    text-decoration: underline;
}

/* === Bild + Meta darunter nebeneinander ================== */

.podlove-sidebar-episode-body {
    display: flex;
    align-items: flex-start;
    column-gap: 0.6rem;   /* STELLSCHRAUBE #1: Abstand zwischen Bild und Textblock */
}

/* Bild links */
.podlove-sidebar-episode-image {
    flex: 0 0 auto;
}

.podlove-sidebar-episode-image img {
    display: block;
    width: 80px;          /* STELLSCHRAUBE #2: Bildgröße (z.B. 70px / 90px) */
    height: auto;
    border-radius: 3px;
}

/* Meta rechts: Datum + Laufzeit untereinander */
.podlove-sidebar-episode-meta {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    row-gap: 0.12rem;     /* STELLSCHRAUBE #3: Abstand zwischen Datum- und Laufzeit-Zeile */
    font-size: 0.8rem;    /* STELLSCHRAUBE #4: Schriftgröße für Datum & Laufzeit */
    line-height: 1.3;
}

/* === Zeilen für Datum & Laufzeit ========================= */

.podlove-sidebar-episode-row {
    display: flex;
    align-items: center;  /* Icon & Text zentriert in der Zeile */
    gap: 0.2rem;          /* STELLSCHRAUBE #5: Abstand zwischen Icon und Text */
    margin: 0;
    flex-wrap: nowrap;
}

/* Icon-Container selbst */
.podlove-sidebar-episode-row i.podlove-icon-calendar,
.podlove-sidebar-episode-row i.podlove-icon-time {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    margin: 0;
    width: 1.1em;         /* STELLSCHRAUBE #6: Breite „Icon-Spalte“ (für gleichmäßige Ausrichtung) */
}

/* eigentliche Icons sitzen im ::before – hier Feinausrichtung */
.podlove-sidebar-episode-row i.podlove-icon-calendar::before,
.podlove-sidebar-episode-row i.podlove-icon-time::before {
    display: inline-block !important;
    line-height: 1 !important;
    margin: 0;
    vertical-align: middle;
    position: relative;
    top: 0.7em;          /* STELLSCHRAUBE #7: vertikale Feinausrichtung des Symbols
                             - höher:  z.B. 0.12em
                             - tiefer: z.B. 0.22em oder 0.24em */
}

/* Text (Datum / Laufzeit) */
.podlove-sidebar-episode-row time,
.podlove-sidebar-episode-row span {
    display: inline-block;
    margin: 0;
    white-space: nowrap;
}

/* === Sicherheitsnetz gegen Theme-Margins ================= */

.podlove-sidebar-episodes p,
.podlove-sidebar-episodes h4,
.podlove-sidebar-episodes time {
    margin: 0;
}

/*Archivseite*/
/* === Archiv-Seite ======================================== */

.podlove-archive {
    margin: 0;
    padding: 0;
}

.podlove-archive-episode {
    margin: 0;
    padding: 1rem 0;
}

.podlove-archive-episode-separator {
    border: 0;
    border-top: 1px solid rgba(0,0,0,.15);
    margin: 1rem 0;
}

/* Layout: Cover links, Text rechts */

.podlove-archive-episode-body {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;              /* STELLSCHRAUBE A: Abstand Cover ↔ Textblock */
    align-items: flex-start;
}

/* Cover */

.podlove-archive-episode-image {
    flex: 0 0 auto;
}

.podlove-archive-episode-image img {
    display: block;
    width: 220px;             /* STELLSCHRAUBE B: Bildgröße im Archiv */
    max-width: 100%;
    height: auto;
    border-radius: 4px;
}

/* Textblock rechts */

.podlove-archive-episode-meta {
    flex: 1 1 260px;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    font-size: 0.9rem;
    line-height: 1.4;
}

/* Titel */

.podlove-archive-episode-title {
    margin: 0 0 0.2rem;
    font-size: 1.2rem;
    line-height: 1.3;
}

.podlove-archive-episode-title a {
    text-decoration: none;
}

.podlove-archive-episode-title a:hover {
    text-decoration: underline;
}

/* Datum & Laufzeit – gleiche Icon-Logik wie Sidebar */

.podlove-archive-episode-row {
    display: flex;
    align-items: center;
    gap: 0.2rem;              /* STELLSCHRAUBE C: Abstand Icon ↔ Text */
    margin: 0;
    flex-wrap: nowrap;
}

.podlove-archive-episode-row i.podlove-icon-calendar,
.podlove-archive-episode-row i.podlove-icon-time {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    margin: 0;
    width: 1.1em;
}

/* ggf. an deine Sidebar-Werte anpassen */
.podlove-archive-episode-row i.podlove-icon-calendar::before,
.podlove-archive-episode-row i.podlove-icon-time::before {
    display: inline-block !important;
    line-height: 1 !important;
    margin: 0;
    vertical-align: middle;
    position: relative;
    top: 0em;               /* STELLSCHRAUBE D: vertikale Feinausrichtung */
}

.podlove-archive-episode-row time,
.podlove-archive-episode-row span {
    display: inline-block;
    margin: 0;
    white-space: nowrap;
}

/* Beschreibung / Teaser (300 Zeichen im Template) */

.podlove-archive-episode-description {
    margin: 0.6rem 0 0.4rem;
    font-size: 0.9rem;
}

/* Buttons: Zur Folge + MP3 herunterladen
   Design kommt vom Theme über wp-block-button__link / wp-element-button */

.podlove-archive-episode-actions {
    margin-top: 0.2rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;              /* STELLSCHRAUBE E: Abstand zwischen den Buttons */
}

.podlove-archive-episode-button {
    display: inline-block;    /* nur Layout, kein eigenes Styling */
}

/* Sicherheitsnetz */

.podlove-archive p,
.podlove-archive h2,
.podlove-archive time {
    margin: 0;
}

/* ==== 1. GUTENBERG-GALERIEN (Galerie-Block) ==================== */

/* Galerie-Block als flexibles Raster */
.entry-content .wp-block-gallery,
.wp-block-post-content .wp-block-gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

/* ältere Markup-Variante mit .blocks-gallery-grid */
.entry-content .wp-block-gallery .blocks-gallery-grid,
.wp-block-post-content .wp-block-gallery .blocks-gallery-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Items neutralisieren */
.entry-content .wp-block-gallery .blocks-gallery-item,
.wp-block-post-content .wp-block-gallery .blocks-gallery-item,
.entry-content .wp-block-gallery > figure,
.wp-block-post-content .wp-block-gallery > figure {
    margin: 0;
}

/* Desktop/Tablet: 2 Spalten */
@media (min-width: 600px) {
    .entry-content .wp-block-gallery.columns-2 .blocks-gallery-item,
    .wp-block-post-content .wp-block-gallery.columns-2 .blocks-gallery-item,
    .entry-content .wp-block-gallery.columns-2 > figure,
    .wp-block-post-content .wp-block-gallery.columns-2 > figure {
        width: calc(50% - 0.75rem);
    }
}

/* Mobil: 1 Spalte untereinander */
@media (max-width: 599.98px) {
    .entry-content .wp-block-gallery .blocks-gallery-item,
    .wp-block-post-content .wp-block-gallery .blocks-gallery-item,
    .entry-content .wp-block-gallery > figure,
    .wp-block-post-content .wp-block-gallery > figure {
        width: 100%;
    }
}

/* ==== 1. GUTENBERG-GALERIEN (Galerie-Block) ==================== */

/* Galerie-Block als flexibles Raster */
.entry-content .wp-block-gallery,
.wp-block-post-content .wp-block-gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

/* ältere Markup-Variante mit .blocks-gallery-grid */
.entry-content .wp-block-gallery .blocks-gallery-grid,
.wp-block-post-content .wp-block-gallery .blocks-gallery-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Items neutralisieren */
.entry-content .wp-block-gallery .blocks-gallery-item,
.wp-block-post-content .wp-block-gallery .blocks-gallery-item,
.entry-content .wp-block-gallery > figure,
.wp-block-post-content .wp-block-gallery > figure {
    margin: 0;
}

/* Desktop/Tablet: 2 Spalten */
@media (min-width: 600px) {
    .entry-content .wp-block-gallery.columns-2 .blocks-gallery-item,
    .wp-block-post-content .wp-block-gallery.columns-2 .blocks-gallery-item,
    .entry-content .wp-block-gallery.columns-2 > figure,
    .wp-block-post-content .wp-block-gallery.columns-2 > figure {
        width: calc(50% - 0.75rem);
    }
}

/* Mobil: 1 Spalte untereinander */
@media (max-width: 599.98px) {
    .entry-content .wp-block-gallery .blocks-gallery-item,
    .wp-block-post-content .wp-block-gallery .blocks-gallery-item,
    .entry-content .wp-block-gallery > figure,
    .wp-block-post-content .wp-block-gallery > figure {
        width: 100%;
    }
}

/* =========================================
   A) Einzelbilder im Inhalt „layout-sicher“
   ========================================= */

/* Bilder in Beiträgen/Seiten niemals breiter als der Inhaltsbereich,
   aber Podlove-Episodenbild ausnehmen */
.wp-block-post-content img:not(.podlove-episode-image-responsive),
.entry-content img:not(.podlove-episode-image-responsive),
.wp-block-image img:not(.podlove-episode-image-responsive),
.single .entry-content img:not(.podlove-episode-image-responsive),
.page .entry-content img:not(.podlove-episode-image-responsive) {
    max-width: 100% !important;  /* nicht aus dem Content herauslaufen */
    width: auto !important;      /* kleine Bilder nicht aufblähen */
    height: auto !important;
}


/* Gutenberg-Alignments "volle Breite" / "weite Breite" entschärfen */
.wp-block-post-content .wp-block-image.alignfull,
.wp-block-post-content .wp-block-image.alignwide,
.entry-content .wp-block-image.alignfull,
.entry-content .wp-block-image.alignwide,
.wp-site-blocks .alignfull,
.wp-site-blocks .alignwide {
    max-width: 100% !important;
    width: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* =========================================
   B) Galerien: 2 Spalten, zentriert, Caption
   ========================================= */

/* Standard: 1 Spalte auf kleinen Screens */
.entry-content .wp-block-gallery,
.wp-block-post-content .wp-block-gallery,
.entry-content .wp-block-gallery .blocks-gallery-grid,
.wp-block-post-content .wp-block-gallery .blocks-gallery-grid,
.entry-content .gallery,
.wp-block-post-content .gallery {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 1.5rem 1.5rem;   /* Abstand zwischen den Bildern */
    margin: 0;
    padding: 0;
    justify-content: center;        /* gesamte Galerie mittig im Container */
}

/* Ab ~Tablet-Breite: 2 Spalten nebeneinander, zentriert */
@media (min-width: 700px) {
    .entry-content .wp-block-gallery,
    .wp-block-post-content .wp-block-gallery,
    .entry-content .wp-block-gallery .blocks-gallery-grid,
    .wp-block-post-content .wp-block-gallery .blocks-gallery-grid,
    .entry-content .gallery,
    .wp-block-post-content .gallery {
        /* maximale Breite einer Spalte, passt sich der Contentbreite an */
        grid-template-columns: repeat(2, minmax(0, 420px));
    }
}


/* Galerie-Items nutzen einfach ihre Zelle */
.entry-content .wp-block-gallery .blocks-gallery-item,
.wp-block-post-content .wp-block-gallery .blocks-gallery-item,
.entry-content .wp-block-gallery > figure,
.wp-block-post-content .wp-block-gallery > figure,
.entry-content .gallery .gallery-item,
.wp-block-post-content .gallery .gallery-item {
    margin: 0;
}

/* Bilder füllen die Spalte, aber laufen nicht über */
.entry-content .wp-block-gallery img,
.wp-block-post-content .wp-block-gallery img,
.entry-content .gallery img,
.wp-block-post-content .gallery img {
    display: block;
    width: 100% !important;   /* in Galerien wieder volle Kachelbreite */
    height: auto;
}

/* Caption direkt unter dem eigenen Bild, mittig */
.entry-content .wp-block-gallery figcaption,
.wp-block-post-content .wp-block-gallery figcaption,
.entry-content .gallery .gallery-caption,
.wp-block-post-content .gallery .gallery-caption {
    text-align: center;
    margin-top: 0.4rem;
}
/* Waymark-Karten immer unter links/rechts schwebenden Bildern anzeigen */
.entry-content .waymark-shortcode,
.entry-content .waymark-map,
.entry-content .waymark-map-container {
    clear: both;
    margin-top: 1rem;
}
