/* Minimal Gutenberg spacing helper */
.entry-content > .textbox-g1 {
  padding-left: 12rem;
  padding-right: 12rem;
}

/* Respect theme variable for flex layout gap (overrides core/global styles) */
:where(.is-layout-flex) {
  gap: var(--layout-flex-gap, 24px) !important;
}

/*
 * Einheitliche Gutenberg-Block-Abstände (--dx-block-gap)
 * WP .is-layout-flow > * setzt margin-block-start: 24px / end: 0 → neutralisieren.
 * Abstand nur zwischen Geschwistern (* + *), nie über margin-bottom der Typo.
 */
.entry-content :where(
  .wp-block-heading,
  .wp-block-paragraph,
  .wp-block-list,
  .wp-block-buttons,
  .wp-block-image,
  .wp-block-table,
  .wp-block-quote,
  .wp-block-separator
) {
  margin-block: 0;
}

/* Spalten, Gruppen, etc. */
.entry-content :where(.is-layout-flow, .is-layout-constrained) > * {
  margin-block: 0;
}

.entry-content :where(.is-layout-flow, .is-layout-constrained) > * + * {
  margin-block-start: var(--dx-block-gap);
}

/* Root-Ebene: jeder Inhaltsblock nach beliebigem Vorgänger (Spacer, alignfull, …) */
.entry-content > * + :where(
  .wp-block-heading,
  .wp-block-paragraph,
  .wp-block-list,
  .wp-block-buttons,
  .wp-block-image,
  .wp-block-table,
  .wp-block-quote,
  .wp-block-separator
) {
  margin-block-start: var(--dx-block-gap);
}

/* H6-Badge: mehr Abstand zum Folgeelement — wie im Hero (--h6-badge-margin-bottom) */
.entry-content :where(.is-layout-flow, .is-layout-constrained) > h6.wp-block-heading + *,
.entry-content > h6.wp-block-heading + * {
  margin-block-start: var(--h6-badge-margin-bottom);
}

@media (max-width: 1199.98px) {
  .entry-content > .textbox-g1 {
    padding-left: 4rem;
    padding-right: 4rem;
  }
}

@media (max-width: 767.98px) {
  .entry-content > .textbox-g1 {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

/* List blocks */
.entry-content .wp-block-list {
  padding-inline-start: 1.25em;
}

.entry-content .wp-block-list li {
  line-height: 1.65;
}

.entry-content .wp-block-list li::marker {
  color: var(--color-primary);
}

/* Minimal table styling */
.wp-block-table {
  width: 100%;
  overflow-x: auto;
  border: 1px solid rgb(var(--color-white-rgb) / 0.12);
  border-radius: 0.5rem;
}

.wp-block-table table {
  width: 100%;
  border-collapse: collapse;
}

.wp-block-table th,
.wp-block-table td {
  padding: 0.75rem 0.9rem;
  border-bottom: 1px solid rgb(var(--color-white-rgb) / 0.12);
  color: rgb(var(--color-white-rgb) / 0.94);
}

.wp-block-table thead th {
  background: rgb(var(--color-tertiary-rgb) / 0.82);
  color: rgb(var(--color-white-rgb) / 0.98);
}

.wp-block-table tbody tr:nth-child(even) {
  background: rgb(var(--color-white-rgb) / 0.04);
}

/* Ken Burns am figure.wp-block-image — Erweitert → Zusätzliche CSS-Klasse(n): `dx-ken-burns`
   (Alias: `--dx-ken-burns-duration` — nicht die CSS-Variable, nur Legacy-Klassenname im CMS) */
figure.dx-ken-burns,
.wp-block-image.dx-ken-burns,
figure.--dx-ken-burns-duration,
.wp-block-image.--dx-ken-burns-duration {
  display: block;
}

/*
 * Bild füllt die Spaltenhöhe (object-fit: cover)
 * Am Bild-Block (figure): Erweitert → Zusätzliche CSS-Klasse(n): `dx-cover-image`
 * Sinnvoll in Spalten (.wp-block-columns); die Spalte wird per :has() mitgestreckt.
 */
figure.wp-block-image.dx-cover-image,
.wp-block-image.dx-cover-image {
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
  max-width: none !important;
}

figure.wp-block-image.dx-cover-image img,
.wp-block-image.dx-cover-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.wp-block-columns.is-layout-flex > .wp-block-column:has(> figure.wp-block-image.dx-cover-image),
.wp-block-columns.is-layout-flex > .wp-block-column:has(> .wp-block-image.dx-cover-image) {
  display: flex;
  flex-direction: column;
  align-self: stretch;
  min-height: calc(var(--space-3xl) * 4.8);
}

.wp-block-columns.is-layout-flex > .wp-block-column > figure.wp-block-image.dx-cover-image,
.wp-block-columns.is-layout-flex > .wp-block-column > .wp-block-image.dx-cover-image {
  flex: 1 1 auto;
}

/* Utility: make a column shrink-to-fit its content on desktop
   Usage: add `is-fit-content` to the column's Advanced → Additional CSS class(es)
   Applies only on larger viewports to keep mobile stacks intact. */
@media (min-width: 991.98px) {
  /* Support two usage patterns:
     - Add `is-fit-content` to a single `.wp-block-column`
     - Add `is-fit-content` to the `.wp-block-columns` container to make all children shrink-to-fit */
  .wp-block-columns.is-layout-flex .wp-block-column.is-fit-content,
  .wp-block-columns.is-fit-content .wp-block-column {
    flex: 0 0 auto;
    width: auto;
    max-width: none;
    align-self: start;
  }
}

.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull):not(.dx-alignfull)) {
    max-width: 100%!important;
}