/* Helpers */
.tup-overlay {
  position: absolute;
  inset: 0;
}
.tup-overlay:focus-within {
  background: rgba(0, 0, 0, 0.5);
}

/* Spacing classes are emitted as Tailwind utilities (pt-6/pb-12/etc.)
   via the spacing_map in tienuur_paragraphs_preprocess_paragraph(). */

/* Background variants set via field_tup_background. The wrapper div spans full
   viewport width — the .tup-wrapper inside constrains the content width. */
.tup-background {
  width: 100%;
  /* Clip horizontal overflow caused by full-bleed breakout content
     (e.g. .tup-article-overlap__media using `margin-inline: calc(50% - 50vw)`).
     Without this, a vertical scrollbar makes 100vw exceed the body width
     by the scrollbar size and triggers a horizontal scrollbar. */
  overflow-x: clip;
}
.tup-background-light {
  background-color: var(--color-base-200);
}
.tup-background-dark {
  background-color: var(--color-neutral, #000);
  color: var(--color-neutral-content, #fff);
}
.tup-background-brand {
  background-color: var(--color-primary, #801c7f);
  color: var(--color-primary-content, #fff);
}

.paragraph--type--poster {
  color: #fff;
}

/* Block-paragraphs houden in principe de standaard 100px gap uit
   field--field-paragraphs. Uitzondering: de lijn-divider mag dichter op zijn
   buren staan (~50px). Daarom de negatieve marge ALLEEN op de lijn-divider
   scopen — niet op alle `--block`, want tussen twee aangrenzende block-
   paragraphs (bv. routelijn + nieuws-uitgelicht) telde die aan beide kanten
   mee en liet de gap volledig dichtklappen (100 − 50 − 50 = 0px). Met de
   marge enkel op de lijn-divider blijft de gap aan elke kant 100 − 50 = 50px. */
.tup-background--block:has(.tup-line-divider) {
  margin-block: -50px;
}