/* ============================================================
 * consent-icon.css — Darstellung des Fingerabdruck-Symbols
 *
 * NUR Darstellung. Die Einwilligungs-Logik (welche Dienste geladen
 * werden, was "Alle akzeptieren" tut, der Banner-Text) wird hier
 * NICHT angefasst.
 *
 * Zwei verschiedene Elemente, die leicht verwechselt werden:
 *   .consent-banner-icon  = 55px-Kreis AM Banner, ragt oben darueber
 *                           hinaus und schwebt ueber dem Seiteninhalt.
 *                           Solange der Banner offen ist, ist er reine
 *                           Dekoration -> ausblenden.
 *   #consent-settings-btn = der schwebende Knopf unten links. Er ist der
 *                           EINZIGE Weg zurueck in die Cookie-Einstellungen
 *                           (DSGVO: Einwilligung muss jederzeit widerrufbar
 *                           sein). Er darf nie verschwinden.
 *
 * Diese Datei muss NACH custom.css geladen werden: dort steht in
 * #consent-settings-btn ein display:none, das den Widerrufsweg seit dem
 * Theme-Import komplett abgeschaltet hat.
 * ============================================================ */

/* --- 1. Banner offen: der Deko-Kreis verschwindet ---------------
 * #consent-manager traegt .active solange der Banner offen ist und
 * .mini, sobald entschieden wurde. Das Ausblenden greift nur im
 * ersten Zustand; am Banner selbst aendert sich nichts. */
#consent-manager.active:not(.mini) .consent-banner-icon {
    display: none !important;
}

/* --- 2. Nach der Entscheidung: klein, am Rand, ruhig ------------
 * Bewusst kein Knopf-Aussehen: keine Fuellfarbe, kein Schatten,
 * gedeckte Kontur, halbe Deckkraft. Auffindbar, wenn man ihn sucht. */
#consent-manager.mini #consent-settings-btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    min-width: 0;
    padding: 0;
    bottom: 12px;
    left: 12px;
    background: rgba(255, 255, 255, .75);
    border: 1px solid rgba(67, 90, 107, .35);
    color: #6b7c8a;
    box-shadow: none;
    opacity: .55;
    transition: opacity .15s ease-in-out;
}

#consent-manager.mini #consent-settings-btn .consent-icon,
#consent-manager.mini #consent-settings-btn svg {
    width: 16px;
    height: 16px;
    display: block;
}

/* Absicht zeigen: bei Maus und bei Tastatur voll sichtbar. */
#consent-manager.mini #consent-settings-btn:hover,
#consent-manager.mini #consent-settings-btn:focus,
#consent-manager.mini #consent-settings-btn:focus-visible {
    opacity: 1;
    background: #fff;
    color: #435a6b;
}

/* Tastaturweg muss sichtbar bleiben — ein Widerruf, den nur die Maus
 * findet, ist keiner. */
#consent-manager.mini #consent-settings-btn:focus-visible {
    outline: 2px solid #017EC7;
    outline-offset: 2px;
}

/* --- 3. Nicht auf der mobilen Kaufleiste sitzen -----------------
 * Auf der Produktseite liegt unten .rt-pdp-mobile-cta (66px hoch).
 * Ohne das hier laege das Symbol mitten auf "In den Warenkorb".
 * Kein :has() -> Symbol bleibt unten links und damit erreichbar,
 * nur der Abstand fehlt. */
@supports selector(:has(*)) {
    body:has(.rt-pdp-mobile-cta--visible) #consent-manager.mini #consent-settings-btn {
        bottom: 86px;
    }
}