/* pz: Footer — dunkles Band nach Mockup (fcols, fmark, fphone, pays, fbottom).
   Grundfarben kommen bereits aus den Template-Einstellungen
   (colors_footer-bg-color = ink) — hier Struktur + Details.
   Version: siehe Marker --pz-css-footer unten (muss mit layout/header.tpl uebereinstimmen) */

:root {
  --pz-css-footer: "20260821-14";
  /* pz: 21.08. (impeccable-Audit) — Nebentext-Ton des dunklen Fusses.
     Er stand fuenfmal als roher Einzelwert #7d7367 in dieser Datei
     (Fussnote unter der Hotline, Copyright-Zeile, deren Links, die
     MwSt-Fussnote, die Rechtslinks der Bodenleiste) und mass auf
     --pz-ink #12100d nur 4,09:1 — unter AA (4,5:1) fuer Normaltext,
     und genau dort stehen Pflichtangaben und Rechtslinks.
     #847a6d misst auf --pz-ink 4,51:1 (21.08. im Browser gerechnet).
     Ein Token statt fuenf gleicher Zahlen: die naechste Korrektur
     passiert an EINER Stelle (Fehlerregister 17).
     ⚠️ Von den fuenf Stellen WIRKEN nur drei (21.08. im Browser
     gegengeprueft, Fehlerregister 16 — Regelsuche ueber styleSheets,
     nicht geraten): .pz-fnote, #copyright (Fliesstext) und die
     MwSt-Fussnote. Die beiden LINK-Stellen (`#copyright a` (1,0,1) und
     `.pz-fbottom-links a` (0,1,1)) verlieren gegen my-nova.css
     `#footer a:not(.btn)` (1,1,1); die Links rendern deshalb in NOVAs
     #a99e91 und messen 7,22:1 — besser als alles, was hier stuende.
     Die Deklarationen bleiben als Fallback stehen, falls NOVAs Regel
     einmal wegfaellt; sie sind bewusst NICHT hochspezifiziert, weil das
     den Kontrast von 7,22:1 auf 4,51:1 SENKEN wuerde. Praezisierung
     (Review F13): `#copyright a` wurde 21.08. auf das Token umgestellt
     (vorher #7d7367, 4,09:1) — geaendert also schon, nur nicht
     hochspezifiziert; wirksam wird der Wert erst ohne NOVAs Regel. */
  --pz-foot-muted: #847a6d;
}

#footer {
  background: var(--pz-ink);
  color: #a99e91;
  border-top: 1px solid rgba(185, 141, 79, .5);
  padding-top: var(--pz-sek-band); /* pz: Skala statt 96/56-Einzelwerten */
}

/* pz: SPALTENFLUCHT (Review R3). Gemessen 20.08. (1440): #footer-boxes lief
   111…1329 — NOVAs .container bringt `margin:0 95px` + 16px Polster mit und
   verfehlt damit die Inhaltsspalte 120…1320 um 9px. Der Fuss bekommt hier
   EXAKT die .pz-wrap-Geometrie, damit Wortmarke und Fuss-Spalten auf
   derselben Flucht stehen wie Kopf, Hero und alle Sektionen. */
#footer > .container,
#footer > .container-fluid,
#copyright > .container,
#copyright > .container-fluid {
  max-width: 1280px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 40px;
  padding-right: 40px;
}
@media (max-width: 767.98px) {
  #footer > .container,
  #footer > .container-fluid,
  #copyright > .container,
  #copyright > .container-fluid { padding-left: 20px; padding-right: 20px; }
}

/* Spaltenraster (eigener Container aus layout/footer.tpl) */
.pz-fcols {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr 1.25fr;
  gap: 60px 40px;
}
.pz-fcol { min-width: 0; }

.pz-fmark {
  font-family: var(--pz-serif);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: .28em;
  color: #f2ede4;
  text-indent: .28em;
}
.pz-fcol-brand p {
  font-size: 13.5px;
  line-height: 1.8;
  margin-top: 22px;
  max-width: 38ch;
  color: #a99e91;
}
.pz-fphone {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 28px;
  font-family: var(--pz-serif);
  font-size: 26px;
  color: #f2ede4;
}
.pz-fphone:hover { color: var(--pz-gold-lt); }
.pz-fphone svg { width: 18px; height: 18px; color: var(--pz-gold); flex: none; }
.pz-fnote {
  font-size: 11px;
  letter-spacing: .13em;
  text-transform: uppercase;
  color: var(--pz-foot-muted);
  margin-top: 6px;
}

/* Spaltentitel — gilt auch fuer die Titel der CMS-Boxen */
/* pz: ⚠️ #footer-Anker PFLICHT (Fehlerregister 16): my-nova.css setzt
   `#footer .productlist-filter-headline{font-size:.875rem}` mit (1,1,0) —
   eine reine Klassenkette (0,2,0) verliert dagegen still, und die CMS-Box-
   Titel standen in 14px Grau neben unseren 10,5px Gold (19.08. gemessen). */
#footer .pz-fhead,
#footer .pz-fcol .productlist-filter-headline,
#footer .pz-fcol .box-title,
#footer .pz-fcol h4 {
  font-size: 10.5px;
  font-family: var(--pz-sans);
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--pz-gold-lt);
  margin-bottom: 26px;
  border: 0;
}

.pz-fcol ul { list-style: none; margin: 0; padding: 0; }
.pz-fcol li { margin-bottom: 12px; font-size: 13.5px; }
.pz-fcol a { color: #a99e91; }
.pz-fcol a:hover { color: var(--pz-gold-lt); }
.pz-fcol .nav-link { padding: 0; color: #a99e91; font-size: 13.5px; }
.pz-fcol .nav-link:hover { color: var(--pz-gold-lt); }
.pz-fcol p { font-size: 13.5px; line-height: 1.8; color: #a99e91; }
.pz-fpaytext { margin-top: 0; }

/* Zahlarten-Chips (snippets/pz_paychips.tpl): die wirksamen Regeln stehen
   am Dateiende unter "Reviewer F5" — hier stand vorher eine zweite, aeltere
   Fassung derselben Sache (Fehlerregister 17). */

/* Der Widerrufs-Link hat keine eigene Zeile mehr (Reviewer F14) — er steht
   als Textlink in der Bodenleiste, siehe layout/footer.tpl. */

/* ============================================================================
   pz: UNTERE LEISTE — Ben 20.08. (A5a/A5b).
   Gemessen VORHER (1440): MwSt-Fussnote endet y4687, Trennlinie bei y4783
   -> 96px Leerraum zwischen einer einzeiligen Fussnote und der Linie
   darunter; die Copyright-Zeile selbst stand 45px unter der Linie und 50px
   ueber dem Seitenende.
   Beides sind Streifen-Abstaende, keine Sektionsgrenzen — sie kommen jetzt
   aus den Streifen-Stufen der Skala (--pz-sek-nav / --pz-nav-halb) statt aus
   dem Bandmass. Ein Streifen bekommt oben und unten dasselbe Mass. */
#copyright {
  background: var(--pz-ink);
  border-top: 1px solid var(--pz-line-d);
  margin-top: var(--pz-sek-nav);
  padding: var(--pz-nav-halb) 0;
  font-size: 11.5px;
  color: var(--pz-foot-muted);
}
/* NOVAs Container legt 16px oben UND unten drauf — sonst waere die Halbierung
   nur die halbe Wahrheit (Fehlerregister 3: zwei Abstandsebenen uebereinander). */
#copyright > .container,
#copyright > .container-fluid { padding-top: 0; padding-bottom: 0; }
#copyright a { color: var(--pz-foot-muted); }
#copyright a:hover { color: var(--pz-gold-lt); }

/* MwSt-Fussnote */
#footer .small, #footer small { color: var(--pz-foot-muted); }

@media (max-width: 991.98px) {
  /* pz: kein eigener Mobilwert mehr — --pz-sek-band schrumpft in pz-base */
  .pz-fcols { grid-template-columns: 1fr 1fr; gap: 40px 28px; }
  .pz-fcol-brand { grid-column: 1 / -1; }
}
@media (max-width: 575.98px) {
  .pz-fcols { grid-template-columns: 1fr; }
}

/* pz: einheitlich ohne Unterstrich - die Sortiment-Links erbten NOVAs
   underline, die Boxen-Links nicht (gemessen 19.08.) */
.pz-fcol a { text-decoration: none; }

/* ============================================================================
   pz: Mobiler Fuss — CMS-Box-Spalten aufgeklappt zeigen (Reviewer m12).
   Gemessen 19.08. (390): "Informationen" und "Gesetzliche Informationen"
   liegen in `.collapse.d-md-block` mit display:none / Hoehe 0, waehrend die
   eigenen Spalten (Sortiment, Bezahlen & Liefern) offen stehen - zwei
   Bedienlogiken im selben Fuss.
   Entscheidung fuers Offen-Zeigen: in den zugeklappten Boxen stecken
   Impressum, AGB, Datenschutz und Widerrufsrecht. Fehlerregister 14 /
   Lehre I.4: Pflichtangaben gehoeren nicht in ein zugeklapptes Akkordeon.
   ⚠️ Die Boxen werden ueber die Rollen-Klasse .pz-fcol adressiert, NICHT
   ueber #boxNNN - die IDs sind pro Installation verschieden (Lehre I.0). */
@media (max-width: 767.98px) {
  #footer .pz-fcol .collapse,
  #footer .pz-fcol .collapse.d-md-block {
    display: block !important;
    height: auto !important;
    visibility: visible;
  }
  /* Der Klapp-Kopf hat ohne Klappfunktion nichts mehr zu schalten */
  #footer .pz-fcol [data-toggle="collapse"] {
    pointer-events: none;
    cursor: default;
  }
  #footer .pz-fcol [data-toggle="collapse"] .fas,
  #footer .pz-fcol [data-toggle="collapse"] .far,
  #footer .pz-fcol [data-toggle="collapse"]::after { display: none; }
}

/* Die mobile Kopfzeile der CMS-Boxen traegt eine andere Huelle als die
   Desktop-Ueberschrift (Lehre I.0: `.box-normal-link .text-truncate`) -
   sonst stehen zwei Titelschreibweisen im selben Fuss. */
.pz-fcol .box-normal-link,
.pz-fcol .box-normal-link .text-truncate {
  font-size: 10.5px;
  font-family: var(--pz-sans);
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--pz-gold-lt);
  text-decoration: none;
}

/* ============================================================================
   pz: ZAHLARTEN-CHIPS als Raster statt zerfledderter Umbruchzeile
   (Reviewer F5). Gemessen 19.08. (1440): "Nachnahme (zzgl. 2 EUR
   Uebermittlungsentgelt)" 230x50, "Ueberweisung" 103x34 — zwei Kaesten,
   zwei Hoehen, zwei Breiten nebeneinander (Fehlerregister 11: eine Gruppe,
   zwei Hoehenquellen).
   ⚠️ Der Reviewer forderte Zahlarten-ICONS: das Mockup zeigt an beiden
   Stellen (.pays im Footer, .paysm auf der PDP) ausdruecklich TEXT-Kaestchen
   — Icons waeren eine Mockup-Abweichung, nicht die Erfuellung.
   `auto-fit` kollabiert leere Spuren: zwei Chips fuellen die Zeile immer
   vollstaendig aus (Fehlerregister 3b), egal ob 230px-Fussspalte oder
   593px-Kaufspalte. Die Hoehe steht EINMAL am Chip. */
.pz-pays {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 8px;
  margin: 18px 0;
}
.pz-pays span {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: 42px;
  padding: 8px 12px;
  border: 1px solid var(--pz-line-d);
  font-size: 10.5px;
  letter-spacing: .1em;
  line-height: 1.4;
  color: #c9beb2;
  white-space: normal;
}

/* ============================================================================
   pz: SPALTENUEBERSCHRIFTEN AUF EINE GRUNDLINIE (Reviewer F14).
   "Gesetzliche Informationen" bricht auf zwei Zeilen um und schob seine
   Linkliste gegenueber den einzeiligen Nachbarspalten nach unten. Der Titel
   bekommt deshalb die Hoehe von ZWEI Zeilen — dann starten alle Listen auf
   derselben Linie, egal wie lang der Titel ist (dieselbe Logik wie
   min-height an der Produktkarten-Ueberschrift).
   ⚠️ `.box-normal-link` (die MOBILE Klapp-Kopfzeile der CMS-Boxen) bekommt
   die Regel bewusst NICHT: ein `display:block` darauf schlaegt NOVAs
   `d-md-none` und stellt am Desktop jede Box-Ueberschrift ZWEIMAL hin
   (beim ersten Versuch genau so passiert). */
#footer .pz-fhead,
#footer .pz-fcol .productlist-filter-headline,
#footer .pz-fcol .box-title,
#footer .pz-fcol h4 {
  line-height: 1.45;
  min-height: calc(2 * 1.45em);
}

/* ============================================================================
   pz: BODENLEISTE (Mockup .fbottom) — Rechtslinks rechts.
   Markup: layout/footer.tpl, Block layout-footer-copyright-copyright. */
/* pz: Ben 20.08. (A5c) — "Powered by JTL-Shop" gehoert in DIESELBE Zeile wie
   die Copyright-Angabe. NOVA rendert die Credits als eigene Spalte mit
   `ml-auto-util`; sie sass dadurch am rechten Rand und rutschte unterhalb
   von md in eine eigene Zeile (Fehlerregister 10: dieselbe Mechanik verhaelt
   sich je Breakpoint anders).
   Umgesetzt ueber `order` + Aufhebung des ml:auto, das DOM bleibt
   unangetastet: [Copyright][Powered by] links zusammen, Rechtslinks rechts.
   Kein Umbau der Spalten, damit die Tab-Reihenfolge erhalten bleibt. */
#copyright .row {
  align-items: center;
  flex-wrap: wrap;
  row-gap: 8px;
}
/* ⚠️ `flex: 0 1 auto` + min-width:0, NICHT `0 0 auto`: mit starrer Basis
   konnte die einzeilige Copyright-Angabe bei 390px nicht umbrechen und ragte
   462px breit aus dem Viewport (gemessen — scrollWidth 466 gegen 390).
   Fehlerregister 15: ein Flex-Item, das Text traegt, braucht min-width:0. */
#copyright .row > .col:first-child {
  flex: 0 1 auto;
  width: auto;
  max-width: 100%;
  min-width: 0;
}
#copyright #system-credits {
  order: 1;
  flex: 0 0 auto;
  width: auto;
  max-width: none;
  margin-left: 0 !important;
  padding-right: 16px !important;
}
/* Die Rechtslinks bleiben rechts — sie sind der letzte Block der Zeile. */
.pz-fbottom-links { order: 2; margin-left: auto; }
.pz-fbottom-links ul {
  display: flex;
  flex-wrap: wrap;
  gap: 26px;
  list-style: none;
  margin: 0;
  padding: 0;
  justify-content: flex-end;
}
.pz-fbottom-links li { margin: 0; }
.pz-fbottom-links a {
  color: var(--pz-foot-muted);
  font-size: 11.5px;
  text-decoration: none;
  white-space: nowrap;
}
.pz-fbottom-links a:hover { color: var(--pz-gold-lt); }

/* pz: WIDERRUFS-BUTTON (Ben 20.08., A5d — gesetzliche Anforderung: der
   Widerrufs-/Kuendigungsknopf muss als Schaltflaeche erkennbar sein, nicht
   als Textlink zwischen Impressum und AGB).
   Optik = der vorhandene Ghost-Button der CI auf dunklem Grund
   (.pz-btn-ghost-d), nur in Streifen-Groesse — kein neues Button-Muster.
   Die Zeile bleibt einzeilig: der Knopf ist inhaltsbreit und steht am Ende
   der Rechtslink-Reihe. */
.pz-fbottom-links .pz-fbottom-btn {
  display: inline-flex;
  align-items: center;
  padding: 9px 16px;
  border: 1px solid rgba(247, 244, 238, .34);
  color: #e4dbcf;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
}
.pz-fbottom-links .pz-fbottom-btn:hover {
  border-color: var(--pz-gold-lt);
  color: #fff;
}
/* Der Knopf ist hoeher als die Textlinks — die Reihe wird deshalb an der
   Mitte ausgerichtet, sonst haengt er unter der Grundlinie der Nachbarn
   (Fehlerregister 11: eine Gruppe, eine Kante). */
.pz-fbottom-links ul { align-items: center; }

/* ============================================================================
   pz: EIN LINK-RHYTHMUS FUER ALLE FUSS-SPALTEN (Review R3, Fehlerregister 3).
   Gemessen 20.08. (390): "Sortiment" 14/14/15/14 px Abstand, die CMS-Box-
   Spalten 8/8/8 — zwei Rhythmen im selben Fuss, weil unsere <li> ihren
   Abstand aus `margin-bottom` und NOVAs `.nav-link` ihn aus einer eigenen
   Zeilenhoehe bezogen.
   Beide Fassungen greifen jetzt denselben Wert: Zeilenhoehe 1.5 + 12px
   Abstand -> gleiche Schrittweite, egal aus welcher Quelle die Liste kommt. */
/* ⚠️ #footer-Anker PFLICHT (Fehlerregister 16): my-nova.css setzt
   `#footer li{margin-bottom:.5rem}` und `#footer .nav-link{padding:.2rem 0}`
   mit (1,1,0) — die erste Fassung dieser Korrektur stand als reine
   Klassenkette da und verlor still (nachgemessen: li-mb blieb 8px,
   nav-link-Polster blieb 3.2px, Schrittweite 28 gegen 35). */
#footer .pz-fcol li { margin-bottom: 12px; line-height: 1.5; }
#footer .pz-fcol li:last-child { margin-bottom: 0; }
/* ⚠️ `.nav-item` NICHT mitnehmen: in den CMS-Boxen IST das <li> die
   .nav-item — ein `margin:0` darauf hat die 12px der Zeile darueber wieder
   kassiert (gemessen: Schrittweite fiel auf 20/21 statt 32). */
#footer .pz-fcol .nav-link { padding: 0; margin: 0; line-height: 1.5; }

/* ============================================================================
   pz: SUB-FUSSZEILE — EINE ORDNUNG AUF ALLEN BREITEN (Ben 20.08.:
   "hier muss eine SAUBERE Anordnung der bereiche rein").
   Sein Screenshot (390) zeigte VIER Ausrichtungen untereinander: Copyright
   zweizeilig ZENTRIERT, "Powered by JTL-Shop" linksbuendig auf eigener Zeile,
   darunter die Rechtslinks zentriert, darunter der Widerrufs-Knopf —
   dazwischen drei verschiedene Abstaende. Gemessen 20.08. (390): #copyright
   text-align left, aber `.row` und alle Spalten darin text-align CENTER.

   Die Ordnung, die jetzt ueberall gilt:
     >= 768  EINE Zeile:  [© … · Powered by JTL-Shop] …… [Rechtslinks + Knopf]
     <  768  DREI Bloecke, alle linksbuendig, ein Abstand aus der Skala:
               1. Rechtslinks (Impressum · Datenschutz · AGB)
               2. VERTRAG WIDERRUFEN (Knopf — bleibt Knopf, gesetzlich)
               3. Kleingedrucktes (© … / Powered by JTL-Shop)
   Reihenfolge bewusst: die Pflichtlinks und der Widerrufsknopf zuerst, das
   Kleingedruckte zuletzt — nicht umgekehrt, damit der gesetzlich geforderte
   Knopf nicht als letzte Zeile im Fussrauschen untergeht. */
#copyright,
#copyright .row,
#copyright .row > .col,
#copyright #system-credits,
#copyright .pz-fbottom-links { text-align: left; }

@media (max-width: 767.98px) {
  #copyright .row {
    flex-direction: column;
    align-items: flex-start;
    row-gap: var(--pz-nav-halb);
    /* ⚠️ Bootstrap-Gutter aufloesen: die Zeile bringt -16px Randmargin mit,
       die Spalten +16px Polster. Wer nur das Spaltenpolster nullt (erster
       Versuch), verschiebt den ganzen Streifen um 16px nach LINKS — gemessen
       x4 statt x20, waehrend die Fuss-Spalten darueber bei 20 stehen. Beide
       Ebenen muessen weg, dann sitzt der Streifen auf derselben Flucht. */
    margin-left: 0;
    margin-right: 0;
  }
  #copyright .row > .col {
    width: 100%;
    max-width: 100%;
    margin-left: 0 !important;
    padding-left: 0;
    padding-right: 0;
  }
  /* ⚠️ Die Reihenfolge-Regeln brauchen dieselbe Selektorform wie die Regel
     darueber (#id + row + col). Beim ersten Versuch stand `order:1` an
     `#copyright .pz-fbottom-links` (1,1,0) und verlor still gegen
     `#copyright .row > .col` (1,2,0) — die Bloecke standen dann in der
     DOM-Reihenfolge (Fehlerregister 16: nicht raten, Spezifitaet zaehlen). */
  #copyright .row > .col.pz-fbottom-links { order: 1; }
  #copyright .row > .col:not(.pz-fbottom-links):not(#system-credits) { order: 2; }
  #copyright .row > .col#system-credits { order: 3; margin-top: 4px; }

  /* Die drei Rechtslinks bleiben EINE Reihe; nur der Knopf bekommt seine
     eigene Zeile (flex-basis 100 %) — sonst stapeln vier Zeilen dort, wo
     eine plus ein Knopf genuegen. */
  .pz-fbottom-links ul {
    justify-content: flex-start;
    align-items: center;
    gap: var(--pz-nav-halb) 18px;
    margin-top: 0;
  }
  .pz-fbottom-links .pz-fbottom-btn-li { flex: 0 0 100%; }
  /* ⚠️ FIXES CONSENT-WIDGET (Ben 20.08., Fehlerregister 7).
     Gemessen (390, ans Seitenende gescrollt): #consent-settings-btn liegt
     fixed bei x16-48 / y796-828, der Widerrufs-Knopf bei x20-202 / y796-826
     — deckungsgleich. Der Knopf bekommt deshalb hier nicht nur eine feste
     Reihenfolge, sondern der ganze Streifen am Seitenende den gemessenen
     Freiraum des Widgets: dann schwebt es ueber leerer Flaeche statt ueber
     einer Schaltflaeche. */
  #copyright { padding-bottom: var(--pz-consent-clear); }
}