/* ==========================================================================
   Basis-Bausteine · Gestaltung der Blöcke
   --------------------------------------------------------------------------
   Nutzt die Presets des Themes „Basis“ (Farben, Abstände, Radien). Jeder
   Wert hat einen Ersatz, damit die Blöcke auch mit anderen Themes lesbar
   bleiben. Farbrollen: weiss, text, primaer, fehler; Feldrand über --feld-rand.
   ========================================================================== */

/* --- Kontaktformular ------------------------------------------------------ */
.basis-formular{
  display: grid;
  gap: var(--wp--preset--spacing--m, 1.25rem);
  max-inline-size: var(--wp--preset--dimension--formular, 40rem);
}
.basis-formular__feld{ display: grid; gap: var(--wp--preset--spacing--2xs, 0.3rem); }
.basis-formular label{ font-weight: 600; }
.basis-formular input[type="text"],
.basis-formular input[type="email"],
.basis-formular textarea{
  font: inherit;
  color: var(--wp--preset--color--text, inherit);
  background: var(--wp--preset--color--weiss, #fff);
  border: 1px solid var(--feld-rand, currentColor); /* WCAG 1.4.11: mind. 3:1 */
  border-radius: var(--wp--preset--border-radius--s, 0.5rem);
  padding: var(--wp--preset--spacing--xs, 0.6rem) var(--wp--preset--spacing--s, 0.9rem);
  min-block-size: 2.75rem;
}
.basis-formular textarea{ min-block-size: 10rem; resize: vertical; }
.basis-formular__check{ display: flex; gap: var(--wp--preset--spacing--xs, 0.6rem); align-items: flex-start; }
.basis-formular__check input{ inline-size: 1.5rem; block-size: 1.5rem; margin-block-start: 0.15em; flex: none; }
.basis-formular__check label{ font-weight: 400; }
.basis-formular__hinweis{ font-size: var(--wp--preset--font-size--klein, 0.9em); margin: 0; }
.basis-formular__fehlertext{ color: var(--wp--preset--color--fehler, #b3261e); font-weight: 600; margin: 0; }
.basis-formular [aria-invalid="true"]{ border-color: var(--wp--preset--color--fehler, #b3261e); border-width: 2px; }
.basis-formular__falle{ position: absolute; inset-inline-start: -10000px; inline-size: 1px; block-size: 1px; overflow: hidden; }
/* Button-Gestaltung kommt aus dem Theme (wp-element-button) */
.basis-formular button{ justify-self: start; border: 0; cursor: pointer; min-block-size: 2.75rem; }
.basis-meldung{
  border-inline-start: 0.375rem solid var(--wp--preset--color--primaer, currentColor);
  background: var(--wp--preset--color--weiss, #fff);
  padding: var(--wp--preset--spacing--s, 0.9rem) var(--wp--preset--spacing--m, 1.25rem);
  border-radius: var(--wp--preset--border-radius--s, 0.5rem);
}
.basis-meldung--fehler{ border-inline-start-color: var(--wp--preset--color--fehler, #b3261e); }
.basis-meldung :last-child{ margin-block-end: 0; }

/* --- Blogbeiträge ----------------------------------------------------------- */
.basis-meta{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--wp--preset--spacing--2xs, 0.3rem) var(--wp--preset--spacing--m, 1.25rem);
  font-size: var(--wp--preset--font-size--klein, 0.9em);
}
.basis-kurz{
  background: var(--wp--preset--color--weiss, #fff);
  border-inline-start: 0.375rem solid var(--wp--preset--color--primaer, currentColor);
  border-radius: var(--wp--preset--border-radius--s, 0.5rem);
  padding: var(--wp--preset--spacing--m, 1.25rem) var(--wp--preset--spacing--l, 1.75rem);
}
.basis-kurz h2{ font-size: var(--wp--preset--font-size--h4, 1.4em); margin-block-start: 0; }
.basis-toc{
  background: var(--wp--preset--color--weiss, #fff);
  border-radius: var(--wp--preset--border-radius--s, 0.5rem);
  padding: var(--wp--preset--spacing--s, 0.9rem) var(--wp--preset--spacing--l, 1.75rem);
}
.basis-toc summary{
  font-family: var(--wp--preset--font-family--akzent, inherit);
  font-weight: 500;
  cursor: pointer;
  min-block-size: 2.75rem;
  display: flex;
  align-items: center;
}
/* Überschrift des Inhaltsverzeichnisses aus einer Anbindung (z. B. SEO-Plugin), Optik wie summary. */
.basis-toc > :is(h2, h3, h4, h5, h6, p):first-child{
  font-family: var(--wp--preset--font-family--akzent, inherit);
  font-size: var(--wp--preset--font-size--text, 1em);
  font-weight: 500;
  margin-block: var(--wp--preset--spacing--s, 0.9rem) 0;
}
.basis-toc :is(ol, ul){ margin-block: var(--wp--preset--spacing--s, 0.9rem) 0; }
.basis-toc :is(ol, ul) :is(ol, ul){ margin-block: 0; }

@media print{
  .basis-toc{ display: none; }
}