/* ===========================================================
   LICHT & WASSERWELT
   JTL-SHOP 5.8 – NOVA CHILD
   FOOTER DESIGN (Desktop + Smartphone)

   - Weisser Hintergrund
   - Schwarze Schrift
   - Link-Hover in Midnight-Blau #1973D3
   - Widerrufsbutton blau / weiss
   - Zwei durchgehende Trennlinien

   Datei: /templates/NOVAChild/themes/my-nova/footer-design.css
   =========================================================== */

/* 1. Grundeinstellungen */
#footer {
    --footer-blau: #1973D3;
    --footer-trennlinie: rgba(0, 0, 0, 0.20);

    background-color: #ffffff !important;
    color: #111111 !important;
}

/* 2. Footer-Hintergruende */
#footer .footer-main,
#footer .box-linkgroup .collapse,
#footer .box-categories .collapse {
    background-color: #ffffff !important;
    color: #111111 !important;
}

/* 3. Ueberschriften und normale Texte */
#footer h1,
#footer h2,
#footer h3,
#footer h4,
#footer h5,
#footer h6,
#footer p,
#footer .newsletter-footer-heading,
#footer .productlist-filter-headline,
#footer .box-heading {
    color: #111111 !important;
}

/* 4. Normale Footer-Links: schwarz */
#footer a:not(.btn):not(.withdrawal-link),
#footer a:not(.btn):not(.withdrawal-link):visited {
    color: #111111 !important;
    transition: color 0.25s ease;
}

/* 5. Footer-Links: blau bei Hover und Tastatur-Fokus */
html body #footer a:not(.btn):not(.withdrawal-link):hover,
html body #footer a:not(.btn):not(.withdrawal-link):focus-visible {
    color: var(--footer-blau) !important;
}

/* Auch verschachtelte Texte und Icons uebernehmen die Linkfarbe. */
html body #footer a:not(.btn):not(.withdrawal-link):hover :is(span, strong, small, em, b, i),
html body #footer a:not(.btn):not(.withdrawal-link):focus-visible :is(span, strong, small, em, b, i) {
    color: inherit !important;
}

/* 6. Newsletter-Eingabefelder */
#footer .form-control {
    background-color: #ffffff !important;
    color: #111111 !important;
}

#footer .form-control::placeholder {
    color: #111111 !important;
    opacity: 0.65;
}

/* 7. Widerrufsbutton: blau mit weisser Schrift */
html body #footer .btn.withdrawal-link,
html body #footer a.withdrawal-link {
    background-color: var(--footer-blau) !important;
    border-color: var(--footer-blau) !important;
    color: #ffffff !important;
}

/* Der Button bleibt auch beim Hover / Fokus weiss beschriftet. */
html body #footer .btn.withdrawal-link:hover,
html body #footer .btn.withdrawal-link:focus-visible,
html body #footer a.withdrawal-link:hover,
html body #footer a.withdrawal-link:focus-visible,
html body #footer a.withdrawal-link:hover *,
html body #footer a.withdrawal-link:focus-visible * {
    color: #ffffff !important;
}

/* 8. Erste Trennlinie ueber den gesetzlichen Informationen */
#footer #footer-boxes {
    position: relative !important;
    border-top: none !important;
    padding-top: 22px !important;
    margin-top: 15px !important;
}

#footer #footer-boxes::before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 100vw;
    height: 1px;
    transform: translateX(-50%);
    background-color: var(--footer-trennlinie);
    pointer-events: none;
}

/* 9. Copyright-Grundfarben und zweite Trennlinie zentral definieren */
#footer #copyright {
    position: relative !important;
    background-color: #ffffff !important;
    color: #111111 !important;
    border-top: 1px solid var(--footer-trennlinie) !important;
    margin-top: 22px !important;
    padding-top: 16px !important;
}

/* 10. Copyright und JTL-Text */
#footer #copyright span,
#footer #copyright #system-credits {
    color: #111111 !important;
}

/* 11. JTL-Link normal schwarz */
#footer #copyright a,
#footer #copyright a:visited {
    color: #111111 !important;
}

/* 12. JTL-Link beim Hover blau */
html body #footer #copyright a:hover,
html body #footer #copyright a:focus-visible {
    color: var(--footer-blau) !important;
}

/* Ende Footer-Design */