/* Fallback-Version 1 – produktiv freigegeben am 21.01.2026, 11:45 Uhr */

/* =========================================================
   1. DEBUG FLAGS – zentrale Feature-Schalter
   1 = aktiv | 0 = aus
   ========================================================= */

:root {
    --ui-servicepoint-title: 1;      /* (2) Sendcloud / ServicePoint – Überschrift ersetzen */
    --ui-servicepoint-button: 1;     /* (3) Sendcloud / ServicePoint – Button-Beschriftung */
    --ui-alert-warning: 1;           /* (4) Hinweisboxen (alert-warning) */
    --ui-shipping-day: 1;            /* (5) Versandtag-Hinweis unter Lagerstatus */
    --ui-outofstock-info: 1;         /* (6) Out-of-Stock UX + Zusatztext */
    --ui-question-button: 1;         /* (7) „Frage zum Artikel“ Styling */
    --ui-snow-effect: 1;             /* (8) Saison-Effekt (Schneefall) */
    --ui-gpsr-card: 1;               /* (9) Produktsicherheit (GPSR-Box) */
    --ui-mini-footer: 1;             /* (10) Mini-Footer / Copyright */
    --ui-estimated-delivery-info: 1; /* (11) Lieferzeit – Versandstart-Erklärung (Produktseite) */
    --ui-checkout-shipping-info: 1;  /* (12) Checkout – Versandhinweis Zusammenfassung */
}


/* =========================================================
   2. Sendcloud / ServicePoint – Überschrift
   ========================================================= */

#fieldset-servicepoint h2 {
    font-size: calc(0px * var(--ui-servicepoint-title));
}

#fieldset-servicepoint h2::after {
    content: "Lieferung an einen DPD Pickup Shop";
    font-size: calc(24px * var(--ui-servicepoint-title));
    font-weight: 600;
    color: #333;
}


/* =========================================================
   3. Sendcloud / ServicePoint – Button
   ========================================================= */

#btnSelectServicePoint span,
#btnSelectServicePoint i,
#btnSelectServicePoint * {
    display: none;
}

#btnSelectServicePoint::after {
    content: "DPD Pickup Shop wählen";
    display: block;
    text-align: center;
    padding: calc(0.5em * var(--ui-servicepoint-button)) 0;
    font-size: calc(16px * var(--ui-servicepoint-button));
    font-weight: 600;
    color: #fff;
}


/* =========================================================
   4. Hinweisboxen – alert-warning
   ========================================================= */

.alert-warning {
    background-color: rgb(
        calc(49 * var(--ui-alert-warning)),
        calc(36 * var(--ui-alert-warning)),
        calc(56 * var(--ui-alert-warning))
    );
    border-color: #312438;
    color: #ffffff;
}

.alert-warning * {
    color: inherit;
}


/* =========================================================
   5. Versandtag Hinweis – optional
   ========================================================= */

#product-offer .product-info .stock-information.stock-information-p::after {
    content: "Wir haben Betriebsferien. Nächster Versandtag 20.04.2026";
    display: block;
    margin-top: 6px;
    font-weight: 700;
    font-size: calc(0.85rem * var(--ui-shipping-day));
    color: #f28c00;
}


/* =========================================================
   6. Out-of-Stock Status – UX
   ========================================================= */

.delivery-status .status.status-0 {
    display: block;
    background: #f8f9fa;
    border: 1px solid #e0e0e0;
    border-left-width: calc(4px * var(--ui-outofstock-info));
    border-left-style: solid;
    border-left-color: #d9534f;
    padding: 10px 12px;
    border-radius: 4px;
    font-size: 14px;
    color: #333;
}

.delivery-status .status.status-0::after {
    content: "Der Artikel ist nachbestellt und wird schnellstmöglich wieder verfügbar sein. Nutzen Sie bitte die Funktion „Benachrichtigen, wenn verfügbar“.";
    display: block;
    margin-top: 6px;
    font-size: calc(13px * var(--ui-outofstock-info));
    color: #555;
    line-height: 1.4;
}


/* =========================================================
   7. Frage zum Artikel – Button
   ========================================================= */

.stock-information .question-on-item {
    width: 100%;
    margin-top: calc(12px * var(--ui-question-button));
    margin-left: 16px;
    margin-right: 16px;
}

.stock-information .btn.question {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    font-size: calc(13px * var(--ui-question-button));
    background: #f5f5f5;
    border: 1px solid #ddd;
    border-radius: 4px;
}


/* =========================================================
   8. Schneefall – Saison Effekt
   ========================================================= */

body::before,
body::after {
    content: "";
    position: fixed;
    top: -120%;
    left: -10%;
    width: 120%;
    height: 320%;
    pointer-events: none;
    z-index: 9999;
    opacity: calc(0.75 * var(--ui-snow-effect));
}

@keyframes snow {
    0%   { transform: translateY(0) translateX(0); }
    25%  { transform: translateY(25%) translateX(20px); }
    50%  { transform: translateY(50%) translateX(-20px); }
    75%  { transform: translateY(75%) translateX(15px); }
    100% { transform: translateY(100%) translateX(0); }
}


/* =========================================================
   9. Produktsicherheit (GPSR)
   ========================================================= */

.hr-sect.h3 {
    margin-top: calc(3rem * var(--ui-gpsr-card));
    margin-bottom: calc(1.5rem * var(--ui-gpsr-card));
}

.row.gpsr-compliance {
    background: #f8f9fa;
    border-left: calc(4px * var(--ui-gpsr-card)) solid #312438;
    border-radius: 6px;
    padding: 16px 20px;
}


/* =========================================================
   10. Mini Footer – Desktop & Mobile
   ========================================================= */

#copyright .row {
    justify-content: center;
    text-align: center;
}

#copyright .col,
#copyright #system-credits {
    flex: 0 0 auto;
    width: auto;
    margin: 0;
    padding: 0;
}

span[itemprop="copyrightHolder"] {
    font-size: calc(0px * var(--ui-mini-footer));
}

span[itemprop="copyrightHolder"]::after {
    content: "© 2026 Buchwald & Buchwald GbR";
    font-size: calc(13px * var(--ui-mini-footer));
    color: #fff;
}

#system-credits::before {
    content: " | ";
    margin: 0 6px;
    color: #ccc;
}


/* =========================================================
   11. Lieferzeit – Versandstart-Erklärung (Produktseite)
   ========================================================= */

.estimated-delivery {
    margin-top: 8px;
    font-size: 0.9rem;
    color: #555;
}

.estimated-delivery::after {
    content:
        "🚚 Heute bestellt → Versand am nächsten Werktag\A"
        "Bestellungen am Freitag oder Wochenende: Versand ab Montag";
    white-space: pre-line;
    display: block;
    margin-top: 6px;
    padding: 8px 10px;
    background-color: #f6f7f8;
    border-left: calc(3px * var(--ui-estimated-delivery-info)) solid #4caf50;
    border-radius: 4px;
    font-size: calc(0.85rem * var(--ui-estimated-delivery-info));
    line-height: 1.4;
    color: #555;
}

/* =========================================================
   12. Checkout – Versandhinweis in Zusammenfassung
   ========================================================= */

#shipping-method::after {
    content:
        "📦 Hinweis zum Versand\A"
        "Deine Bestellung geht in der Regel am nächsten Werktag (Montag–Freitag)\A"
        "auf den Versandweg.\A"
        "Bestellungen am Freitag oder am Wochenende werden ab Montag versendet.";
    white-space: pre-line;
    display: block;
    margin-top: 14px;
    padding: 12px 14px;
    background-color: #f6f7f8;
    border-left: calc(4px * var(--ui-checkout-shipping-info)) solid #4caf50;
    border-radius: 6px;
    font-size: calc(0.9rem * var(--ui-checkout-shipping-info));
    line-height: 1.45;
    color: #555;
}

/* =========================================================
   MOBILE OPTIMIERUNG
   ========================================================= */

@media (max-width: 767px) {

    #system-credits::before {
        content: "";
        margin: 0;
    }

    #system-credits {
        display: block;
        margin-top: 4px;
    }
}