/* =============================================================
   AKD Styles — akaishidaiko.de
   Geladen via wp_enqueue_style in akd-event-single.php

   Struktur (oben = allgemein → unten = spezifisch):
   1. Utilities
   2. Typografie
   3. Buttons & Links
   4. Komponenten (hell)
   5. Komponenten (dunkel)
   6. Listing / Auftritt-Tabelle
   7. Formular (form-ID-spezifisch)
   ============================================================= */


/* ── 1. UTILITIES ────────────────────────────────────────────────────────────
   Kleine Hilfsklassen ohne eigene Struktur. Können auf beliebige
   Elemente angewendet werden, um Farbe oder Transparenz zu steuern.
   ──────────────────────────────────────────────────────────────────────────── */

.akd-red { color: #c8302a !important; }

.akd-tp-20 { opacity: 0.8; }
.akd-tp-40 { opacity: 0.6; }
.akd-tp-60 { opacity: 0.4; }


/* ── 2. TYPOGRAFIE ───────────────────────────────────────────────────────────
   Seitenweite Text-Klassen: Hero-Absatz mit Initiale, japanische Inline-Spans
   und der nummerierte Kreis-Badge für Überschriften.
   ──────────────────────────────────────────────────────────────────────────── */

/* Lede / Drop Cap — großer Einstiegsabsatz mit roter Initiale */
p.lede {
    font-family: 'Shippori Mincho','Noto Serif JP',Georgia,serif;
    font-size: 22px;
    line-height: 1.5;
    letter-spacing: 0.04em;
    color: #0a0a0a;
    margin: 0 0 28px;
}
p.lede::first-letter {
    font-family: 'Shippori Mincho','Noto Serif JP',Georgia,serif;
    font-weight: 900;
    font-size: 4.4em;
    float: left;
    line-height: 0.85;
    margin: 6px 12px -2px 0;
    color: #c8302a;
}

/* Japanische Inline-Spans — kleiner, roter Serif-Text in Überschriften
   Verwendung: <span class="akd-jp">出演</span>
   Modifier: akd-tp-20/40/60 für Transparenz */
.akd-jp {
    color: #c8302a;
    font-family: 'Shippori Mincho','Noto Serif JP',Georgia,serif;
    font-style: normal;
    font-size: 0.5em;
    letter-spacing: 0.05em;
    vertical-align: 0.3em;
}

/* Nummerierter Kreis-Badge — für Überschriften mit Nummerierung
   Verwendung: <span class="akd-num">01</span> Überschrift */
.akd-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.1em;
    height: 2.1em;
    border: 1.5px solid currentColor;
    border-radius: 50%;
    font-size: 0.8em;
    letter-spacing: 0;
    margin-right: 0.4em;
    vertical-align: middle;
    flex-shrink: 0;
}


/* ── 3. BUTTONS & LINKS ──────────────────────────────────────────────────────
   Wiederverwendbare interaktive Elemente. Ghost-Button als Standard,
   Modifier für rote und gefüllte Varianten. Einfache Link-Klasse für
   rot unterstrichene Inline-Links.
   ──────────────────────────────────────────────────────────────────────────── */

/* Ghost Button — Standard (heller Hintergrund) */
.akd-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 28px;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    text-decoration: none;
    border: 1px solid #0a0a0a;
    color: #0a0a0a;
    background: transparent;
    cursor: pointer;
    transition: background 0.2s, color 0.2s, border-color 0.2s;
    white-space: nowrap;
    border-radius: 0;
}
.akd-btn:hover {
    background: #0a0a0a;
    color: #f4efe6;
}

/* Modifier: roter Ghost Button */
.akd-btn--red {
    border-color: #c8302a;
    color: #c8302a;
}
.akd-btn--red:hover {
    background: #c8302a;
    color: #f4efe6;
    border-color: #c8302a;
}

/* Modifier: gefüllter roter Button */
.akd-btn--filled {
    background: #c8302a;
    color: #f4efe6;
    border-color: #c8302a;
}
.akd-btn--filled:hover {
    background: #a8251f;
    border-color: #a8251f;
}

/* Inline-Link — roter unterstrichener Textlink */
.akd-link {
    color: #c8302a;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
    transition: opacity 0.15s;
}
.akd-link:hover {
    opacity: 0.75;
}


/* ── 4. KOMPONENTEN (HELL) ───────────────────────────────────────────────────
   Eigenständige UI-Blöcke für helle Seitenbereiche. Jede Komponente
   ist in sich geschlossen und über eine BEM-ähnliche Namenskonvention
   (akd-[name]__[element]) ansprechbar.
   ──────────────────────────────────────────────────────────────────────────── */

/* Stats Row — horizontale Kennzahlen-Zeile (Gegründet, Standorte etc.)
   Verwendung: akd-stats > akd-stats__item > label + value + sub */
.akd-stats {
    display: flex;
    gap: 0;
}
.akd-stats__item {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.akd-stats__label,
.akd-stats__sub {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 10px;
    font-weight: 400;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #6b6558;
    margin: 0;
}
.akd-stats__value {
    font-family: 'Shippori Mincho', 'Noto Serif JP', Georgia, serif;
    font-size: 44px;
    font-weight: 400;
    color: #0a0a0a;
    line-height: 1;
    margin: 0;
}
@media (max-width: 767px) {
    .akd-stats {
        flex-wrap: wrap;
        gap: 36px 0;
    }
    .akd-stats__item {
        flex: 0 0 50%;
    }
    .akd-stats__value {
        font-size: 40px;
    }
}

/* Specs Table — zweispaltige Merkmalstabelle mit gestrichelten Trennlinien
   Verwendung: <table class="akd-specs"><tr><td>Label</td><td>Wert</td></tr></table> */
.akd-specs {
    width: 100%;
    border-collapse: collapse;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
}
.akd-specs tr {
    border-top: 1px dashed #c4b9aa;
}
.akd-specs tr:last-child {
    border-bottom: 1px dashed #c4b9aa;
}
.akd-specs td {
    padding: 14px 0;
    font-size: 11px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    vertical-align: middle;
}
.akd-specs td:first-child {
    color: #8a7f72;
    font-weight: 400;
}
.akd-specs td:last-child {
    text-align: right;
    font-weight: 700;
    color: #0a0a0a;
}

/* Nav Cards Grid — 2-spaltiges Kachelraster für Navigations-Links
   Modifier: --active für die aktive Seite, --sm für kompakte Variante
   Verwendung: akd-nav-cards > akd-nav-card > num + title */
.akd-nav-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}
.akd-nav-card {
    display: block;
    border: 1px solid #0a0a0a;
    margin: -1px 0 0 -1px;
    padding: 28px 32px 32px;
    text-decoration: none;
    background: transparent;
    transition: background 0.25s ease, color 0.25s ease, transform 0.25s ease;
}
.akd-nav-card:hover {
    transform: translateX(8px);
}
.akd-nav-card:hover,
.akd-nav-card--active {
    background: #0a0a0a;
    color: #f4efe6;
}
.akd-nav-card__num {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 10px;
    font-weight: 400;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: #8a7f72;
    margin: 0 0 16px;
    display: block;
    transition: color 0.2s;
}
.akd-nav-card--active .akd-nav-card__num,
.akd-nav-card:hover .akd-nav-card__num {
    color: #c8302a;
}
.akd-nav-card__title {
    font-family: 'Shippori Mincho', 'Noto Serif JP', Georgia, serif;
    font-size: 28px;
    font-weight: 400;
    color: #0a0a0a;
    margin: 0;
    line-height: 1.2;
    transition: color 0.2s;
}
.akd-nav-card:hover .akd-nav-card__title,
.akd-nav-card--active .akd-nav-card__title {
    color: #f4efe6;
}
.akd-nav-card--sm {
    padding: 16px 20px 20px;
    margin-left: auto;
}
.akd-nav-card--sm .akd-nav-card__num {
    font-size: 9px;
    margin-bottom: 8px;
}
.akd-nav-card--sm .akd-nav-card__title {
    font-size: 18px;
}
@media (max-width: 767px) {
    .akd-nav-cards {
        grid-template-columns: 1fr;
    }
}

/* Stadtliste — dynamische Tag-Cloud der Auftrittsorte, skaliert nach Häufigkeit
   Wird per PHP-Shortcode [akd_stadtliste] ausgegeben */
.akd-stadtliste {
    font-family: 'Shippori Mincho', 'Noto Serif JP', Georgia, serif;
    font-weight: 400;
    color: #0a0a0a;
    line-height: 1.8;
    margin: 0;
}
.akd-stadtliste__item {
    display: inline;
    white-space: nowrap;
    transition: color 0.15s;
}
.akd-stadtliste__item:hover {
    color: #c8302a;
}
.akd-stadtliste__count {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 0.42em;
    font-weight: 400;
    color: #8a7f72;
    vertical-align: super;
    margin-left: 2px;
    letter-spacing: 0;
}
.akd-stadtliste__dot {
    color: #c4b9aa;
    font-size: 16px;
    vertical-align: middle;
}
.akd-stadtliste__more {
    font-family: 'Shippori Mincho', 'Noto Serif JP', Georgia, serif;
    font-size: 16px;
    color: #8a7f72;
    font-style: italic;
}

/* Drum Sound Cards — nebeneinanderstehende Karten für Don / Kon
   Gedacht für dunkle Hintergründe (Border halbtransparent)
   Verwendung: akd-drum-cards > akd-drum-card > name + label */
.akd-drum-cards {
    display: flex;
    gap: 16px;
}
.akd-drum-card {
    flex: 1;
    border: 1px solid rgba(244, 239, 230, 0.25);
    padding: 40px 28px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.akd-drum-card__name {
    font-family: 'Shippori Mincho', 'Noto Serif JP', Georgia, serif;
    font-size: 52px;
    font-weight: 400;
    color: #c8302a;
    line-height: 1;
    margin: 0 0 18px;
}
.akd-drum-card__label {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 10px;
    font-weight: 400;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(244, 239, 230, 0.45);
    margin: 0;
    line-height: 1.6;
}


/* ── 5. KOMPONENTEN (DUNKEL) ─────────────────────────────────────────────────
   UI-Blöcke für dunkle Sektionen (#0a0a0a Hintergrund). Text und Borders
   in hellen Tönen (#f4efe6), Akzente in Rot.
   ──────────────────────────────────────────────────────────────────────────── */

/* CTA Card — großformatiger Link-Block mit Kanji-Dekoration, Hover: rot + Slide
   Verwendung: <a class="akd-cta-card"> > inner > (label + title) + kanji </a> */
.akd-cta-card {
    display: block;
    border: 1px solid rgba(244, 239, 230, 0.2);
    padding: 28px 40px;
    text-decoration: none;
    transition: background 0.25s ease, transform 0.25s ease;
    cursor: pointer;
}
.akd-cta-card:hover {
    background: #c8302a;
    transform: translateX(8px);
}
.akd-cta-card__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}
.akd-cta-card__label {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 10px;
    font-weight: 400;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #f4efe6;
    opacity: 0.6;
    margin: 0 0 10px;
}
.akd-cta-card__title {
    font-family: 'Shippori Mincho', 'Noto Serif JP', Georgia, serif;
    font-size: 28px;
    font-weight: 400;
    color: #f4efe6;
    margin: 0;
    line-height: 1.2;
}
.akd-cta-card__kanji {
    font-family: 'Shippori Mincho', 'Noto Serif JP', Georgia, serif;
    font-size: 44px;
    color: #f4efe6;
    opacity: 0.45;
    flex-shrink: 0;
    line-height: 1;
}

/* Hint Banner — dunkler Infoblock mit Label, Fließtext und Ghost-Button
   Responsiv: auf Mobile stapeln sich Inhalt und Button vertikal
   Verwendung: akd-hint > (body > label + text) + btn */
.akd-hint {
    background: #0a0a0a;
    padding: 32px 40px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}
.akd-hint__body {
    flex: 1;
    min-width: 0;
}
.akd-hint__label {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 10px;
    font-weight: 400;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #c8302a;
    margin: 0 0 12px;
}
.akd-hint__text {
    font-family: 'Shippori Mincho', 'Noto Serif JP', Georgia, serif;
    font-size: 20px;
    line-height: 1.5;
    color: #f4efe6;
    margin: 0;
}
.akd-hint__text em {
    color: #c8302a;
    font-style: italic;
}
.akd-hint__btn {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    flex-shrink: 0;
    border: 1px solid #f4efe6;
    color: #f4efe6;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    padding: 14px 24px;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
}
.akd-hint__btn:hover {
    background: #f4efe6;
    color: #0a0a0a;
}
@media (max-width: 767px) {
    .akd-hint {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        padding: 24px 20px;
    }
    .akd-hint__label {
        word-break: normal;
        white-space: normal;
    }
    .akd-hint__btn {
        align-self: stretch;
        justify-content: center;
    }
}

/* Person Card — dunkle Karte mit Foto (oben) und Namenszeile (unten)
   Foto kann Platzhalter oder echtes <img class="akd-person-card__img"> sein
   Verwendung: akd-person-card > photo + info > (name + meta) + kanji */
.akd-person-card {
    background: #0d0d14;
    overflow: hidden;
}
.akd-person-card__photo {
    aspect-ratio: 4 / 3;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #0d0d14;
    border-bottom: 1px solid rgba(244, 239, 230, 0.1);
}
.akd-person-card__photo-label {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 10px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(244, 239, 230, 0.2);
}
.akd-person-card__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}
.akd-person-card__info {
    border: 1px solid rgba(244, 239, 230, 0.15);
    padding: 22px 28px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.akd-person-card__name {
    font-family: 'Shippori Mincho', 'Noto Serif JP', Georgia, serif;
    font-size: 28px;
    font-weight: 400;
    color: #f4efe6;
    margin: 0 0 8px;
    line-height: 1.2;
}
.akd-person-card__meta {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 10px;
    font-weight: 400;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(244, 239, 230, 0.45);
    margin: 0;
}
.akd-person-card__kanji {
    font-family: 'Shippori Mincho', 'Noto Serif JP', Georgia, serif;
    font-size: 38px;
    color: #c8302a;
    flex-shrink: 0;
    line-height: 1;
    margin: 0;
}


/* ── 6. LISTING / AUFTRITT-TABELLE ───────────────────────────────────────────
   Styles für das JetEngine Listing-Template "Auftritt Card Tabelle" (ID 5144).
   Jede Zeile wird per PHP-Shortcode [akd_auftritt_row] gerendert.
   Der Footer ist ein separates HTML-Widget unterhalb des Listings.
   ──────────────────────────────────────────────────────────────────────────── */

/* Event Row — einzelne Auftrittszeile mit Datum, Titel, Ort und Pfeil */
.akd-event-row {
    display: flex;
    align-items: center;
    gap: 32px;
    padding: 28px 0;
    border-top: 1px dashed #c4b9aa;
    text-decoration: none;
    transition: transform 0.22s ease, background 0.22s ease;
}
.akd-event-row:hover {
    transform: translateX(8px);
    background: rgba(200, 48, 42, 0.04);
}
.akd-event-row__date {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 80px;
    flex-shrink: 0;
}
.akd-event-row__day {
    font-family: 'Shippori Mincho', 'Noto Serif JP', Georgia, serif;
    font-size: 48px;
    font-weight: 400;
    color: #c8302a;
    line-height: 1;
    display: block;
}
.akd-event-row__month {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #6b6558;
    display: block;
    margin-top: 4px;
}
.akd-event-row__info {
    flex: 1;
    min-width: 0;
}
.akd-event-row__title {
    font-family: 'Shippori Mincho', 'Noto Serif JP', Georgia, serif;
    font-size: 24px;
    font-weight: 400;
    color: #0a0a0a;
    margin: 0 0 6px;
    line-height: 1.2;
}
.akd-event-row__venue {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #8a7f72;
    margin: 0;
}
.akd-event-row__location {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-shrink: 0;
    min-width: 140px;
    justify-content: flex-end;
}
.akd-event-row__city {
    font-family: 'Shippori Mincho', 'Noto Serif JP', Georgia, serif;
    font-size: 20px;
    color: #0a0a0a;
}
.akd-event-row__arrow {
    color: #c8302a;
    font-size: 18px;
    flex-shrink: 0;
}
/* Untere Linie der letzten Zeile im Listing-Kontext */
.akd-event-list > .akd-event-row:last-child,
.jet-listing-grid__items > .jet-listing-grid__item:last-child .akd-event-row {
    border-bottom: 1px dashed #c4b9aa;
}

/* Event List Footer — Hinweis + Link unterhalb des Listings */
.akd-event-list-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 20px;
    margin-top: 4px;
    border-top: 1px dashed #c4b9aa;
}
.akd-event-list-footer__note {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 10px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #8a7f72;
    margin: 0;
}
.akd-event-list-footer__link {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #c8302a;
    text-decoration: underline;
    text-underline-offset: 3px;
}
.akd-event-list-footer__link:hover { opacity: 0.75; }


/* ── 7. FORMULAR ─────────────────────────────────────────────────────────────
   Overrides für das JetEngine Booking-Formular ID 5078 (Mitmachen-Seite).
   Styles sind absichtlich sehr spezifisch gehalten, um nur dieses eine
   Formular zu betreffen und keine anderen JetEngine-Formulare zu beeinflussen.
   ──────────────────────────────────────────────────────────────────────────── */

/* Gruppe-Feld: Radio-Buttons als nebeneinanderstehende Ghost-Buttons */
form[data-form-id="5078"] [data-field="gruppe"] .jet-form__fields-group,
form[data-form-id="5078"] [data-field="gruppe"] .jet-form-col__end > div {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
}
form[data-form-id="5078"] [data-field="gruppe"] .jet-form__field-wrap {
    flex: 0 0 auto !important;
}
form[data-form-id="5078"] [data-field="gruppe"] input[type="radio"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}
form[data-form-id="5078"] [data-field="gruppe"] .jet-form__field-label {
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 12px 28px;
    border: 1px solid #0a0a0a !important;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.2s, color 0.2s, border-color 0.2s;
    color: #0a0a0a !important;
    background: transparent !important;
    user-select: none;
    white-space: nowrap;
    border-radius: 0 !important;
}
form[data-form-id="5078"] [data-field="gruppe"] .jet-form__field-label:hover {
    background: #0a0a0a !important;
    color: #f4efe6 !important;
}
form[data-form-id="5078"] [data-field="gruppe"] .jet-form__field-label:has(input:checked) {
    background: #c8302a !important;
    color: #f4efe6 !important;
    border-color: #c8302a !important;
}

/* Datenschutz-Feld: Checkbox über volle Breite, Label als Block-Element
   damit Text + Link in einem Fluss bleiben (kein Flex-Spalten-Problem) */
form[data-form-id="5078"] [data-field="datenschutz"] {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
}
form[data-form-id="5078"] [data-field="datenschutz"] .jet-form-col__start {
    display: none !important;
}
form[data-form-id="5078"] [data-field="datenschutz"] .jet-form-col__end {
    display: block !important;
    width: 100% !important;
    flex: 0 0 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}
form[data-form-id="5078"] [data-field="datenschutz"] .jet-form__fields-group,
form[data-form-id="5078"] [data-field="datenschutz"] .checkradio-wrap,
form[data-form-id="5078"] [data-field="datenschutz"] .checkboxes-wrap {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    flex: none !important;
    flex-wrap: unset !important;
    grid-template-columns: unset !important;
    columns: unset !important;
    gap: 0 !important;
    box-sizing: border-box !important;
}
form[data-form-id="5078"] [data-field="datenschutz"] .jet-form__field-wrap {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    flex: none !important;
    box-sizing: border-box !important;
}
form[data-form-id="5078"] [data-field="datenschutz"] .jet-form__field-label {
    display: block !important;
    position: relative !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 2px 0 0 34px !important;
    background: none !important;
    border: none !important;
    cursor: pointer;
    font-family: inherit;
    font-size: 15px;
    line-height: 1.55;
    color: #0a0a0a !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    font-weight: 400;
}
form[data-form-id="5078"] [data-field="datenschutz"] input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    position: absolute !important;
    left: 0 !important;
    top: 4px !important;
    width: 20px;
    height: 20px;
    border: 1px solid #0a0a0a;
    background: transparent;
    cursor: pointer;
    margin: 0 !important;
    flex-shrink: 0;
}
form[data-form-id="5078"] [data-field="datenschutz"] input[type="checkbox"]:checked {
    background: #0a0a0a;
}
form[data-form-id="5078"] [data-field="datenschutz"] input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    left: 5px;
    top: 2px;
    width: 6px;
    height: 11px;
    border: 2px solid #f4efe6;
    border-top: none;
    border-left: none;
    transform: rotate(45deg);
}
form[data-form-id="5078"] [data-field="datenschutz"] .jet-form__field-label a {
    color: #c8302a;
    text-decoration: underline;
}
form[data-form-id="5078"] [data-field="datenschutz"] .jet-form__field-label a:hover {
    opacity: 0.75;
}