/*
 * Widerrufsbutton nach § 356a Abs. 1 BGB, eingebunden ueber
 * templates/templates_common/widerruf/_button.html.twig in alle 14 Hauptvorlagen.
 * Schrift so gross wie die Fusszeilen-Links: Die Huelle ist ein <p> wie die Linkzeilen, und der
 * Knopf setzt weder Schriftgroesse noch Schriftart. Er bekommt sie damit aus denselben Regeln der
 * jeweiligen Domain wie die Links (z. B. "footer p a", "footer p", "p, li, a"), auf dem Handy auch
 * die dort kleinere Groesse.
 * Trotzdem hervorgehoben und von Impressum, Datenschutz und Kontakt abgesetzt (BT-Drs. 21/1856,
 * S. 37 f.: Farbwahl, Kontrast, hervorgehobene Platzierung): eigene Zeile, eigene Farbe, fett,
 * als Knopf gestaltet. Kontrast Weiss auf #8b1e3f 8,9:1, beim Ueberfahren Weiss auf #6e1732
 * 11,5:1 (WCAG 2.1 AA verlangt 4,5:1). Der weisse Rand hebt den Knopf auch auf dunklen
 * Fusszeilen (#1a1a2e) ab. Zielgroesse mindestens 24 x 24 px (WCAG 2.2 AA, 2.5.8).
 * Die Selektoren sind bewusst spezifischer als die Fusszeilen-Regeln der Domain-Stylesheets
 * (z. B. "footer p a", "footer p" mit padding-top). Ausnahme: ".lexikon-footer p" (0,1,1) setzt
 * auf der Huelle margin: 0, fuer einen Block mit automatischer Breite gleichwertig zu 0 auto.
 * Der Abstand nach oben ist Innenabstand: ein Aussenabstand fiele auf Fusszeilen ohne eigenen
 * Innenabstand mit deren Rand zusammen (Margin-Collapse), der Knopf klebte am oberen Rand.
 */
.widerruf-einstieg {
    clear: both;
    display: block;
    margin: 0 auto;
    padding: 1rem 1rem 0.5rem;
    text-align: center;
}

.widerruf-einstieg a.widerruf-button,
.widerruf-einstieg a.widerruf-button:link,
.widerruf-einstieg a.widerruf-button:visited {
    display: inline-block;
    box-sizing: border-box;
    min-height: 24px;
    padding: 0.25em 0.85em;
    border: 1px solid #ffffff;
    border-radius: 0.3em;
    background-color: #8b1e3f;
    color: #ffffff;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: normal;
    text-decoration: none;
}

.widerruf-einstieg a.widerruf-button:hover,
.widerruf-einstieg a.widerruf-button:active {
    background-color: #6e1732;
    color: #ffffff;
    text-decoration: underline;
}

.widerruf-einstieg a.widerruf-button:focus-visible {
    outline: 3px solid #1a1a1a;
    outline-offset: 3px;
    box-shadow: 0 0 0 3px #ffffff;
}

@media print {
    .widerruf-einstieg {
        display: none;
    }
}
