/* Core scroller behavior */
.mobile-swipe--scroller{overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;scroll-behavior:smooth;touch-action:pan-x pan-y pinch-zoom}
/* Force flex even if core sets grid on .wp-block-post-template */
.wp-block-post-template.mobile-swipe--flex,
.mobile-swipe--scroller.mobile-swipe--flex{display:flex!important;flex-wrap:nowrap}
.mobile-swipe-child{scroll-snap-align:start;scroll-snap-stop:always}
.mobile-swipe--scroller::-webkit-scrollbar{height:0;display:none}
.mobile-swipe--scroller{scrollbar-width:none;-ms-overflow-style:none}
/* Navigation Scrollbar extra verstecken */
.mobile-swipe-navi::-webkit-scrollbar{height:0;width:0;display:none}
.mobile-swipe-navi{scrollbar-width:none;-ms-overflow-style:none}
.linkbox{cursor:pointer}
.linkbox{position:relative}
.linkbox__overlay{position:absolute;inset:0;z-index:1;text-decoration:none}
.linkbox :is(a, button):not(.linkbox__overlay){position:relative;z-index:2}
.mobile-swipe-navi .mobile-swipe-child {
   margin: revert;
   margin-right: -18px;
}

/* Mobile Sticky Navigation */
@media (max-width: 782px) {
  .mobile-swipe-navi {
    /* kein transition - sofortiger Wechsel */
  }
  .mobile-swipe-navi.is-sticky {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    z-index: 1000;
    background: #f5f0e7;
    padding: 10px 0;
    margin: 0 !important;
    max-width: none !important;
    box-sizing: border-box;
    scroll-padding-left: 50px !important;
  }
  /* Sticky: Spacer links passend zum Container-Padding (24px), rechts 20px */
  .mobile-swipe-navi.is-sticky::before {
    content: "" !important;
    display: block !important;
    flex: 0 0 24px !important;
    min-width: 24px;
  }
  .mobile-swipe-navi.is-sticky::after {
    content: "" !important;
    display: block !important;
    flex: 0 0 20px !important;
    min-width: 20px;
  }
  /* Platzhalter wenn fixed, damit Content nicht springt */
  .mobile-swipe-navi-placeholder {
    display: none;
  }
  .mobile-swipe-navi-placeholder.is-active {
    display: block;
  }
  .mobile-swipe-navi a {
    transition: background-color 0.3s ease;
  }
  .mobile-swipe-navi.is-sticky a.is-active-nav {
    background: #ffffff;
  }
}
/* Optional: set per-container width, e.g.
   .mobile-swipe-container { --mobile-swipe-item-width: 360px; }
*/

@media (max-width: 782px) {
  /* Negative margins = Parent-Padding (global/root padding) ausgleichen */
  .mobile-swipe-container {
    --swipe-offset: var(--wp--style--root--padding-left, var(--wp--preset--spacing--30, 1.5rem));
    margin-right: calc(-1 * var(--swipe-offset));
    margin-left: calc(-1 * var(--swipe-offset));
  }
  .wp-block-query.mobile-swipe-container {
    margin-right: calc(-1 * var(--swipe-offset));
    margin-left: calc(-1 * var(--swipe-offset));
  }
  .wp-block-group.is-layout-grid.mobile-swipe-container {
    margin-right: calc(-1 * var(--swipe-offset));
    margin-left: calc(-1 * var(--swipe-offset));
  }
  .wp-block-group.alignwide.mobile-swipe-container,
  .wp-block-query.alignwide.mobile-swipe-container {
    margin-right: calc(-1 * var(--swipe-offset));
    margin-left: calc(-1 * var(--swipe-offset));
  }
  
  /* Swipe-Container direkt in has-global-padding: wie alignfull behandeln */
  .has-global-padding > .alignwide.mobile-swipe-container,
  .has-global-padding > .wp-block-group.alignwide > .mobile-swipe-container {
    max-width: none !important;
    width: calc(100% + 2 * var(--swipe-offset));
    margin-left: calc(-1 * var(--swipe-offset)) !important;
    margin-right: calc(-1 * var(--swipe-offset)) !important;
  }
  /* Utility-Klassen: Breite der Kinder über Container-Klasse steuern */
  .mobile-swipe-container.width-120px{--mobile-swipe-item-width:120px}

  .mobile-swipe-dots{display:flex;justify-content:center;gap:.35rem;margin-top:1.5rem}
  .mobile-swipe-dot{
    width:4px;height:4px;display:block;border:0;padding:0;border-radius:50%;
    background:#c8c8c8;opacity:.7;transition:opacity .2s;cursor:pointer;
    -webkit-appearance:none;appearance:none;line-height:0;box-sizing:content-box
  }
  .mobile-swipe-dot.is-active{background:#111;opacity:1}
  /* Spacer rechts und links, Items ohne Außenabstand */
  .mobile-swipe--scroller > .mobile-swipe-child:first-child{margin-left:0}
  .mobile-swipe--scroller > .mobile-swipe-child:last-child{margin-right:0}
  .mobile-swipe--scroller::before{content:"";flex:0 0 var(--swipe-offset, 1.5rem)}
  .mobile-swipe--scroller::after{content:"";flex:0 0 var(--swipe-offset, 1.5rem)}
  /* Navigation: feste Spacer links (0) und rechts, konsistent mit sticky */
  .mobile-swipe-navi.mobile-swipe--scroller::before{content:"";flex:0 0 0}
  .mobile-swipe-navi.mobile-swipe--scroller::after{content:"";flex:0 0 20px}
  /* Gleichhöhe ohne feste Werte: Scroller streckt Items; Items erlauben Streckung; Innenkolumne füllt Höhe */
  .mobile-swipe--scroller{align-items:stretch!important}
  .mobile-swipe--scroller > .mobile-swipe-child{align-self:stretch}
  .mobile-swipe--scroller .stretch-vertical{display:flex;flex-direction:column;height:auto}
  .mobile-swipe--scroller .stretch-vertical > :last-child{margin-top:auto}
}
