/* ==========================================================================
   meerjungfrauen-flosse.de - guide pages (inc/ratgeber.php)
   Loaded only on pages below /ratgeber/ and pages with _mjf_ratgeber=1, after marke.css (tokens and components come from there).
   ========================================================================== */

/* 7 Guides ------------------------------------------------------------------ */

.mjf-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;margin:14px 0 0;font-size:14.5px;line-height:1.4;color:var(--mjf-text-2)}
.mjf-meta__teil{display:inline-flex;align-items:center;gap:6px}
.mjf-meta__teil--geprueft{color:var(--mjf-lagune-text);font-weight:600}
.mjf-meta__teil .mjf-icon{width:18px;height:18px;stroke-width:2.6}
.mjf-meta__drucken{min-height:44px;padding:0 16px;border:1px solid var(--mjf-linie);border-radius:999px;background:#fff;color:var(--mjf-tiefsee);font-size:14px;font-weight:600;cursor:pointer}
.mjf-meta__drucken:hover{background:#fff;border-color:var(--mjf-beere);color:var(--mjf-beere)}
.mjf-wrap--ratgeber .mjf-seitenkopf__titel{max-width:28ch}

.mjf-ratgeber{display:grid;gap:20px;padding-block:24px 16px}
.mjf-ratgeber__haupt{min-width:0}
.mjf-inhalt--ratgeber{max-width:72ch}
.mjf-toc__details{background:#fff;border:1px solid var(--mjf-linie);border-radius:14px}
.mjf-toc__titel{display:flex;align-items:center;gap:8px;min-height:52px;padding:8px 16px;font-weight:700;cursor:pointer;list-style:none}
.mjf-toc__titel::-webkit-details-marker{display:none}
.mjf-toc__zahl{font-weight:400;font-size:14px;color:var(--mjf-text-2)}
.mjf-toc__pfeil{margin-left:auto;width:20px;height:20px;transition:transform var(--mjf-dauer)}
.mjf-toc__details[open] .mjf-toc__pfeil{transform:rotate(180deg)}
.mjf-toc__liste{list-style:none;margin:0;padding:0 8px 10px}
.mjf-toc__link{display:block;padding:9px 10px 9px 14px;border-left:3px solid var(--mjf-linie);color:var(--mjf-text-2);font-size:15px;line-height:1.35;text-decoration:none;border-radius:0 8px 8px 0;transition:color var(--mjf-dauer),background-color var(--mjf-dauer),border-color var(--mjf-dauer)}
.mjf-toc__link:hover{color:var(--mjf-beere);background:var(--mjf-grund)}
.mjf-toc__link[aria-current="true"]{border-left-color:var(--mjf-beere);color:var(--mjf-beere);background:var(--mjf-mauve-hell);font-weight:600}

.mjf-werkzeugkasten{background:var(--mjf-meer-hell);border-radius:14px;padding:14px}
.mjf-werkzeugkasten__titel{font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--mjf-text-2);margin:2px 4px 10px}
.mjf-werkzeugkasten__liste{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.mjf-werkzeugkasten__link{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px;padding:10px;border-radius:12px;background:#fff;color:var(--mjf-tiefsee);text-decoration:none;transition:box-shadow var(--mjf-dauer),transform var(--mjf-dauer)}
.mjf-werkzeugkasten__link:hover{box-shadow:var(--mjf-schatten);transform:translateY(-1px)}
.mjf-werkzeugkasten__name{display:block;font-weight:700;font-size:15px;line-height:1.3}
.mjf-werkzeugkasten__zeile{display:block;font-size:13.5px;line-height:1.35;color:var(--mjf-text-2)}
.mjf-werkzeugkasten--seite{display:none}
.mjf-werkzeugkasten--unten{margin-top:32px}

.mjf-quellen{margin-top:40px;padding-top:22px;border-top:1px solid var(--mjf-linie);max-width:72ch}
.mjf-quellen__titel{font-size:20px;margin:0 0 10px}
.mjf-quellen__liste{margin:0;padding-left:1.4em;font-size:15px;line-height:1.5}
.mjf-quellen__liste li{margin:.4em 0}
.mjf-quellen__liste li::marker{color:var(--mjf-text-2);font-variant-numeric:tabular-nums}
.mjf-quellen__host{font-size:13px;color:var(--mjf-text-2)}
.mjf-quellen__stand{font-size:14px;color:var(--mjf-text-2);margin:14px 0 0}

@media (min-width:1024px){
  .mjf-ratgeber{grid-template-columns:minmax(0,72ch) 300px;justify-content:space-between;gap:48px;padding-top:36px}
  .mjf-ratgeber__seite{grid-column:2;grid-row:1}
  .mjf-ratgeber__haupt{grid-column:1;grid-row:1}
  .mjf-ratgeber__klebt{position:sticky;top:20px;display:flex;flex-direction:column;gap:16px;max-height:calc(100vh - 40px);overflow-y:auto;scrollbar-width:thin}
  .mjf-werkzeugkasten--seite{display:block}
  .mjf-werkzeugkasten--unten{display:none}
}

@media print{
  .mjf-ratgeber__seite,.mjf-werkzeugkasten,.mjf-meta__drucken{display:none}
  .mjf-ratgeber{display:block;padding:0}
  .mjf-inhalt--ratgeber,.mjf-quellen{max-width:none}
  .mjf-quellen a::after{content:" (" attr(href) ")";font-size:8.5pt;word-break:break-all;color:#333}
}