/* =========================================================
   roteausschreibung.de — Korrektur der Plugin-Blöcke
   Wird NACH wp_head() geladen, weil die mu-Plugins ihre
   Stile inline und damit nach styles.css ausgeben.
   Zweck: altes Gold (#c9a84c) und Marineblau (#12233f) auf
   die Palette der Vorlage bringen.
   ========================================================= */

/* --- FAQ (details/summary, vom Plugin erzeugt) ----------- */
.rnh-faq details{
  border:1px solid var(--color-border-light);
  border-radius:var(--radius);
  background:#fff;
  box-shadow:none;
}
.rnh-faq>h2{color:var(--color-text);font-family:var(--font-heading)}
.rnh-faq summary{color:var(--color-text)}
.rnh-faq summary::after{color:var(--color-accent)}
.rnh-faq details[open] summary{border-bottom:1px solid var(--color-border-light)}
.rnh-faq details>div{color:var(--color-text-muted)}

/* --- CTA-Kasten im Fließtext ----------------------------- */
.rn-cta{
  /* Die Vorlage legt über .rn-cta einen hellen Verlauf (::before),
     der Kasten wirkt also hell. Der dunkle Hintergrund aus dem
     Plugin würde nur unter dem Verlauf liegen — Text bleibt dunkel. */
  border-radius:var(--radius);
}
.rn-cta a{
  background:var(--color-accent);
  color:#fff;
  border-radius:var(--radius);
}
.rn-cta a:hover{background:var(--color-accent-hover)}

/* --- Karten: verwandte Seiten und Themen ----------------- */
.rn-xref-list a,.rnh-cards a{
  border:1px solid var(--color-border-light);
  border-radius:var(--radius);
  box-shadow:none;
  color:var(--color-text);
}
.rn-xref-list a:hover,.rnh-cards a:hover{
  border-color:var(--color-accent);
  transform:none;
  background:var(--color-accent-dim);
}
.rn-xref-list svg,.rnh-cards svg{fill:var(--color-accent)}
.rn-xref h2,.rnh-topics h2{font-family:var(--font-heading);color:var(--color-text)}

/* --- Tabellen -------------------------------------------- */
.rn-table-wrap{border:1px solid var(--color-border-light);border-radius:var(--radius)}
.rn-table-wrap thead th{background:#101821;color:#fff}
.rn-table-wrap tbody tr:hover{background:var(--color-accent-dim)}

/* --- Hinweiskasten --------------------------------------- */
.practitioner-note{
  border-left:4px solid var(--color-accent);
  border-radius:0;
  background:#f4f6f9;
  color:var(--color-text);
}
.practitioner-note strong:first-child{color:var(--color-accent)}

/* --- Listen und Zitate im Fließtext ---------------------- */
.rn-body ul>li::before,.service-body ul>li::before{background:var(--color-accent)}
.rn-body ol>li::before,.service-body ol>li::before{background:#101821}
.rn-body blockquote,.service-body blockquote{
  border-left:4px solid var(--color-accent);
  background:#f4f6f9;
  color:var(--color-text);
}
.rn-body h2,.rn-body h3,.service-body h2,.service-body h3{font-family:var(--font-heading)}

/* --- Quellenkasten und Seitenmeta ------------------------ */
.cil-sources__box{border:1px solid var(--color-border-light);border-radius:var(--radius)}
.cil-sources__box h2{font-family:var(--font-heading)}
.cil-pagemeta,.cil-updated,.page-meta__updated{color:var(--color-text-muted);font-size:14px}
.cil-crumbs{color:var(--color-text-muted);font-size:14px}
.cil-crumbs a{color:var(--color-text-muted)}
.cil-crumbs a:hover{color:var(--color-accent)}

/* --- Sichtbare Autorenzeile ------------------------------ */
.cil-author{margin:2px 0 0;font-size:.85rem;line-height:1.6;color:var(--color-text-muted)}
.cil-author__name{font-weight:600;color:var(--color-text)}
@media(max-width:600px){.cil-author{font-size:.8rem}}

/* =========================================================
   Kontrast (WCAG AA)
   ========================================================= */

/* Auf dem dunklen Footer ist #a8372b auf #101821 nur 2.76:1.
   Innerhalb dunkler Flächen gilt deshalb der hellere Ton
   #d9796a (5.87:1). Als Variablen-Scope, damit jede Regel
   mit var(--color-accent) darin automatisch mitzieht.      */
.site-footer,.footer{--color-accent:#d9796a;--color-accent-hover:#e8a093}

/* Der CTA-Kasten im Fließtext trägt seine Farben inline im
   post_content; ohne !important kommt keine Regel daran
   vorbei. Dunkle Schrift auf Rot war 2.43:1.               */
.rn-cta a,.rn-cta a[style]{background:var(--color-accent)!important;color:#fff!important}
.rn-cta a:hover,.rn-cta a[style]:hover{background:var(--color-accent-hover)!important}

/* Haftungsausschluss unter dem Text: #6b7280 auf #f4f6f9 ergibt 4.47:1,
   knapp unter AA. Auf den gedeckten Ton der Vorlage gesetzt (5.3:1). */
.disclaimer-note,.service-body em:last-child,.article-disclaimer{color:#5b6472}

/* Rahmen der Formularfelder: rgba(16,24,33,.14) ergibt auf #f4f6f9
   nur 1.33:1. WCAG 1.4.11 verlangt für Bedienelemente 3:1.      */
/* Die Vorlage setzt den Rahmen mit !important aus var(--color-border).
   Statt eines !important-Wettlaufs wird die Variable auf dem Feld selbst
   überschrieben — dort löst var() auf.                                */
input,textarea,select{--color-border:rgba(16,24,33,.52)}
.cta-form__input:focus,.cta-form__textarea:focus,.modal-form input:focus,
.modal-form textarea:focus,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:2px solid var(--color-accent);
  outline-offset:1px;
  border-color:var(--color-accent)
}

/* Der CTA-Kasten wirkt durch den hellen Verlauf der Vorlage hell,
   das Plugin färbt seinen Text aber für dunklen Grund (#d7deea,
   1.35:1). Deshalb hier auf die dunklen Töne der Vorlage.      */
.rn-cta p{color:var(--color-text-muted)}
.rn-cta h3{color:var(--color-text)}