/* BEYOND MY STORY auf Bricks – wird VOR basis.css und dem Seiten-Design geladen.
   Ziel: die Bricks-Ausgabe sieht exakt aus wie die statische Seite.

   1) Bricks liefert Grundstile (Überschriften, Links, Bilder, Listen …). Wo das Design nichts festlegt, hat die
      statische Seite die Browser-Standards benutzt – deshalb hier auf den Browser-Standard zurücksetzen („revert“).
      :where() = Spezifität 0: jede Regel aus dem Design gewinnt weiterhin. */
:where(html) { font-size: revert; line-height: revert; }
:where(body) { display: revert; flex-direction: revert; width: revert; background-color: revert; background-position: revert;
  font-family: revert; font-size: revert; font-weight: revert; line-height: revert; -moz-osx-font-smoothing: revert; }
:where(*, *::before, *::after) { border-color: revert; }
:where(::after, ::before) { outline: revert; }
:where(a) { color: revert; cursor: revert; text-decoration: revert; border-color: revert; }
:where(h1, h2, h3, h4, h5, h6) { margin: revert; font-size: revert; line-height: revert; text-rendering: revert; }
:where(h1, h2, h3, h4, h5, h6) :where(a) { color: revert; }
:where(p) { margin-block: revert; }
:where(small) { font-size: revert; }
:where(figure) { margin: revert; }
:where(figcaption) { color: revert; font-size: revert; margin: revert; text-align: revert; }
:where(img) { height: revert; max-width: revert; outline: revert; vertical-align: revert; border-style: revert; }
:where(button) { border: revert; cursor: revert; outline: revert; padding: revert; text-transform: revert; overflow: revert; }
:where(button) { font-family: revert; font-size: revert; line-height: revert; margin: revert; text-align: revert; }
:where(ul, ol) { padding: revert; margin: revert; }
:where(li) { margin: revert; }

/* Bricks gibt jedem SVG ohne width/height eine Mindestgröße von 1em – Logo und Play-Icons wären dann zu hoch */
svg:not([width]) { min-width: revert; }
svg:not([height]) { min-height: revert; }

/* 2) Bricks-Elementstile, die es auf der statischen Seite nicht gab */
:where(.brxe-text-link), :where(.brxe-text-link) span { display: revert; align-items: revert; gap: revert; justify-content: revert; }
:where([class*=brxe-]) { max-width: revert; }
:where(span[class*=brxe-]) { width: revert; }
:where(#brx-content) { flex: revert; position: revert; width: revert; }

/* 3) Bricks-Rahmen um Header/Footer und um den Rechtstext neutral: Layout allein aus dem Design */
#brx-header, #brx-footer { display: contents; }
.recht > .brxe-text { display: contents; }

/* 4) Eingeloggt (Adminleiste oben): fixierter Kopf und mobiles Menü darunter */
body.admin-bar .kopf { top: var(--wp-admin--admin-bar--height, 32px); }
body.admin-bar .menue { top: var(--wp-admin--admin-bar--height, 32px); }
@media (max-width: 600px) { body.admin-bar .kopf, body.admin-bar .menue { top: 0; } }