@charset "UTF-8";
/* ==========================================================================
   SCHAMLOS — Real Cookie Banner im Marken-Design
   ==========================================================================

   Wird NUR auf den neuen, plugin-gerenderten Seiten geladen (Startseite,
   Event-Landingpages, Tickets-Übergangsseite, Impressum/Datenschutzerklärung)
   — siehe sed_is_new_design_page() in schamlos-event-design.php. Auf den
   Rechtstext-Seiten ist der Banner selbst per Real-Cookie-Banner-Konfiguration
   ausgeblendet; die Styles hier greifen dort also erst, wenn der Dialog über
   den Footer-Link "Cookie-Einstellungen" wieder geöffnet wird.
   Auf den verbliebenen alten Elementor-Seiten bleibt der
   Standard-Look des Plugins damit unverändert, bis diese Seiten im Rahmen des
   Aufräum-Schritts entfernt werden. Deshalb brauchen die Selektoren hier auch
   KEINEN zusätzlichen Seiten-Anker (body.single-event o. ä.): die Trennung
   passiert bereits beim Einbinden in PHP, an genau einer Stelle.

   ---------------------------------------------------------------------------
   WIE DIESE SELEKTOREN ERMITTELT WURDEN (Recherche, nicht geraten)
   ---------------------------------------------------------------------------
   Real Cookie Banner liefert für den Consent-Dialog KEINE CSS-Datei und KEINE
   dokumentierten CSS-Custom-Properties zum Überschreiben mit (geprüft: in
   public/dist/ existiert nur admin.css + customize.css, beides reine
   Backend-Styles). Der Dialog wird von React über die hauseigene
   "pure-css"-Bibliothek gestylt, die zur Laufzeit ein <style>-Element erzeugt.
   Die dort generierten Klassennamen sind zufällig (4-Zeichen-Präfix + Zähler,
   z. B. ".a7f3-12") und damit als Angriffspunkt unbrauchbar — ebenso die ID
   des Container-Divs, die pro Seitenaufruf eine neue UUID4 ist
   (inc/view/Banner.php, printOverlay()).

   Nutzbar ist stattdessen ein zweiter, SPRECHENDER Klassenname, den dieselbe
   Bibliothek zusätzlich an jedes Element hängt: jede Style-Regel wird intern
   mit einer "classNames"-Angabe deklariert (z. B. classNames:"body-container"),
   die vor der Ausgabe mit dem Präfix "rcb-" versehen wird. Im DOM steht also
   z. B. class="a7f3-12 rcb-body-container". Diese Namen sind hier direkt aus
   den ausgelieferten Bundles gelesen (banner-lite-banner-ui.lite.js,
   banner-lite-banner-common-async.lite.js) und nicht aus einer Doku geraten.

   Zwei Einschränkungen, die man kennen muss:

   1) Die serverseitig gerenderten Klassen "rcb-banner rcb-banner-dialog" aus
      Banner.php taugen NICHT als Anker: sobald das Banner-JS startet, wird das
      class-Attribut dieses Containers komplett durch die generierte
      Stylesheet-Klasse ersetzt. Als stabiler Vorfahre dient hier deshalb das
      native <dialog>-Element mit der Klasse .rcb-align.

   2) Wenn in Real Cookie Banner die Einstellung "Anti-Ad-Blocker" (Pro)
      eingeschaltet wird, entfernt das Plugin die sprechenden rcb-*-Klassen
      absichtlich aus dem DOM — dann greift diese Datei nicht mehr. Sie ist in
      der Free-Version standardmäßig aus. Falls das Design also eines Tages
      schlagartig verschwindet: dort zuerst nachsehen.

   ---------------------------------------------------------------------------
   WARUM .rcb-align ALS VORFAHRE VOR JEDEM SELEKTOR STEHT
   ---------------------------------------------------------------------------
   Nicht zur Einschränkung, sondern wegen der Spezifität: Real Cookie Banner
   hängt sein <style>-Element zur Laufzeit per JS an den <head> an, also NACH
   dieser Datei. Bei gleicher Spezifität (beides eine einzelne Klasse) würde
   deshalb immer das Plugin gewinnen. Der zusätzliche Vorfahre hebt jede Regel
   hier auf zwei Klassen (0,2,0) und schlägt damit die Plugin-Regel (0,1,0) —
   ohne ein einziges !important. Gleiches Prinzip wie bei den bestehenden
   Theme-Overrides in design-system.css, nur sauberer lösbar.

   ---------------------------------------------------------------------------
   WARUM TROTZDEM AN VIELEN STELLEN !important STEHT
   ---------------------------------------------------------------------------
   Der Zwei-Klassen-Trick von oben reicht seit Real Cookie Banner 5.2.28 nicht
   mehr. Das Plugin schreibt inzwischen JEDE erzeugte Regel in vier
   Selektor-Varianten gleichzeitig, darunter "#<uuid> .a7f3-12" — mit der
   pageRequestUuid4 des Containers als Vorfahre. Diese Variante hat Spezifität
   1-1-0 und schlägt damit die 0-2-0 aller Regeln hier, unabhängig davon,
   wie viele Klassen man noch davorhängt. Ohne eine ID im eigenen Selektor
   (die es nicht gibt, sie wechselt bei jedem Seitenaufruf) bleibt nur
   !important.

   Verschärfend kommt dazu: auf mehreren Elementen setzt das Plugin
   "all:unset" — bei .rcb-headline, .rcb-teaching, allen vier Buttons,
   .rcb-group-inner, .rcb-dotted-groups und .rcb-accordion-button. Diese eine
   Kurzschrift überschreibt auf 1-1-0 buchstäblich jede Eigenschaft, also auch
   solche, die das Plugin gar nicht bewusst setzt (width, margin,
   font-family, line-height). Auf diesen Elementen verliert deshalb
   ausnahmslos alles.

   !important steht hier GENAU dort, wo eine Eigenschaft nachweislich
   verliert — nicht pauschal über der Datei. Ermittelt wurde das nicht
   überschlagen, sondern am laufenden Banner nachgemessen (Stand 15.08.2026,
   RCB 5.2.28): Selektoren aus document.styleSheets ausgelesen und Soll gegen
   getComputedStyle gestellt.

   Was ohne !important durchkommt, bleibt bewusst ohne — das Plugin setzt die
   Eigenschaft dort schlicht nicht:
     .rcb-inner        background, transform, position, max-height (die
                       deckelt das Plugin auf .rcb-content, nicht hier)
     .rcb-content      border-radius
     .rcb-description  color (der Text in > p erbt sie über all:unset)
     .rcb-inner::before  alles — Pseudo-Elemente treffen die Plugin-Selektoren
                         überhaupt nicht

   Zwei Regeln bekommen bewusst KEIN !important, weil sie nicht an der
   Spezifität scheitern, sondern am Ziel: siehe die Hinweise bei
   .rcb-teaching-separator (Abschnitt 3) und .rcb-group-button-item
   (Abschnitt 6). Dort würde !important nichts ändern.

   Beim nächsten RCB-Update lohnt die Gegenprobe: erzeugt das Plugin die
   ID-Variante nicht mehr, können die !important hier wieder raus. Prüfen
   lässt sich das in der Konsole mit
     [...document.styleSheets].flatMap(s=>[...s.cssRules])
       .filter(r=>/^#[a-f0-9-]{20,}/.test(r.selectorText||''))
   — kommt da nichts mehr zurück, ist der Grund für diese Datei entfallen.

   ---------------------------------------------------------------------------
   FARBEN
   ---------------------------------------------------------------------------
   Bewusst EIGENE Werte, nicht die --sed-*-Palette aus design-system.css: das
   abgestimmte Banner-Mockup nutzt einen eigenen, dunkleren Aubergine-Ton und
   abweichende Akzente. Die Werte stehen als --sed-cb-* Variablen unten, damit
   sie an einer Stelle pflegbar sind, ohne die globale Palette zu berühren.
   ========================================================================== */

:root{
  --sed-cb-bg:#26132A;          /* Dialog-Hintergrund, dunkles Aubergine */
  --sed-cb-border:#F3ECDC;      /* Creme, Rahmen + Label-Etikett          */
  --sed-cb-headline:#F9E9D9;    /* Überschrift                            */
  --sed-cb-text:#D9C9CE;        /* Beschreibungstext                      */
  --sed-cb-text-quiet:#B8A8AE;  /* tertiärer Link / Fußzeile              */
  --sed-cb-primary:#E8557A;     /* "Alle akzeptieren", Flächenfarbe       */
  --sed-cb-primary-ink:#3A0E1C; /* Schrift auf der Primärfläche           */
  --sed-cb-accent:#57D9D4;      /* Rahmen "Nur notwendige"                */
  --sed-cb-accent-ink:#9CF0EC;  /* Schrift "Nur notwendige"               */
  --sed-cb-radius:18px;         /* Eckenradius der Box                    */
  --sed-cb-pad:1.75rem;         /* Innenabstand der Box                   */
}

/* --------------------------------------------------------------------------
   1) Die Dialog-Box selbst (.rcb-inner)
   --------------------------------------------------------------------------
   overflow:visible ist hier KEIN Schönheitsfehler, sondern Voraussetzung:
   das Plugin setzt auf diesem Element overflow:hidden, was das Label-Etikett
   (::before, sitzt bewusst über der Oberkante) abschneiden würde. Weil die
   Box selbst nicht scrollt — gescrollt wird eine Ebene tiefer in
   .rcb-content, das sein eigenes overflow:auto mitbringt — ist das gefahrlos.
   Die Ecken der Kopf-/Fußzeile werden weiter unten separat gerundet, da sie
   ohne das Clipping sonst über den Rahmen hinausstehen würden.

   Die leichte Drehung ist Teil der Markensprache ("ungefähr"-Look, vgl. die
   gekippten Karten auf der Startseite). 0.6deg ist bewusst so klein gewählt,
   dass auf Mobile keine horizontale Scrollbar entsteht.
   -------------------------------------------------------------------------- */
/* !important auf genau den Eigenschaften, die das Plugin auf .rcb-inner selbst
   setzt und über "#<uuid> .rcb-inner" gewinnt (nachgemessen): overflow (stand
   auf hidden und hat das Etikett unten abgeschnitten), border-top/-bottom
   (border-left/-right kamen durch — daher der halbe Rahmen), border-radius,
   font-family und box-shadow. background, transform und position setzt das
   Plugin hier NICHT, die kommen ohne durch und bleiben deshalb schlicht. */

/* max-height gegen ein Abschneiden der Etikett-Oberkante auf niedrigen
   Viewports. Ursache ist eine Rechnung des Plugins, die unseren Rahmen nicht
   kennt: RCB deckelt .rcb-content auf calc(100vh - 20px) — das sind genau die
   10px Außenabstand, die es .rcb-inner oben und unten gibt. Die 3px Rahmen,
   die wir oben ergänzen, stehen in dieser Rechnung nicht drin. Die Box wird
   dadurch 100vh - 14px hoch und mitsamt Außenabstand 100vh + 6px, überläuft
   den Dialog also um konstant 6px, sobald der Deckel greift (nachgemessen bei
   1280x720: 700px content + 6px Rahmen = 706px Box, mit Abstand 726px in
   einem 720px hohen Dialog).

   Der Dialog ist display:flex mit align-items:center. Bei Überlauf eines
   zentrierten Flex-Containers landet die Hälfte am Blockanfang und ist laut
   Spezifikation nicht erreichbar, auch nicht durch Scrollen. Über der Box
   blieben so ~7px; das gedrehte Etikett braucht aber ~21px (11px Versatz nach
   oben plus ~10px, um die seine -2.4deg-Drehung das rechte Ende anhebt).
   Ergebnis war eine abgeschnittene Oberkante auf jeder Viewporthöhe unter
   ~726px — also auf so ziemlich jedem Laptop.

   Die 56px lösen das an der Ursache statt am Symptom: Box höchstens
   100% - 56px, mit den 20px Außenabstand 100% - 36px. Es bleiben 36px frei,
   zentriert 18px oben, plus 10px Abstand = 28px über der Box. Deckt die ~21px
   des Etiketts mit ~7px Reserve, auf beiden Banner-Ebenen nachgemessen.

   Greift ausschließlich bei Platzmangel: ist der Viewport hoch genug, bleibt
   die Box ohnehin unter dem Deckel und die Zentrierung ist unverändert. Kein
   !important nötig — das Plugin setzt max-height auf .rcb-content, nicht hier
   (nachgemessen). Gescrollt wird weiterhin eine Ebene tiefer in .rcb-content,
   das dafür sein eigenes overflow:auto samt klebender Kopf- und Fußzeile
   mitbringt. */
.rcb-align .rcb-inner{
  position:relative;
  overflow:visible !important;
  max-height:calc(100% - 56px);
  background:var(--sed-cb-bg);
  border:3px solid var(--sed-cb-border) !important;
  border-radius:var(--sed-cb-radius) !important;
  transform:rotate(-0.6deg);
  font-family:'Plus Jakarta Sans', sans-serif !important;
  box-shadow:0 18px 50px rgba(0,0,0,0.45) !important;
}

/* Label-Etikett "Nur das Nötigste, versprochen".
   Real Cookie Banner bietet für ein solches Etikett kein eigenes Element und
   keinen Textbaustein an — es entsteht deshalb als ::before auf der Box.
   Das ist rein dekorativ (nicht selektierbar, für Screenreader unsichtbar);
   inhaltlich Relevantes gehört weiterhin in die Banner-Texte im wp-admin.

   Rotation -2.4deg statt der im Mockup notierten -3deg: das Etikett sitzt
   IN der bereits um -0.6deg gedrehten Box und erbt deren Drehung, die beiden
   Winkel addieren sich also. -2.4deg + -0.6deg ergibt die gewünschten -3deg
   gegenüber der Seite.

   z-index:10 statt der ursprünglichen 2, sonst übermalt die Kopfzeile das
   Etikett von unten: .rcb-inner öffnet über sein transform einen Stacking
   Context, .rcb-content dazwischen aber nicht (nur position:relative und
   z-index:auto, kein transform/filter/isolation). Die z-index:9 der
   .rcb-header-container wird dadurch direkt gegen dieses Pseudo-Element
   aufgelöst und gewinnt — und weil die Kopfzeile klebt und ihren Hintergrund
   deckend in exakt der Boxfarbe malt, verschwanden die unteren ~8px der 22px
   hohen Fahne. Das sah aus wie ein sauberer Schnitt an der Boxkante, war aber
   Überdeckung, kein Clipping: entsprechend hätte auch kein weiteres
   overflow:visible daran etwas geändert. 10 reicht dauerhaft — höher liegt
   innerhalb von .rcb-inner nichts (Fußzeile und .rcb-tb-right stehen auf 1).
   Beim nächsten RCB-Update lohnt die Gegenprobe, ob die Kopfzeile noch auf 9
   steht. */
.rcb-align .rcb-inner::before{
  content:"Nur das Nötigste, versprochen";
  position:absolute;
  top:-11px;
  left:18px;
  z-index:10;
  padding:4px 10px;
  background:var(--sed-cb-border);
  color:var(--sed-cb-bg);
  border:0;
  border-radius:0;
  font-family:'IBM Plex Mono', monospace;
  font-size:12px;
  font-weight:700;
  line-height:1.2;
  letter-spacing:0.05em;
  text-transform:uppercase;
  white-space:nowrap;
  transform:rotate(-2.4deg);
  transform-origin:left center;
}

/* Der Vollbild-Overlay hinter dem Dialog. Nur leicht nachgedunkelt, damit die
   Seite dahinter erkennbar bleibt — Deckkraft und Farbe kommen sonst aus den
   Customizer-Einstellungen, auf die wir hier keinen Zugriff haben.

   ACHTUNG, diese Regel läuft derzeit ins Leere und bekommt deshalb bewusst
   KEIN !important — das würde nichts ändern. In RCB 5.2.28 existiert gar kein
   Element mit der Klasse .rcb-bann3r mehr: der Dialog ist ein natives
   <dialog>, das Abdunkeln übernimmt dessen ::backdrop. Die Komponente hinter
   classNames:"bann3r" wird in dieser Konfiguration nicht gerendert (im DOM
   nachgesehen, nicht nur im Bundle).

   Wer das Overlay wirklich einfärben will, muss ans ::backdrop des <dialog>
   — das ist aber eine eigene Entscheidung samt Abstimmung mit den
   Customizer-Werten und gehört nicht in diesen Spezifitäts-Durchgang. Regel
   bleibt vorerst unverändert stehen, damit klar bleibt, was hier mal
   beabsichtigt war. */
.rcb-bann3r{
  background:rgba(18,10,23,0.72);
}

/* --------------------------------------------------------------------------
   2) Kopf-, Körper- und Fußbereich
   --------------------------------------------------------------------------
   Das Plugin setzt Hintergrund UND die äußeren Rahmenkanten der Box nicht auf
   .rcb-inner, sondern verteilt auf diese drei Container (Kopf trägt oben/
   links/rechts, Körper links/rechts, Fuß unten/links/rechts). Da der Rahmen
   jetzt geschlossen auf .rcb-inner liegt, müssen die Teilrahmen hier weg —
   sonst läge eine zweite Linie daneben.

   Der Hintergrund bleibt bewusst auf allen drei Containern gesetzt (statt nur
   auf .rcb-inner): Kopf- und Fußzeile sind position:sticky, durchsichtig
   würde beim Scrollen der Text darunter durchscheinen.
   -------------------------------------------------------------------------- */
/* Beides mit !important, weil das Plugin beides über "#<uuid> ..." setzt:
   background auf allen drei Containern (gemessen kam hier bis zuletzt das
   helle Standard-Weiß durch — das war der auffälligste Fehler) und die
   Teilrahmen als border-left/-right/-top bzw. -bottom.

   Beim Rahmen ist das eine Absicherung: die Rahmenstärke des Plugins steht
   im Customizer aktuell auf 0, deshalb war border:0 hier bisher folgenlos.
   Es hat aber trotzdem verloren — sobald jemand im Customizer eine
   Rahmenstärke einträgt, läge ohne !important sofort eine zweite Linie neben
   dem geschlossenen Rahmen auf .rcb-inner. */
.rcb-align .rcb-header-container,
.rcb-align .rcb-body-container,
.rcb-align .rcb-footer-container{
  background:var(--sed-cb-bg) !important;
  border:0 !important;
}

/* 15px = 18px Außenradius minus 3px Rahmenstärke: so folgt die Innenkante der
   Container exakt der Rundung des Rahmens (nötig, seit .rcb-inner nicht mehr
   clippt, siehe oben).

   Aufbau zur Einordnung (aus dem Bundle gelesen, banner-lite-banner-ui.lite.js):
   .rcb-inner  >  .rcb-content  >  [ .rcb-header-container, .rcb-body-container,
   .rcb-footer-container ]. .rcb-content ist der Scroll-Container
   (overflow:auto), Kopf- und Fußzeile sind darin position:sticky — deshalb
   bekommt auch er dieselbe Rundung, sonst könnte eine Scrollleiste bei langem
   Text über die abgerundete Rahmenecke hinausragen. */
.rcb-align .rcb-content{
  border-radius:15px;
}

/* Radien und padding mit !important: das Plugin legt auf Kopf- und Fußzeile
   zusätzlich ein eigenes Rahmen-/Radius-Paket (headerBorderStyle bzw.
   footerBorderStyle, im Bundle nachgelesen und im DOM bestätigt) und setzt
   dort auch border-top-left-radius & Co. Gemessen kamen statt der 15px die
   3px des Plugins an — die Ecken folgten dem Rahmen also nicht.

   Beim padding gewinnt das Plugin nur eine Kante (padding-bottom in der
   Kopfzeile, padding-top in der Fußzeile; die übrigen Kanten schreibt es
   leer und der Browser verwirft sie). Da hier die Kurzschrift steht, deckt
   ein !important beide Fälle ab. */
.rcb-align .rcb-header-container{
  border-top-left-radius:15px !important;
  border-top-right-radius:15px !important;
  padding:var(--sed-cb-pad) var(--sed-cb-pad) 0.85rem !important;
}

/* Hier setzt das Plugin padding-left/-right beide selbst. */
.rcb-align .rcb-body-container{
  padding-left:var(--sed-cb-pad) !important;
  padding-right:var(--sed-cb-pad) !important;
}

/* color zusätzlich: die Fußzeile ist der einzige der drei Container, auf dem
   das Plugin auch eine Schriftfarbe setzt (gemessen kam Grau statt des
   gedämpften Rosé). */
.rcb-align .rcb-footer-container{
  border-bottom-left-radius:15px !important;
  border-bottom-right-radius:15px !important;
  padding:0.5rem var(--sed-cb-pad) var(--sed-cb-pad) !important;
  color:var(--sed-cb-text-quiet) !important;
}

/* --------------------------------------------------------------------------
   3) Typografie
   -------------------------------------------------------------------------- */
/* Komplett mit !important, ausnahmsweise ohne Rosinenpicken: auf .rcb-headline
   steht beim Plugin all:unset, dazu eigene Werte für color, font-family,
   font-size, font-weight und line-height. Damit verliert jede einzelne Zeile
   hier. Gemessen kam die Überschrift zuletzt in Barlow Condensed 20px/400 in
   Dunkelgrau an, also durchweg im Plugin-Standard. */
.rcb-align .rcb-headline{
  color:var(--sed-cb-headline) !important;
  font-family:'Plus Jakarta Sans', sans-serif !important;
  font-size:19px !important;
  font-weight:500 !important;
  line-height:1.35 !important;
}

/* color steht hier bewusst OHNE !important: auf .rcb-description setzt das
   Plugin keine Schriftfarbe, sie kommt also durch (gemessen bestätigt) und
   wird vom Fließtext in > p über dessen all:unset sauber geerbt.
   font-size und line-height dagegen setzt das Plugin (1.5/13px) — die beiden
   brauchen es. Für .rcb-teaching gilt das nicht, siehe direkt darunter. */
.rcb-align .rcb-description,
.rcb-align .rcb-teaching{
  color:var(--sed-cb-text);
  font-size:14px !important;
  line-height:1.6 !important;
}

/* .rcb-teaching trägt beim Plugin all:unset und zusätzlich eine eigene color.
   Anders als bei .rcb-description verliert die Farbe hier also und braucht
   ihr eigenes !important — deshalb die kleine Extra-Regel statt eines
   !important in der gemeinsamen Regel darüber, das .rcb-description nur
   unnötig verhärten würde. */
.rcb-align .rcb-teaching{
  color:var(--sed-cb-text) !important;
}

/* Links im Fließtext (z. B. "Datenschutzerklärung") erben beim Plugin per
   all:unset die Textfarbe — hier bewusst auf den Cyan-Akzent gehoben, damit
   sie als Link erkennbar sind. */
/* Das Plugin fasst diese Links selbst an — mit all:unset, color:inherit und
   einer eigenen text-decoration, auf "#<uuid> .rcb-description
   a:not([aria-expanded])" (1-2-0). Gemessen hatte der Link zuletzt exakt die
   Textfarbe der Umgebung, war also als Link nicht mehr zu erkennen. */
.rcb-align .rcb-description a{
  color:var(--sed-cb-accent-ink) !important;
  text-decoration:underline !important;
}

/* KEIN !important — hier liegt kein Spezifitätsproblem vor, sondern ein
   falsches Ziel. Das Plugin setzt auf .rcb-teaching-separator selbst nur
   display; die sichtbare Trennlinie ist dessen ::after (dort sitzen height,
   background und border-radius). Ein background auf dem Element bleibt
   deshalb unsichtbar, mit !important genauso wie ohne.
   Wer die Linie einfärben will, muss .rcb-teaching-separator::after
   ansprechen — bewusst nicht Teil dieses Durchgangs, weil es eine echte
   Änderung wäre und nicht das Durchsetzen von bereits Gewolltem. */
.rcb-align .rcb-teaching-separator{
  background:rgba(243,236,220,0.18);
}

/* --------------------------------------------------------------------------
   4) Buttons
   --------------------------------------------------------------------------
   Wichtig zum Verständnis der doppelten Selektoren: das Plugin rendert jeden
   Button als <a> mit einem <span> für die Beschriftung darin — und setzt die
   Schriftfarbe auf BEIDEN Elementen. Wird nur das <a> umgefärbt, behält die
   sichtbare Beschriftung die alte Farbe. Deshalb steht überall zusätzlich
   "> span" mit in der Regel.

   Die Buttons bringen vom Plugin bereits flex:1 1 100% mit und stapeln sich
   dadurch untereinander; hier wird nur noch die Breite abgesichert und der
   Abstand gesetzt, die Layout-Logik bleibt beim Plugin.

   IN DIESEM ABSCHNITT STEHT AUSNAHMSLOS ÜBERALL !important, und zwar
   begründet: das Plugin baut alle vier Buttons aus derselben Vorlage, und die
   beginnt mit all:unset. Auf 1-1-0 setzt diese eine Kurzschrift jede
   Eigenschaft zurück — auch width, margin, font-family und line-height, die
   das Plugin gar nicht bewusst anfasst. Es gibt hier also keine Zeile, die
   ohne !important ankäme; Rosinenpicken wie in den Abschnitten davor ist
   nicht möglich. Gemessen kamen die Buttons zuletzt vollständig im
   Plugin-Standard an: Petrol-Blau, weiße Schrift, Barlow Condensed 18px/400,
   5px Radius.
   -------------------------------------------------------------------------- */
.rcb-align .rcb-btn-accept-all,
.rcb-align .rcb-btn-accept-essentials,
.rcb-align .rcb-btn-accept-individual,
.rcb-align .rcb-btn-save{
  width:100% !important;
  margin:0 0 10px !important;
  justify-content:center !important;
  text-align:center !important;
  font-family:'Plus Jakarta Sans', sans-serif !important;
  font-size:15px !important;
  line-height:1.3 !important;
  border-radius:10px !important;
}

/* Primär: "Alle akzeptieren".
   Das Plugin setzt color sowohl auf dem <a> als auch auf dem inneren <span>
   (Regeln "... > span" und "...:hover > span") — beide auf 1-1-1 bzw. 1-2-1
   und damit über den Selektoren hier. Deshalb braucht auch die span-Variante
   ihr eigenes !important, sonst bliebe die sichtbare Beschriftung weiß. */
.rcb-align .rcb-btn-accept-all,
.rcb-align .rcb-btn-accept-all > span,
.rcb-align .rcb-btn-save,
.rcb-align .rcb-btn-save > span{
  color:var(--sed-cb-primary-ink) !important;
}
.rcb-align .rcb-btn-accept-all,
.rcb-align .rcb-btn-save{
  background-color:var(--sed-cb-primary) !important;
  border:0 !important;
  padding:13px 18px !important;
  font-weight:700 !important;
}
/* Der :hover-Block des Plugins setzt color, background-color, border-color
   und text-decoration eigens nach — auch der braucht Gegenwehr. */
.rcb-align .rcb-btn-accept-all:hover,
.rcb-align .rcb-btn-save:hover{
  background-color:#F26D8E !important;
  border:0 !important;
}
.rcb-align .rcb-btn-accept-all:hover > span,
.rcb-align .rcb-btn-save:hover > span{
  color:var(--sed-cb-primary-ink) !important;
}

/* Sekundär: "Nur notwendige".
   Bewusst gleichwertig sichtbar gestaltet — gleiche Größe, gleiches Gewicht,
   gleicher Innenabstand wie der Primär-Button, nur als Outline statt als
   Fläche. Das ist keine reine Geschmacksfrage: eine optisch benachteiligte
   Ablehnen-Option gilt als "Dark Pattern" und ist einer der häufigsten
   Kritikpunkte an Cookie-Bannern. Bitte beim Nachjustieren so lassen.

   ACHTUNG, dieser Block greift derzeit NICHT: die Klasse
   .rcb-btn-accept-essentials kommt im DOM überhaupt nicht vor. In der
   aktuellen RCB-Konfiguration ist "Nur notwendige" so eingestellt, dass es
   die Gestaltung von "Alle akzeptieren" mitbenutzt — der Ablehnen-Button
   heißt im Banner "Weiter ohne Einwilligung" und trägt selbst die Klasse
   .rcb-btn-accept-all. Beide Buttons bekommen dadurch aus dem Block darüber
   dieselbe Primärfläche.

   Für das Ziel "keine optisch benachteiligte Ablehnen-Option" ist das kein
   Rückschritt, sondern die strengste Variante davon. Wer die Outline-Optik
   aus dem Mockup zurückhaben will, muss das im wp-admin umstellen
   (Real Cookie Banner → Customizer → Buttons), nicht hier — dann greift
   dieser Block wieder, und dann braucht er die !important genauso wie der
   Rest des Abschnitts. Deshalb bleibt er stehen und wird mitgepflegt. */
.rcb-align .rcb-btn-accept-essentials,
.rcb-align .rcb-btn-accept-essentials > span{
  color:var(--sed-cb-accent-ink) !important;
}
.rcb-align .rcb-btn-accept-essentials{
  background-color:transparent !important;
  border:1.5px solid var(--sed-cb-accent) !important;
  padding:13px 18px !important;
  font-weight:700 !important;
}
.rcb-align .rcb-btn-accept-essentials:hover{
  background-color:rgba(87,217,212,0.12) !important;
  border-color:var(--sed-cb-accent-ink) !important;
}
.rcb-align .rcb-btn-accept-essentials:hover > span{
  color:var(--sed-cb-accent-ink) !important;
}

/* Tertiär: "Einstellungen anpassen" — als schlichter Textlink.
   margin-bottom:0 braucht das !important hier gegen eine zusätzliche
   Plugin-Regel auf dem Button-Container ("... > a", 1-1-1), die allen
   Buttons einen einheitlichen Abstand nach unten gibt. text-decoration
   erzeugt das Plugin für diesen Button-Typ zwar ohnehin, verwaltet sie aber
   selbst — ohne !important stünde hier eine Zeile, die nur zufällig passt. */
.rcb-align .rcb-btn-accept-individual,
.rcb-align .rcb-btn-accept-individual > span{
  color:var(--sed-cb-text-quiet) !important;
}
.rcb-align .rcb-btn-accept-individual{
  background-color:transparent !important;
  border:0 !important;
  padding:6px 0 2px !important;
  margin-bottom:0 !important;
  font-size:13px !important;
  font-weight:500 !important;
  text-decoration:underline !important;
}
.rcb-align .rcb-btn-accept-individual:hover,
.rcb-align .rcb-btn-accept-individual:hover > span{
  color:var(--sed-cb-headline) !important;
}

/* Die Spalte, in der die Buttons stehen (.rcb-tb-right, "toolbar right").
   Das Plugin gibt ihr einen eigenen, deckend WEISSEN Hintergrund. Solange die
   Box selbst hell war, ist das nie aufgefallen; seit Kopf/Körper/Fuß hier
   dunkel durchgesetzt werden, stand darin ein weißer Block hinter den
   Buttons — am deutlichsten in der zweiten Ebene, wo die Spalte rechts neben
   dem Text sitzt (dort ~492x197px).

   Nachgetragen nach dem ersten Deploy: das ist kein Spezifitätsverlust einer
   bestehenden Regel, sondern eine Eigenschaft, die diese Datei vorher gar
   nicht angefasst hat. transparent statt --sed-cb-bg, damit die Rundung und
   der Hintergrund der Box darunter durchscheinen.

   Den box-shadow des Plugins lassen wir stehen: er ist rgba(43,43,43,0.3)
   und auf dem dunklen Grund ohnehin unsichtbar. */
.rcb-align .rcb-tb-right{
  background:transparent !important;
}

/* --------------------------------------------------------------------------
   5) Fußzeilen-Links (Impressum / Datenschutz / "Powered by")
   -------------------------------------------------------------------------- */
/* Das Plugin setzt auf .rcb-footer-link color, font-size, font-family,
   text-decoration und padding, dazu einen eigenen :hover mit color.
   Gemessen kamen zuletzt Grau und 14px an statt des gedämpften Rosé in 12px. */
.rcb-align .rcb-footer-link{
  color:var(--sed-cb-text-quiet) !important;
  font-size:12px !important;
}
.rcb-align .rcb-footer-link:hover{
  color:var(--sed-cb-headline) !important;
}

/* --------------------------------------------------------------------------
   6) Zweite Ebene ("Einstellungen anpassen": Gruppen, Schalter, Akkordeons)
   --------------------------------------------------------------------------
   Bewusst nur so weit mitgezogen, dass die Detailansicht nicht als hellgraue
   Standard-Insel in der dunklen Box steht. Ein eigenes Mockup gibt es dafür
   noch nicht — wenn dafür eins kommt, gehört es hierhin.

   Die !important in diesem Abschnitt sind aus den Plugin-Bundles abgeleitet,
   nicht am offenen Dialog nachgemessen: die zweite Ebene wird nachgeladen,
   ihre Regeln stehen erst im Stylesheet, wenn man sie öffnet. Der Mechanismus
   ist aber derselbe und für die erste Ebene lückenlos bestätigt — jede
   erzeugte Regel bekommt die ID-Variante. Beim Nachprüfen im Browser also
   bitte diesen Abschnitt besonders ansehen.
   -------------------------------------------------------------------------- */

/* .rcb-group bekommt vom Plugin background, border-color/-style/-width und
   border-radius; .rcb-group-inner trägt all:unset. Beide verlieren also. */
.rcb-align .rcb-group,
.rcb-align .rcb-group-inner{
  background:rgba(243,236,220,0.05) !important;
  border-color:rgba(243,236,220,0.18) !important;
  border-radius:12px !important;
}

/* Die Gruppen-Überschrift ("Essenziell (1)", "Marketing (2)"). .rcb-group-inner
   ist das <label>, das Checkbox und Überschrift zusammenfasst; seine color ist
   die Schriftfarbe dieser Überschrift.

   Ebenfalls nach dem ersten Deploy nachgetragen und aus demselben Grund wie
   .rcb-tb-right: die Datei hat hier bisher nur Fläche und Rahmen gesetzt, nie
   die Schriftfarbe. Das Plugin liefert rgb(43,43,43) — auf der dunklen Box
   praktisch unlesbar. Die Beschreibung darunter (.rcb-group-description) hat
   ihre eigene Farbe und war nie betroffen, deshalb steht das hier als eigene
   Regel und nicht in der gemeinsamen darüber. */
.rcb-align .rcb-group-inner{
  color:var(--sed-cb-headline) !important;
}

/* Auf beiden setzt das Plugin eine eigene color. */
.rcb-align .rcb-group-description,
.rcb-align .rcb-accordion-description{
  color:var(--sed-cb-text) !important;
}

/* .rcb-accordion-title: eigene color vom Plugin.
   .rcb-dotted-groups: all:unset, was die Farbe ebenfalls plattmacht. */
.rcb-align .rcb-accordion-title,
.rcb-align .rcb-dotted-groups{
  color:var(--sed-cb-headline) !important;
}

/* .rcb-accordion-item: eigenes background vom Plugin (plus Varianten für
   :hover und den geöffneten Zustand).
   .rcb-accordion-button: all:unset, trifft beide Zeilen. */
.rcb-align .rcb-accordion-item,
.rcb-align .rcb-accordion-button{
  background:transparent !important;
  border-color:rgba(243,236,220,0.18) !important;
}

/* KEIN !important — wie beim .rcb-teaching-separator kein Spezifitätsproblem,
   sondern ein falsches Ziel. Auf .rcb-group-button-item selbst setzt das
   Plugin gar nichts; das Element ist die (unsichtbare) Checkbox, die
   gestaltete Schaltfläche ist das direkt folgende <span> ("+ span" in den
   Plugin-Regeln). Eine color auf einer Checkbox bleibt folgenlos, mit
   !important wie ohne. Falls die Schaltflächen in der zweiten Ebene farblich
   nicht passen, ist das die Stelle zum Nacharbeiten — dann aber als
   ".rcb-group-button-item + span", nicht mit einem !important hier. */
.rcb-align .rcb-group-button-item{
  color:var(--sed-cb-accent-ink);
}

/* --------------------------------------------------------------------------
   7) Wiederöffnen-Button ("Sticky rechtliche Links Widget")
   --------------------------------------------------------------------------
   HIER FEHLT BEWUSST CSS. Das schwebende Wiederöffnen-Widget ist ein
   PRO-Feature von Real Cookie Banner und in der installierten Free-Version
   nicht vorhanden: die zuständige Komponente ist im ausgelieferten Bundle
   (banner-lite-banner-lazy.lite.js) als leerer Platzhalter enthalten, der
   nichts rendert — unabhängig davon, was im Customizer eingestellt ist. Es
   gibt also kein Element, das man ansprechen könnte; ein Kreis-Button hier
   wäre auf gut Glück geraten und würde beim Umstieg auf Pro vermutlich
   ohnehin nicht passen.

   Was die Free-Version stattdessen anbietet: einen normalen Textlink zum
   Wiederöffnen. Genau der steht inzwischen in allen drei neuen Vorlagen im
   Footer (<a href="#consent-change" class="rcb-sc-link">Cookie-Einstellungen</a>,
   siehe front-page.php, single-event.php und tickets-placeholder.php) — der
   gesetzlich vorgeschriebene Weg, eine einmal erteilte Einwilligung wieder zu
   ändern oder zu widerrufen.

   BEWUSST OHNE eigene Farbe und ohne Unterstreichung: Der Link steht direkt
   neben "Impressum" und "Datenschutz" und soll aussehen wie diese. Die
   Footer-Regeln in design-system.css (.sed-home-footer-col a bzw.
   .sed-event-footer a, beide Spezifität 0-1-1) übernehmen das komplett. Eine
   eigene Farbe hier hätte eine Klasse mehr (0-2-0) und würde sie schlagen —
   der Link stünde dann andersfarbig und unterstrichen zwischen seinen
   Nachbarn. Falls der Link künftig irgendwo AUSSERHALB eines Footers landet,
   gehört seine Gestaltung dorthin, wo er steht, nicht hierher.

   cursor:pointer ist reine Absicherung: der Browser setzt ihn bei einem <a>
   mit href ohnehin, aber Themes setzen für reine Anker-Links (href="#...")
   gelegentlich cursor:default. -------------------------------------------- */
.rcb-sc-link{
  cursor:pointer;
}

/* --------------------------------------------------------------------------
   8) Kleine Bildschirme
   --------------------------------------------------------------------------
   Auf schmalen Viewports rückt die Box dicht an den Rand; das Etikett würde
   dann teilweise aus dem Bild laufen. Deshalb dort etwas weiter nach innen
   und mit kleinerer Schrift.
   -------------------------------------------------------------------------- */
@media (max-width:480px){
  :root{ --sed-cb-pad:1.25rem; }

  .rcb-align .rcb-inner::before{
    left:12px;
    font-size:11px;
    padding:3px 8px;
  }
}

/* Nutzerinnen und Nutzer, die reduzierte Bewegung eingestellt haben, bekommen
   die Kippung nicht — sie ist reine Dekoration und kann bei
   Bewegungsempfindlichkeit stören. */
@media (prefers-reduced-motion:reduce){
  .rcb-align .rcb-inner{ transform:none; }
  .rcb-align .rcb-inner::before{ transform:none; }
}
