/* ============================================================
   Lagertechnik Direkt — Paket P15: Recht & Cookie-Consent
   Enthält:  (1) DSGVO-Cookie-Banner + Einstellungs-Modal
             (2) Prose-/Layout-Styles für die Rechtsseiten
   Tokens kommen aus assets/css/site.css (--ink, --red, --line …).
   Wird von consent.js (Banner/Modal) und den Rechtsseiten genutzt.
   ============================================================ */

/* ====================== 1 · COOKIE-CONSENT ====================== */

/* Banner — fixiert unten, deckt visuell den Live-Dev-Banner ab,
   solange noch keine Entscheidung getroffen wurde. */
.ld-consent{
  position:fixed;left:50%;bottom:18px;transform:translateX(-50%);
  z-index:9000;width:min(640px,calc(100% - 28px));
  /* Design-Refresh 2026-07-16 P6: flaches Panel statt Gradient (Layout unberührt) */
  background:var(--panel,#fff);
  border:1px solid var(--line-2,#333a47);border-radius:var(--r-lg,22px);
  box-shadow:var(--sh-2,0 18px 50px -20px rgba(0,0,0,.7));
  padding:20px 22px;color:var(--text,#eef1f6);
  font-family:'Inter',system-ui,sans-serif;font-size:var(--fs-base);line-height:1.55;
  /* Bei niedrigem/schmalem Viewport NIE die Buttons unter den Bildschirmrand schieben (Ludwig
     2026-07-12: „Cookie-Anzeige nicht wegdrücken"). Flex-Spalte + auf die Viewporthöhe gedeckelt;
     nur der Fließtext scrollt, Kopf + Buttons bleiben immer sichtbar/klickbar. overflow:hidden
     verhindert das frühere Überlaufen (max-height + overflow:visible schob die Buttons off-screen). */
  display:flex;flex-direction:column;
  max-height:calc(100dvh - 36px);overflow:hidden;
}
.ld-consent[hidden]{display:none}
.ld-consent__head,.ld-consent__actions{flex:none}   /* Kopf + Buttons pinnen (nur der Text schrumpft) */
@media (prefers-reduced-motion:no-preference){
  .ld-consent{animation:ld-consent-in .35s cubic-bezier(.2,.7,.2,1)}
}
@keyframes ld-consent-in{from{opacity:0;transform:translate(-50%,16px)}to{opacity:1;transform:translate(-50%,0)}}

.ld-consent__head{display:flex;align-items:center;gap:.6rem;margin-bottom:.5rem}
.ld-consent__head svg{width:20px;height:20px;color:var(--steel-2);flex:none} /* Design-Refresh 2026-07-16 P6: Deko-Kopf-Icon → steel-2 */
.ld-consent__title{font-family:'Sora',sans-serif;font-weight:var(--fw-bold);font-size:var(--fs-lg);letter-spacing:-.01em}
.ld-consent__text{color:var(--muted-2,#aab2c0);margin:0 0 1rem;min-height:0;overflow-y:auto;overscroll-behavior:contain}
.ld-consent__text a{color:var(--text,#eef1f6);text-decoration:underline;text-underline-offset:2px}
.ld-consent__text a:hover{color:var(--red,#e2001a)}

.ld-consent__actions{display:flex;gap:.6rem;flex-wrap:wrap}
.ld-consent__actions .ld-btn{flex:1 1 auto}

/* Eigene Button-Styles (funktionieren auch ohne site.css-.btn) */
.ld-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  padding:.8em 1.2em;border-radius:var(--r,10px);font-weight:var(--fw-semibold);font-size:var(--fs-base); /* Design-Refresh 2026-07-16 P6: Aktions-Control entpillt */
  font-family:inherit;border:1px solid transparent;cursor:pointer;
  transition:.22s cubic-bezier(.2,.7,.2,1);white-space:nowrap;
}
.ld-btn:focus-visible{outline:2px solid var(--red,#e2001a);outline-offset:2px}
.ld-btn--primary{background:var(--red,#e2001a);color:#fff;box-shadow:var(--sh-red,0 14px 40px -12px rgba(226,0,26,.35))}
.ld-btn--primary:hover{background:var(--red-600,#c4001a)} /* Design-Refresh 2026-07-16 P6: Hover ortsfest (translateY entfernt) */
.ld-btn--ghost{background:var(--panel-2,#f7f9fb);border-color:var(--line-2,#cdd4dd);color:var(--text,#1a1f27)}
.ld-btn--ghost:hover{background:rgba(0,0,0,.04);border-color:var(--steel,#6b7689)}
.ld-btn--link{background:none;border:none;color:var(--muted-2,#39414d);text-decoration:underline;text-underline-offset:2px;padding:.4em .2em;cursor:pointer;font:inherit}
.ld-btn--link:hover{color:var(--text,#1a1f27)}

/* Modal — Detail-Einstellungen / Widerruf */
.ld-modal{position:fixed;inset:0;z-index:9100;display:grid;place-items:center;padding:18px}
.ld-modal[hidden]{display:none}
.ld-modal__backdrop{position:absolute;inset:0;background:rgba(6,7,10,.72);backdrop-filter:blur(4px)}
.ld-modal__dialog{
  position:relative;width:min(620px,100%);max-height:calc(100vh - 36px);overflow:auto;
  /* Design-Refresh 2026-07-16 P6: flaches Panel statt Gradient */
  background:var(--panel,#fff);
  border:1px solid var(--line-2,#333a47);border-radius:var(--r-lg,22px);
  box-shadow:var(--sh-2,0 18px 50px -20px rgba(0,0,0,.7));padding:26px;
}
@media (prefers-reduced-motion:no-preference){
  .ld-modal__dialog{animation:ld-consent-in .3s cubic-bezier(.2,.7,.2,1)}
}
.ld-modal__close{
  position:absolute;top:16px;right:16px;width:36px;height:36px;border-radius:10px;
  display:grid;place-items:center;background:var(--panel-2,#f7f9fb);
  border:1px solid var(--line,#e3e7ec);color:var(--muted-2,#39414d);cursor:pointer;transition:.2s
}
.ld-modal__close:hover{color:var(--text,#1a1f27);background:rgba(0,0,0,.04)}
.ld-modal__close:focus-visible{outline:2px solid var(--red,#e2001a);outline-offset:2px}
.ld-modal h2{font-family:'Sora',sans-serif;font-size:var(--fs-3xl);margin:0 0 .4rem;padding-right:2rem}
.ld-modal__intro{color:var(--muted-2,#aab2c0);margin:0 0 1.2rem;font-size:var(--fs-base)}

/* Kategorie-Reihe mit Switch */
.ld-cat{border:1px solid var(--line,#e3e7ec);border-radius:var(--r,14px);padding:14px 16px;margin-bottom:12px;background:var(--panel-2,#f7f9fb)}
.ld-cat__top{display:flex;align-items:center;justify-content:space-between;gap:14px}
.ld-cat__name{font-weight:var(--fw-semibold);font-size:var(--fs-md)}
.ld-cat__desc{color:var(--muted,#8a93a3);font-size:var(--fs-ms);margin-top:.4rem}

/* Switch (accessible checkbox) */
.ld-switch{position:relative;flex:none;width:46px;height:26px}
.ld-switch input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.ld-switch__track{position:absolute;inset:0;border-radius:999px;background:var(--line-2,#333a47);transition:.22s;pointer-events:none}
.ld-switch__track::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:.22s;box-shadow:0 1px 3px rgba(16,24,40,.18)}
.ld-switch input:checked + .ld-switch__track{background:var(--red,#e2001a)}
.ld-switch input:checked + .ld-switch__track::after{transform:translateX(20px)}
.ld-switch input:focus-visible + .ld-switch__track{outline:2px solid var(--red,#e2001a);outline-offset:2px}
.ld-switch input:disabled{cursor:not-allowed}
.ld-switch input:disabled + .ld-switch__track{opacity:.6}

.ld-modal__actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:18px}
.ld-modal__actions .ld-btn{flex:1 1 auto}
.ld-consent__meta{margin-top:14px;font-size:var(--fs-sm);color:var(--muted,#8a93a3)}

/* Platzhalter für geblockte Drittinhalte (iframe/Karte/Video) */
.consent-ph{
  display:grid;place-items:center;gap:.8rem;text-align:center;padding:28px;
  border:1px dashed var(--line-2,#cdd4dd);border-radius:var(--r,14px);
  background:var(--panel-2,#f7f9fb);color:var(--muted-2,#39414d);font-size:var(--fs-base)
}
.consent-ph b{color:var(--text,#1a1f27);font-weight:var(--fw-semibold)}

@media (max-width:560px){
  .ld-consent__actions{flex-direction:column}
  .ld-consent__actions .ld-btn{width:100%}
  /* Mobile: nur Position/Padding kompakter — die Höhen-Deckelung + der scrollende Fließtext laufen
     jetzt global (Flex-Spalte oben), damit Kopf + Buttons auf JEDEM Viewport sichtbar bleiben. */
  .ld-consent{bottom:10px;padding:16px 18px}
}

/* ====================== 2 · RECHTSSEITEN ====================== */

.legal{padding:clamp(26px,4vw,56px) 0 64px}
.legal .legal-inner{max-width:78ch;margin-inline:auto}
.legal .crumbs{margin-bottom:1rem}
.legal h1{font-size:clamp(1.9rem,3.4vw,2.7rem);margin:0 0 .4rem;overflow-wrap:break-word;hyphens:manual;text-wrap:balance}
.legal .legal-sub{color:var(--muted,#8a93a3);font-size:var(--fs-base);margin:0 0 1.6rem}
.legal h2{font-family:'Sora',sans-serif;font-size:clamp(1.2rem,2vw,1.45rem);margin:2.2rem 0 .6rem;scroll-margin-top:88px;overflow-wrap:anywhere;hyphens:auto}
.legal h3{font-family:'Sora',sans-serif;font-size:var(--fs-lg);margin:1.4rem 0 .4rem;scroll-margin-top:88px;overflow-wrap:anywhere;hyphens:auto}
.legal p,.legal li{color:var(--muted-2,#aab2c0);font-size:var(--fs-md);line-height:1.7;overflow-wrap:anywhere;hyphens:auto;text-align:left}
.legal p{margin:.6rem 0}
.legal a{color:var(--text,#eef1f6);text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}
.legal a:hover{color:var(--red,#e2001a)}
.legal-link-button{
  display:inline;padding:0;border:0;background:none;color:var(--text,#eef1f6);
  font:inherit;text-decoration:underline;text-underline-offset:2px;cursor:pointer
}
.legal-link-button:hover{color:var(--red,#e2001a)}
.legal ul,.legal ol{margin:.6rem 0 .6rem;padding-left:1.3rem}
.legal li{margin:.3rem 0}
.legal strong{color:var(--text,#eef1f6)}
.legal hr{border:none;border-top:1px solid var(--line,#272d38);margin:2rem 0}

/* Definitionsliste (z.B. Impressum-Anschrift) */
.legal dl.legal-data{display:grid;grid-template-columns:auto 1fr;gap:.4rem 1.4rem;margin:1rem 0}
.legal dl.legal-data dt{color:var(--muted,#8a93a3);font-size:var(--fs-base)}
.legal dl.legal-data dd{margin:0;color:var(--text,#eef1f6)}
@media (max-width:520px){.legal dl.legal-data{grid-template-columns:1fr;gap:.1rem 0}.legal dl.legal-data dd{margin-bottom:.6rem}}

/* Hinweis-/TODO-Box (Entwurfswarnung + auszufüllende Daten) */
.legal-note{
  display:flex;gap:.8rem;align-items:flex-start;
  border:1px solid rgba(226,0,26,.4);background:rgba(226,0,26,.08);
  border-radius:var(--r,14px);padding:14px 16px;margin:1.2rem 0;font-size:var(--fs-base);color:var(--muted-2,#aab2c0)
}
.legal-note svg{width:20px;height:20px;color:var(--red,#e2001a);flex:none;margin-top:2px}
.legal-note b{color:var(--text,#eef1f6)}
/* Inline-Platzhalter, der noch von Ludwig zu füllen ist */
.legal .todo{
  background:rgba(226,0,26,.14);border:1px dashed rgba(226,0,26,.5);
  color:var(--text,#eef1f6);border-radius:6px;padding:.05em .45em;font-size:.92em;font-weight:var(--fw-semibold);
  white-space:normal;overflow-wrap:anywhere
}

/* Inhaltsverzeichnis (Sprungmarken) */
.legal-toc{border:1px solid var(--line,#e3e7ec);border-radius:var(--r,14px);background:var(--panel-2,#f7f9fb);padding:16px 18px;margin:0 0 1.8rem}
.legal-toc h2{font-size:var(--fs-xs)!important;line-height:var(--lh-caps);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--muted,#8a93a3);margin:0 0 .7rem!important}
.legal-toc ol{margin:0;padding-left:1.2rem;columns:2;column-gap:2rem}
.legal-toc li{margin:.25rem 0}
.legal-toc a{color:var(--muted-2,#aab2c0);text-decoration:none}
.legal-toc a:hover{color:var(--text,#1a1f27);text-decoration:underline}
@media (max-width:560px){.legal-toc ol{columns:1}}