/* =========================================================
   legal.css – Rechtstexte (Datenschutz, Impressum) + FAQ
   - erkennbare Links (blau, gepunktet unterstrichen)
   - Layout für die Datenschutzerklärung
   Einbindung: $extra_css = ['/assets/css/legal.css'];
   ========================================================= */
:root{
  --link:light-dark(#0b5fd1,#6db3ff);
  --link-hover:light-dark(#073f91,#b3d7ff);
  --link-line:light-dark(rgba(11,95,209,.7),rgba(109,179,255,.75));
}

/* ---------- Links ---------- */
.legal a:not(.btn),
.faq-main a,
.faq-intro a,
body .faq-help a{
  color:var(--link);
  text-decoration-line:underline;
  text-decoration-style:dotted;
  text-decoration-thickness:2px;
  text-decoration-color:var(--link-line);
  text-underline-offset:.22em;
  overflow-wrap:anywhere;
  transition:color .15s,text-decoration-color .15s;
}
.legal a:not(.btn):hover,
.faq-main a:hover,
.faq-intro a:hover,
body .faq-help a:hover{
  color:var(--link-hover);
  text-decoration-style:solid;
  text-decoration-color:currentColor;
}
.legal a:focus-visible,.faq-main a:focus-visible,.faq-intro a:focus-visible{border-radius:3px}

/* ---------- Grundlayout Rechtstexte ---------- */
.legal{line-height:1.75;font-size:.97rem}
.legal p,.legal li,.legal dd{color:var(--text)}
.legal strong,.legal b{font-weight:700}
.legal p+p{margin-top:.85em}
.legal code{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:.84em;font-weight:700;background:var(--panel2);border:1px solid var(--line);padding:2px 7px;border-radius:6px;white-space:nowrap}

/* Einleitung */
.legal-lead{padding:6px 0 6px 20px;border-left:4px solid transparent;border-image:linear-gradient(var(--c1),var(--c6),var(--c5)) 1}
.legal-lead p{font-size:1.02rem}
.legal-courtesy{color:var(--muted);font-size:.85rem;margin-bottom:22px}

/* Inhaltsverzeichnis */
.legal-toc{margin:28px 0 8px;padding:20px 22px;border:1px solid var(--line);border-radius:14px;background:var(--panel2)}
.legal-toc-title{font:700 .78rem 'JetBrains Mono',monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.legal-toc ol{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:4px 28px}
.legal-toc li a{display:flex;gap:10px;align-items:baseline;padding:4px 0;line-height:1.4}
.legal-toc .n{flex:none;min-width:1.6em;font:700 .82rem 'JetBrains Mono',monospace;color:var(--t6)}

/* Abschnitte */
.legal-sec{margin-top:34px;padding-top:26px;border-top:1px solid var(--line);scroll-margin-top:96px}
.legal-sec h3{display:flex;align-items:center;gap:14px;font-size:1.3rem;line-height:1.3;margin-bottom:16px}
.legal-num{flex:none;min-width:38px;height:38px;padding:0 8px;display:grid;place-items:center;border-radius:11px;background:var(--brand);color:#fff;font:700 .95rem 'JetBrains Mono',monospace;box-shadow:0 4px 14px rgba(147,18,234,.3)}
.legal-sec h4{font-size:1.02rem;margin:22px 0 6px;color:var(--t6)}
.legal-sec h4+p{margin-top:0}

/* Listen */
.legal-toc ol{padding:0}
.legal-sec ul,.legal-sec ol{padding-left:22px;margin:12px 0;display:flex;flex-direction:column;gap:7px}
.legal li::marker{color:var(--c6);font-weight:700}

/* Definitions-/Rechte-Listen: Begriff fett, Beschreibung darunter */
.legal dl{display:flex;flex-direction:column;gap:12px;margin:6px 0}
.legal dl>div{padding:12px 16px;border-left:3px solid var(--c5);border-radius:0 12px 12px 0;background:color-mix(in srgb,var(--c5) 7%,transparent)}
.legal dt{font-weight:700;font-family:'Chakra Petch',Inter,sans-serif;font-size:1.02rem;margin-bottom:3px;color:var(--t5)}

/* Hinweisboxen */
.legal-note,.legal-hint{margin-top:18px;padding:14px 18px;border-radius:0 12px 12px 0;border-left:4px solid var(--c5);background:color-mix(in srgb,var(--c5) 9%,transparent)}
.legal-hint{border-left-color:var(--c2);background:color-mix(in srgb,var(--c2) 10%,transparent)}
.legal-label{display:block;margin-bottom:4px;font:700 .74rem 'JetBrains Mono',monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--t5)}
.legal-hint .legal-label{color:var(--t2)}
.legal-note p,.legal-hint p{margin:0!important}

/* Adressblock */
.legal-addr{display:block;width:fit-content;max-width:100%;margin:12px 0;padding:14px 20px;font-style:normal;line-height:1.7;border:1px solid var(--line);border-left:4px solid var(--c6);border-radius:12px;background:var(--panel2)}

/* ---------- Impressum ---------- */
.legal h3{font-size:1.15rem}

@media(max-width:600px){
  .legal{font-size:.94rem}
  .legal-toc ol{grid-template-columns:1fr}
  .legal-sec h3{font-size:1.15rem}
  .legal code{white-space:normal;overflow-wrap:anywhere}
}

/* ---------- Matomo-Opt-Out-iFrame ---------- */
.optout-box{margin:16px 0 4px;padding:6px 10px;border:1px solid var(--line);border-left:4px solid var(--c6);border-radius:12px;background:var(--panel2);box-shadow:var(--shadow);max-width:100%}
.optout-box .optout-frame{display:block;width:100%;height:170px;border:0;background:transparent;color-scheme:light dark}
@media(max-width:600px){.optout-box{padding:4px 6px}.optout-box .optout-frame{height:210px}}