/**
 * Cookie-Banner – dezente, nicht blockierende Karte unten links.
 *
 * Nutzt, wenn vorhanden, die Design-Variablen des Themes (--rh-*), fällt aber
 * auf eigene Werte zurück, damit das Banner auch ohne dieses Theme korrekt
 * aussieht. Hell/Dunkel folgt den Theme-Variablen bzw. der Systemvorliebe.
 *
 * @package radio-hoffmann
 */

.rh-consent[hidden] { display: none; }

.rh-consent {
    position: fixed;
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
    z-index: 9999;
    max-width: 30rem;
    padding: 1rem 1.15rem 1.1rem;
    background: var(--rh-bg, #ffffff);
    color: var(--rh-fg, #16191d);
    border: 1px solid var(--rh-border, #dde2e8);
    border-radius: var(--rh-radius, 10px);
    box-shadow: 0 10px 34px rgba(16, 25, 40, .22);
    font-size: .95rem;
    line-height: 1.55;
}

/* Ab Tablet: schmale Karte unten links statt volle Breite. */
@media (min-width: 40rem) {
    .rh-consent { right: auto; }
}

.rh-consent__title {
    margin: 0 0 .35rem;
    font-size: 1.05rem;
    font-weight: 700;
}
.rh-consent__text { margin: 0; }
.rh-consent__link { color: var(--rh-primary, #0d63a9); }

.rh-consent__actions {
    display: flex;
    gap: .6rem;
    margin-top: .9rem;
    flex-wrap: wrap;
}

/* Beide Schaltflächen gleich groß und gleich prominent (gesetzliche Vorgabe:
   Ablehnen darf nicht schwerer sein als Akzeptieren). */
.rh-consent__btn {
    flex: 1 1 8rem;
    padding: .55rem 1rem;
    border: 1px solid var(--rh-border, #dde2e8);
    border-radius: 8px;
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}
.rh-consent__btn--primary {
    background: var(--rh-primary, #0d63a9);
    border-color: var(--rh-primary, #0d63a9);
    color: var(--rh-primary-fg, #ffffff);
}
.rh-consent__btn--secondary {
    background: var(--rh-surface, #f4f6f9);
    color: var(--rh-fg, #16191d);
}
.rh-consent__btn:hover { filter: brightness(.97); }
.rh-consent__btn:focus-visible {
    outline: 3px solid var(--rh-primary, #0d63a9);
    outline-offset: 2px;
}

/* Ohne Theme-Variablen im Dunkelmodus dennoch lesbar bleiben. */
@media (prefers-color-scheme: dark) {
    .rh-consent {
        background: var(--rh-bg, #101419);
        color: var(--rh-fg, #e8ecf1);
        border-color: var(--rh-border, #2a323c);
        box-shadow: 0 10px 34px rgba(0, 0, 0, .5);
    }
    .rh-consent__btn--secondary {
        background: var(--rh-surface, #171c23);
        color: var(--rh-fg, #e8ecf1);
    }
}