/* =========================================================
   Patterns & Gutenberg Styles
   ---------------------------------------------------------
   Globale Styles für Gutenberg-Blöcke und eigene Patterns
   ========================================================= */


/* ---------------------------------------------------------
   Standard-Gutter für normale Gutenberg-Blöcke
   ---------------------------------------------------------
   Alle direkten Kinder innerhalb von .entry-content bekommen
   den globalen Seitenabstand (Gutter). 
   Ausnahme: Blöcke mit .alignfull, da diese bewusst 
   über die komplette Breite gehen sollen.
--------------------------------------------------------- */
.entry-content > *:not(.alignfull) {
  position: relative;        /* verhindert Überlagerungsprobleme bei Layouts */
  z-index: 2;                /* sorgt dafür, dass Content über Hintergründen liegt */
  padding-inline: var(--gutter); /* global definierter Seitenabstand */
}


/* ---------------------------------------------------------
   Fullwidth-Blöcke (alignfull)
   ---------------------------------------------------------
   Gutenberg-Blöcke mit .alignfull sollen randlos sein und
   keinen Gutter erhalten.
--------------------------------------------------------- */
.entry-content > .alignfull {
  position: relative;
  z-index: 2;
  padding-inline: 0;
}


/* ---------------------------------------------------------
   Bildcontainer in Patterns
   ---------------------------------------------------------
   Entfernt das Standardmargin von figure-Elementen,
   damit Bilder exakt bündig im Layout sitzen.
--------------------------------------------------------- */
.cover-image-container figure{
  margin:0!important;
}


/* ---------------------------------------------------------
   Text-Bild Pattern Layout
   ---------------------------------------------------------
   Entfernt Abstand zwischen den Columns sowie den
   unteren Margin, um einen sauberen Edge-to-Edge
   Layoutblock zu erzeugen.
--------------------------------------------------------- */
.text-image-section {
    gap: 0 !important;       /* kein Abstand zwischen Spalten */
    margin-bottom: 0 !important; /* kein Abstand unterhalb des Blocks */
}


/* ---------------------------------------------------------
   Responsive Verhalten des Text-Bild Patterns
   ---------------------------------------------------------
   Gutenberg Columns stapeln standardmäßig erst sehr spät.
   Dieser Breakpoint sorgt dafür, dass die Spalten bereits
   bei <=1199px untereinander dargestellt werden.
--------------------------------------------------------- */
@media (max-width: 1199.98px) {

  /* Columns umbrechen lassen */
  .wp-block-columns.text-image-section {
    flex-wrap: wrap !important;
  }

  /* Jede Column nimmt volle Breite ein */
  .wp-block-columns.text-image-section > .wp-block-column {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}



/* =========================================================
   Accordion Styles (Gutenberg Core Block)
   ========================================================= */

.wp-block-accordion-item{border-radius:3rem;margin-bottom:1rem;overflow:hidden;background-color:#F5F5F5;}
.wp-block-accordion-item:nth-of-type(even){background-color:#e5e5e5;}

/* ---------------------------------------------------------
   Accordion Toggle Button
   ---------------------------------------------------------
   Grundstyling für den Accordion-Button:
   - Hintergrundfarbe
   - Schriftfarbe
   - Padding
   - Hover-Animation
--------------------------------------------------------- */
.wp-block-accordion button{
    padding: 1.5rem 2rem;                    /* Innenabstand für bessere Klickfläche */
    cursor: pointer;                         /* Mauszeiger als Hand */
    transition: all 0.3s ease;               /* sanfte Hover-Animation */
    font-size:1rem;
    font-weight:700;
}


/* ---------------------------------------------------------
   Accordion Hover Zustand
   ---------------------------------------------------------
   Farbwechsel beim Hover für bessere Interaktion.
--------------------------------------------------------- */
.wp-block-accordion button:hover{
    background-color: var(--color-primary);
    color:var(--color-white);
}

.wp-block-accordion-item.is-open button{
    background-color: var(--color-primary);
    color:var(--color-white);
}


.wp-block-accordion-heading{margin-bottom: 0;}
/* ---------------------------------------------------------
   Entfernt die Standard-Unterstreichung
   ---------------------------------------------------------
   WordPress setzt teilweise automatisch eine Unterstreichung
   auf den Accordion-Titel beim Hover.
   Diese Regel deaktiviert das Verhalten.
--------------------------------------------------------- */
.wp-block-accordion-heading__toggle:hover 
.wp-block-accordion-heading__toggle-title {
    text-decoration: none;
}


/* ---------------------------------------------------------
   Accordion Panel Animation
   ---------------------------------------------------------
   Panel ist standardmäßig geschlossen:
   - Höhe = 0
   - Inhalt verborgen
   - unsichtbar
--------------------------------------------------------- */
.wp-block-accordion-panel {
  max-height: 0;        /* Panel geschlossen */
  overflow: hidden;     /* verhindert sichtbaren Inhalt */
  opacity: 0;           /* unsichtbar */
  padding:2rem; /* optional: Innenabstand für den Inhalt */
  background:var(--color-white);
  transition:all 0.4s ease; /* sanfte Öffnungsanimation */

}

.wp-block-accordion-panel p:last-child{margin-bottom:0;} /* optional: entfernt unteren Margin vom letzten Absatz im Panel */

/* ---------------------------------------------------------
   Offenes Accordion Panel
   ---------------------------------------------------------
   Wird aktiv, wenn WordPress dem Item die Klasse
   .is-open hinzufügt.
--------------------------------------------------------- */
.wp-block-accordion-item.is-open .wp-block-accordion-panel {
  max-height: 10000px; /* maximale Höhe des Panels (bei Bedarf erhöhen) */
  opacity: 1;        /* sichtbar */
}





.wp-block-table table {
  width: 100%;
  border-collapse: collapse;
  background: var(--color-white);
  border-radius: 1rem;
  overflow: hidden;
}



.wp-block-table tbody td {
  padding: 1.5rem 2rem;
  vertical-align: top;
}
.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
  background: var(--color-white);
}
.wp-block-table tbody tr:nth-child(even) {
  background: var(--color-secondary);
}

.wp-block-table tbody td:first-child {
  font-weight: 700;
  color: var(--color-tertiary);
  width: 32%;
}

.wp-block-table tbody td:last-child {
  color: var(--color-text);
}
.wp-block-table.is-style-stripes{ border-bottom:0px;}