/**
 * preis-anzeige.css — Styles der Live-Preisanzeige (AP5, UI-Integrationspaket)
 *
 * ZIEL-PFAD IM KONFIGURATOR: css/preis-anzeige.css
 * EINBINDUNG: index.php <head> nach css/style.css (Z.136) — siehe kauf-button.patch.md,
 *             Änderung 6. Das Markup (#jcc-preis-bar) erzeugt js/preis-anzeige.js.
 *
 * Farben aus dem Bestand (css/style.css): JuCad-Blau #0072ba (Primärfarbe),
 * Dunkelblau #084b75. Breakpoints wie js/scripts.js: 1279 (mobile Button-Bar,
 * scripts.js Z.30) / 799 (breakpointS, Z.31).
 */

/* Badge/Bar: fixiert unten rechts, überlagert keine Bedienelemente (Desktop) */
#jcc-preis-bar {
    display: none;                       /* JS blendet über .jcc-visible ein */
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    z-index: 90;                         /* über Content, unter Popups/Loader (#loader-bg) */
    max-width: calc(100vw - 2rem);
    padding: .55rem .9rem;
    background: #0072ba;                 /* JuCad-Blau */
    color: #fff;
    border-radius: .5rem;
    box-shadow: 0 2px 10px rgba(8, 75, 117, .35);
    font-size: .95rem;
    line-height: 1.35;
    text-align: right;
    pointer-events: none;                /* reine Anzeige — nie Klicks abfangen */
}

#jcc-preis-bar.jcc-visible {
    display: block;
}

/* Streichpreis (nur bei Server-Flag showListPrices; Flag AN seit 10.09.2026.
   Bewusst ohne Prozent-/Rabatt-Auszeichnung — siehe LIESMICH.md Punkt 20) */
#jcc-preis-bar .jcc-preis-list {
    display: block;
    text-decoration: line-through;
    font-size: .8em;
    opacity: .85;
}

/* Gesamtpreis-Zeile bzw. "Preis im Warenkorb" */
#jcc-preis-bar .jcc-preis-total {
    display: block;
    font-weight: 700;
    white-space: nowrap;
}

/* PAngV-Pflichthinweis: "inkl. MwSt., inkl. Versandkosten" — bewusst IMMER sichtbar
   (Wording-Beschluss 10.09.2026, Bettina Sanio) */
#jcc-preis-bar .jcc-preis-hint {
    display: block;
    font-size: .75em;
    opacity: .9;
}

/* Mobil/Tablet (< 1280px, vgl. scripts.js breakpoint Z.30): vollbreite Bar,
   mit Abstand über der .mbl-btnbar der Übersicht, damit der Kauf-Button frei bleibt.
   TODO(Julian/Design-Review): Offset ggf. an finale Höhe der .mbl-btnbar anpassen. */
@media (max-width: 1279px) {
    #jcc-preis-bar {
        left: .5rem;
        right: .5rem;
        bottom: 4.25rem;
        max-width: none;
        text-align: center;
        font-size: .9rem;
    }
}

/* Sehr kleine Screens (< 800px, vgl. breakpointS scripts.js Z.31): kompakter */
@media (max-width: 799px) {
    #jcc-preis-bar {
        padding: .4rem .6rem;
        border-radius: .4rem;
    }
}

/* ===========================================================================
   FIX 20.08.2026 (Sichtprüfung Alen): Preis-Anzeige INNERHALB des Button-Stacks
   ---------------------------------------------------------------------------
   Im Zusammenfassungs-Screen hängt preis-anzeige.js die Bar als erstes Element
   in `.btn-wrap.jcc-btn-stack` (siehe platziereBar()). Dort darf sie NICHT
   fixed schweben — sonst überlappt sie „Persönlicher Bestpreis" und kostet
   zusätzliche Seitenhöhe. Als Inline-Element reiht sie sich sauber über
   „Jetzt kaufen" ein.
   =========================================================================== */
#jcc-preis-bar.jcc-preis-inline {
    position: static;
    right: auto;
    bottom: auto;
    width: 19rem;              /* gleiche Breite wie die Buttons im Stack */
    max-width: 100%;
    margin: 0 0 .25rem 0;
    box-shadow: none;
    text-align: center;
}

@media only screen and (max-width: 767px) {
    /* Mobil bleibt die Bar über der Button-Leiste fixiert (Bestand-Verhalten). */
    #jcc-preis-bar.jcc-preis-inline {
        width: 100%;
    }
}