/* =========================================================
   SWO TOC / Anchor Navigation
   - trennt Elementor TOC Sprungziele von eigenem Button-Anchor
   - nutzt zentrale Variablen für Offsets
   ========================================================= */

/* -------------------------
   Zentrale Variablen
   ------------------------- */

:root {
  --swo-anchor-offset-desktop: 45px;   /* Abstand für TOC auf Desktop */
  --swo-anchor-offset-mobile: 30px;    /* Abstand für TOC auf Mobile */
  --swo-anchor-offset-button: 45px;    /* Offset für Scroll-Up Button */
}

/* -------------------------
   Globale Scroll-Basis
   ------------------------- */

html {
  scroll-behavior: smooth;
}

/* -------------------------
   Eigener Button-Anchor
   Nur für Scroll-Up / Sprung zum TOC-Bereich
   ------------------------- */

.swo-toc-anchor {
  display: block;
  position: relative;
  visibility: hidden;
}

/* =========================================================
   SWO TOC / Anchor Navigation
   - Elementor TOC Anchor + eigene Heading-IDs
   ========================================================= */

/* Desktop / Laptop / Tablet quer */
@media (min-width: 1025px) {
  html {
    scroll-behavior: auto;
    scroll-padding-top: var(--swo-anchor-offset-desktop);
  }

  .wcr-post-content .elementor-menu-anchor,
  .wcr-post-content h2[id],
  .wcr-post-content h3[id] {
    scroll-margin-top: var(--swo-anchor-offset-desktop);
  }
}

/* Tablet hoch + Mobile */
@media (max-width: 1024px) {
  html {
    scroll-behavior: auto;
    scroll-padding-top: var(--swo-anchor-offset-mobile);
  }

  .wcr-post-content .elementor-menu-anchor,
  .wcr-post-content h2[id],
  .wcr-post-content h3[id] {
    scroll-margin-top: var(--swo-anchor-offset-mobile);
  }

  /* Nur für den eigenen Button-Anchor */
  .swo-toc-anchor {
    top: calc(-1 * var(--swo-anchor-offset-button));
  }
}