/* =====================================================
   VaBene Eatwell – Speisen App Layout
   Übernommen vom dine-in Layout, angepasst auf eatwell /menue (page-id-20915).
   ===================================================== */
/* Kein horizontaler Scroll */
body.page-id-20915 .wp-site-blocks,
body.page-id-19021 .wp-site-blocks{
  overflow-x:clip!important;
}

/* Mobile: Layout untereinander */
body.page-id-20915 .vb-layout,
body.page-id-19021 .vb-layout{
  display:block!important;
}

/* Produktlisten ohne Bullets */
body.page-id-20915 ul.products,
body.page-id-20915 ul.products li,
body.page-id-19021 ul.products,
body.page-id-19021 ul.products li{
  list-style:none!important;
}
body.page-id-20915 ul.products li::marker,
body.page-id-19021 ul.products li::marker{
  content:none!important;
}

/* Mobile Abstand zwischen Karten */
@media (max-width:767px){
  body.page-id-20915 ul.products li.product,
  body.page-id-19021 ul.products li.product{
    margin-bottom:10px!important;
  }
}

/* Sidebar-Bullets entfernen */
.vb-sidebar ul,
.vb-sidebar ul li,
.vb-sidebar ul li::marker{
  list-style:none!important;
  list-style-type:none!important;
}
.vb-sidebar ul{
  margin:0!important;
  padding:0!important;
}
.vb-sidebar ul li{
  margin:0!important;
  padding:0!important;
}

/* Mobile: Sidebar ausblenden */
@media (max-width:767px){
  body.page-id-20915 .vb-sidebar,
  body.page-id-19021 .vb-sidebar{
    display:none!important;
  }
}

/* Header auf Speisen/Getränke ausblenden */
body.page-id-20915 .wp-block-template-part[area="header"],
body.page-id-19021 .wp-block-template-part[area="header"],
body.page-id-20915 header.wp-block-template-part,
body.page-id-19021 header.wp-block-template-part{
  display:none!important;
}

/* Voll-Breite für .entry-content/.wp-block-post-content – bei ALLEN Breiten,
   nicht nur Desktop: WordPress's eigenes .alignfull-Padding-Cancelling greift
   auf Mobile nicht zuverlässig (Breite bleibt bei einer schmaleren, falschen
   Breite hängen), wodurch das verschachtelte .vb-speisen-app (das IMMER,
   auch mobil, full-bleed sein will) relativ zu einem zu schmalen Elternteil
   rechnet und dadurch nach links rutscht. */
body.page-id-20915 .wp-block-post-content,
body.page-id-20915 .entry-content,
body.page-id-19021 .wp-block-post-content,
body.page-id-19021 .entry-content{
  width:calc(100vw - var(--vb-sbw, 0px))!important;
  max-width:calc(100vw - var(--vb-sbw, 0px))!important;
  margin-left:calc(50% - 50vw + var(--vb-sbw, 0px)/2)!important;
  margin-right:calc(50% - 50vw + var(--vb-sbw, 0px)/2)!important;
  box-sizing:border-box;
}

/* Tablet/Desktop Layout */
@media (min-width:768px){

  body.page-id-20915 .wp-block-post-content,
  body.page-id-20915 .entry-content,
  body.page-id-19021 .wp-block-post-content,
  body.page-id-19021 .entry-content{
    padding-left:var(--vb-page-pad)!important;
    padding-right:var(--vb-page-pad)!important;
  }

  body.page-id-20915 .vb-layout,
  body.page-id-19021 .vb-layout{
    display:grid!important;
    grid-template-columns:260px 1fr;
    gap:20px;
    align-items:start;
    width:100%!important;
    max-width:100%!important;
  }

  body.page-id-20915 .vb-content,
  body.page-id-19021 .vb-content{
    min-width:0!important;
    max-width:100%!important;
  }

  body.page-id-20915 .vb-content > *,
  body.page-id-19021 .vb-content > *{
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
  }

  body.page-id-20915 .vb-sidebar,
  body.page-id-19021 .vb-sidebar{
    position:sticky;
    top:var(--vb-sticky-top,80px);
    align-self:start;
  }

  body.page-id-20915 ul.products,
  body.page-id-19021 ul.products{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:18px!important;
    margin:0!important;
    padding:0!important;
    justify-items:stretch;
    align-items:start;
  }
  body.page-id-20915 ul.products li.product,
  body.page-id-19021 ul.products li.product{
    min-width:0!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box;
  }

  body.page-id-20915 .vb-floating-menu,
  body.page-id-19021 .vb-floating-menu,
  body.page-id-20915 #vbFabSafe,
  body.page-id-20915 #vbPanelSafe,
  body.page-id-19021 #vbFabSafe,
  body.page-id-19021 #vbPanelSafe{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }
}

/* Sidebar-Offset */
body.page-id-20915 .vb-sidebar,
body.page-id-19021 .vb-sidebar{
  margin-top:27px;
}

/* Kategorie-Section Glas */
.vb-layout .vb-content .vbdi-cat-section{
  position:relative;
  width:calc(100vw - 16px);
  max-width:1920px;
  margin-left:50%;
  transform:translateX(-50%);
  margin-top:8px;
  margin-bottom:28px;
  padding:10px 10px 10px;
  border-radius:24px;
  background:rgba(255,255,255,.12);
  -webkit-backdrop-filter:blur(0px) saturate(100%);
          backdrop-filter:blur(0px) saturate(100%);
  border:1px solid rgba(255,255,255,.28);
  box-shadow:0 10px 28px rgba(0,0,0,.14);
  overflow:hidden;
  box-sizing:border-box;
}
.vb-layout .vb-content .vbdi-cat-section .vbdi-cat-header h2,
.vb-layout .vb-content .vbdi-cat-section .vbdi-cat-header .vbdi-cat-subtitle{
  color:#2d2d2d!important;
}
@media (min-width:768px){
  .vb-layout .vb-content .vbdi-cat-section{
    width:calc(100% - 20px);
    max-width:1500px;
    margin-left:auto;
    margin-right:auto;
    transform:none;
  }
}
@media (min-width:1280px){
  .vb-layout .vb-content .vbdi-cat-section{
    width:calc(100% - 10px);
    max-width:1800px;
  }
}

/* Sidebar Buttons */
.vb-sidebar .vb-menu a{
  display:block;
  padding:12px 16px;
  border-radius:999px;
  text-decoration:none;
  font-weight:600;
  color:#000;
  background:#f5f5f5;
  transition:background .2s,color .2s;
}
.vb-sidebar .vb-menu a.active{
  background:#008a67;
  color:#fff;
}

/* Glas-Sidebar mit aktivem Button */
.vb-layout .vb-sidebar{
  position:sticky;
  top:0;
  align-self:start;
  padding:10px 14px;
  border-radius:22px;
  background:rgba(255,255,255,.05);
  -webkit-backdrop-filter:blur(8px) saturate(120%);
          backdrop-filter:blur(8px) saturate(120%);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 8px 22px rgba(0,0,0,.12);
}
.vb-layout .vb-sidebar .vb-menu ul{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.vb-layout .vb-sidebar .vb-menu ul li a{
  display:block;
  padding:10px 16px;
  border-radius:999px;
  text-align:center;
  font-weight:600;
  color:#2d2d2d;
  background:transparent;
  border:1px solid transparent;
  text-decoration:none;
  transition:background .25s ease,color .25s ease,transform .2s ease;
}
.vb-layout .vb-sidebar .vb-menu ul li a:hover{
  color:#d7fff2;
  transform:scale(1.03);
}
.vb-layout .vb-sidebar .vb-menu ul li.active a,
.vb-layout .vb-sidebar .vb-menu ul li a.is-active{
  background:rgba(0,138,103,.9);
  color:#fff!important;
  border:1px solid rgba(0,138,103,.9);
  -webkit-backdrop-filter:blur(8px) saturate(140%);
          backdrop-filter:blur(8px) saturate(140%);
  box-shadow:0 0 14px rgba(0,138,103,.45);
  transform:scale(1.03);
}
@media (min-width:768px){
  .vb-layout .vb-sidebar .vb-menu ul li a{
    padding:12px 18px;
    font-size:1rem;
  }
}
.vb-sidebar .vb-menu ul{
  padding:0;
  margin:0;
}
.vb-sidebar .vb-menu li{
  list-style:none;
  margin:10px 0;
}
.vb-sidebar .vb-menu a{
  margin:0 10px;
  padding:12px 22px;
  border-radius:30px;
  text-decoration:none;
  color:#fff;
  border:1px solid transparent;
  background:transparent;
  -webkit-backdrop-filter:none;
          backdrop-filter:none;
  box-shadow:none;
  transition:filter .15s ease,box-shadow .15s ease,background .15s ease,border-color .15s ease;
}

/* Floating Menu */
.vb-floating-menu{
  position:fixed;
  bottom:80px;
  right:16px;
  display:flex;
  flex-direction:column;
  gap:10px;
  z-index:9999;
}
.vb-floating-menu .vb-float-link{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:10px 16px;
  font-size:15px;
  font-weight:600;
  color:#2d2d2d;
  background:none;
  border:2px solid #ccc;
  border-radius:999px;
  text-decoration:none;
  transition:all .2s ease;
}
.vb-floating-menu .vb-float-link:hover{
  border-color:#008a67;
  color:#008a67;
}
#vbPanelSafe .vbLinkSafe{
  box-shadow:none!important;
}

/* Produkt-UL in Content ohne Bullets */
body.page-id-20915 .vb-content ul,
body.page-id-19021 .vb-content ul{
  list-style:none!important;
  list-style-type:none!important;
  padding-left:0!important;
  margin-left:0!important;
}
body.page-id-20915 .vb-content ul li,
body.page-id-19021 .vb-content ul li{
  list-style:none!important;
  list-style-type:none!important;
}
body.page-id-20915 .vb-content ul li::marker,
body.page-id-19021 .vb-content ul li::marker{
  content:""!important;
}







/* =====================================================
   VB SPEISEN APP – VIP LANDING OHNE RELOAD
   Sauberer Gesamtblock
   ===================================================== */

/* Sichtbarkeit */
body.page-id-20915 .vb-speisen-landing[hidden],
body.page-id-20915 .vb-speisen-menu[hidden]{
  display:none!important;
}

/* Seite / App bis nah an den Bildschirmrand */
body.page-id-20915 .wp-site-blocks,
body.page-id-20915 .wp-block-post-content,
body.page-id-20915 .entry-content{
  padding-top:0!important;
  margin-top:0!important;
}

body.page-id-20915 .vb-speisen-app{
  width:calc(100vw - var(--vb-sbw, 0px))!important;
  max-width:calc(100vw - var(--vb-sbw, 0px))!important;
  margin-left:calc(50% - 50vw + var(--vb-sbw, 0px)/2)!important;
  margin-right:calc(50% - 50vw + var(--vb-sbw, 0px)/2)!important;
  padding-left:0px!important;
  padding-right:0px!important;
  box-sizing:border-box!important;
}

/* =========================
   LANDING HEADER
========================= */

body.page-id-20915 .vb-shop-header{
  width:100%!important;
  max-width:none!important;
  margin:0 0 26px!important;
  padding:10px 10px 10px!important;
  box-sizing:border-box!important;
}

body.page-id-20915 .vb-shop-header-top{
  position:relative!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  gap:16px!important;
  width:100%!important;
}

body.page-id-20915 .vb-shop-header-copy{
  width:100%!important;
  min-width:0!important;
  padding-right:72px!important;
  box-sizing:border-box!important;
}

body.page-id-20915 .vb-shop-header-copy h1{
  margin:0!important;
  font-size:46px!important;
  line-height:.96!important;
  font-weight:900!important;
  letter-spacing:-.055em!important;
  color:#111827!important;
  white-space:nowrap!important;
}

body.page-id-20915 .vb-shop-intro{
  margin:8px 0 0!important;
  font-size:23px!important;
  line-height:1.25!important;
  font-weight:400!important;
  color:#6b7280!important;
  max-width:none!important;
  white-space:normal!important;
}

body.page-id-20915 .vb-shop-header-logo{
  position:absolute!important;
  right:0!important;
  top:0!important;
  flex:0 0 auto!important;
  width:62px!important;
  height:62px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  margin:0!important;
}

body.page-id-20915 .vb-shop-header-logo img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  display:block!important;
}

/* =========================
   LANDING CATEGORY CARDS
========================= */

body.page-id-20915 .vb-shop-categories{
  width:auto!important;
  max-width:none!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:16px!important;
  margin:18px 15px 0!important;
  padding-bottom:calc(100px + env(safe-area-inset-bottom))!important;
  box-sizing:border-box!important;
}

body.page-id-20915 .vb-shop-category-card{
  position:relative!important;
  display:grid!important;
  grid-template-columns:118px 1fr!important;
  align-items:stretch!important;
  width:100% !important;
  max-width:none!important;
  min-height:98px!important;
  margin:0!important;
  padding:0 !important;
  border:1px solid #ececec!important;
  border-radius:20px!important;
  background:#fff!important;
  overflow:hidden!important;
  color:#111827!important;
  box-shadow:0 8px 24px rgba(0,0,0,.06)!important;
  cursor:pointer!important;
  appearance:none!important;
  text-align:left!important;
  font-family:inherit!important;
}

body.page-id-20915 .vb-shop-category-media{
  position:relative!important;
  width:100%!important;
  min-width:0!important;
  height:100%!important;
  min-height:98px!important;
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  background:#f3f3f3!important;
}

body.page-id-20915 .vb-shop-category-media.has-image{
  background:transparent!important;
}

body.page-id-20915 .vb-shop-category-media::after{
  content:""!important;
  position:absolute!important;
  top:0!important;
  right:0!important;
  bottom:0!important;
  width:22px!important;
  pointer-events:none!important;
  z-index:2!important;
  background:linear-gradient(
    to right,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.65) 60%,
    #fff 100%
  )!important;
}

body.page-id-20915 .vb-shop-category-placeholder,
body.page-id-20915 .vb-shop-category-image{
  width:100%!important;
  height:100%!important;
  display:block!important;
}

body.page-id-20915 .vb-shop-category-placeholder{
  background:#ececec!important;
}

body.page-id-20915 .vb-shop-category-image{
  object-fit:cover!important;
  object-position:center center!important;
}

body.page-id-20915 .vb-shop-category-content{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
  min-width:0!important;
  height:100%!important;
  padding:0 18px!important;
  background:#fff!important;
  box-sizing:border-box!important;
}

body.page-id-20915 .vb-shop-category-title-wrap{
  min-width:0!important;
}

body.page-id-20915 .vb-shop-category-title{
  margin:0!important;
  font-size:19px!important;
  line-height:1.08!important;
  font-weight:900!important;
  color:#111827!important;
  letter-spacing:-.02em!important;
}

body.page-id-20915 .vb-shop-category-arrow{
  flex:0 0 36px!important;
  width:36px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:28px!important;
  line-height:1!important;
  color:#111827!important;
  opacity:.75!important;
}

/* =========================
   CATEGORY VIEW TOPBAR
========================= */

body.page-id-20915 .vb-speisen-topbar{
  position:sticky!important;
  top:0!important;
  z-index:40!important;
  display:grid!important;
  grid-template-columns:52px minmax(0,1fr)!important;
  align-items:center!important;
  gap:12px!important;
  width:100%!important;
  max-width:none!important;
  min-height:82px!important;
  margin:0 0 18px!important;
  padding:10px 5px!important;
  box-sizing:border-box!important;
  background:rgba(245,245,245,.54)!important;
  
    box-shadow:0 8px 20px rgba(0,0,0,.08)!important;
  
  border-bottom:1px solid rgba(17,24,39,.08)!important;
  backdrop-filter:blur(14px) saturate(140%)!important;
  -webkit-backdrop-filter:blur(14px) saturate(140%)!important;
}

body.page-id-20915 .vb-speisen-back{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:52px!important;
  height:52px!important;
  border:0!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.94)!important;
  color:#111827!important;
  box-shadow:0 8px 20px rgba(0,0,0,.08)!important;
  cursor:pointer!important;
}

body.page-id-20915 .vb-speisen-back span{
  font-size:34px!important;
  line-height:1!important;
  font-weight:900!important;
  transform:translateY(-1px)!important;
}

body.page-id-20915 .vb-speisen-topbar-text{
  min-width:0!important;
}

body.page-id-20915 .vb-speisen-topbar-text h1{
  margin:0!important;
  font-size:24px!important;
  line-height:1.05!important;
  font-weight:900!important;
  letter-spacing:-.025em!important;
  color:#111827!important;
}

body.page-id-20915 .vb-speisen-topbar-text p{
  margin:4px 0 0!important;
  font-size:13px!important;
  line-height:1.35!important;
  color:#5b6472!important;
}

/* =========================
   CATEGORY VIEW CONTENT
========================= */

body.page-id-20915 .vb-speisen-menu .vbdi-cat-header{
  display:none!important;
}

body.page-id-20915 .vb-speisen-menu .vb-sidebar{
  display:none!important;
}

body.page-id-20915 .vb-speisen-menu .vb-layout{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
}

body.page-id-20915 .vb-speisen-menu .vb-content{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0 15px!important;
  box-sizing:border-box!important;
}

body.page-id-20915 .vb-speisen-menu .vbdi-cat-section{
  width:100%!important;
  max-width:none!important;
  margin:0 0 28px!important;
  transform:none!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

body.page-id-20915 .vb-speisen-menu ul.products{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:14px!important;
}

body.page-id-20915 .vb-speisen-menu ul.products li.product{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
}

/* =========================
   RESPONSIVE
========================= */

@media (max-width:390px){
  body.page-id-20915 .vb-speisen-app{
    padding-left:7px!important;
    padding-right:7px!important;
  }

  body.page-id-20915 .vb-shop-header-copy h1{
    font-size:42px!important;
  }

  body.page-id-20915 .vb-shop-intro{
    font-size:21px!important;
  }

  body.page-id-20915 .vb-shop-header-logo{
    width:58px!important;
    height:58px!important;
  }
}

@media (min-width:1024px){
  body.page-id-20915 .vb-speisen-app{
    padding-left:18px!important;
    padding-right:18px!important;
  }

  body.page-id-20915 .vb-shop-categories{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:20px!important;
    margin-top:24px!important;
  }

  body.page-id-20915 .vb-shop-category-card{
    display:block!important;
    min-height:0!important;
    border-radius:28px!important;
    overflow:visible!important;
  }

  body.page-id-20915 .vb-shop-category-media{
    height:260px!important;
    min-height:260px!important;
    border-radius:28px!important;
  }

  body.page-id-20915 .vb-shop-category-media::after{
    display:none!important;
  }

  body.page-id-20915 .vb-shop-category-placeholder,
  body.page-id-20915 .vb-shop-category-image{
    height:260px!important;
    border-radius:28px!important;
  }

  body.page-id-20915 .vb-shop-category-content{
    position:absolute!important;
    left:12px!important;
    right:12px!important;
    bottom:12px!important;
    height:auto!important;
    padding:16px 64px 18px 18px!important;
    background:rgba(255,255,255,.38)!important;
    border:1px solid rgba(255,255,255,.35)!important;
    border-radius:22px!important;
    backdrop-filter:blur(16px) saturate(140%)!important;
    -webkit-backdrop-filter:blur(16px) saturate(140%)!important;
    box-shadow:0 8px 24px rgba(0,0,0,.10), inset 0 1px 0 rgba(255,255,255,.28)!important;
  }

  body.page-id-20915 .vb-shop-category-title{
    font-size:28px!important;
  }

  body.page-id-20915 .vb-shop-category-arrow{
    position:absolute!important;
    right:26px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    width:auto!important;
    font-size:42px!important;
  }
}



/* =========================
   PRODUKT GRID TABLET/DESKTOP
   Nur Kategorieansicht
========================= */

@media (min-width:768px){

  body.page-id-20915 .vb-speisen-menu ul.products{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:18px!important;
    align-items:start!important;
  }

  body.page-id-20915 .vb-speisen-menu ul.products li.product{
    width:100%!important;
    margin:0!important;
  }

}

@media (min-width:1200px){

  body.page-id-20915 .vb-speisen-menu ul.products{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:22px!important;
  }

}


/* FINAL: Kategorie-Leiste oben sticky + Produkte passend darunter */
body.page-id-20915 .vb-speisen-topbar{
  position:sticky !important;
  top:0 !important;
  z-index:999999 !important;
  margin-top:-72px !important;
  margin-bottom:0 !important;
  transform:none !important;
}

body.page-id-20915 .vb-speisen-menu .vb-content{
  padding-top:0 !important;
}

body.page-id-20915 .vb-speisen-menu .vbdi-cat-section{
  padding-top:0 !important;
  margin-top:10px !important;
}

body.page-id-20915 .vb-speisen-menu ul.products{
  margin-top:0 !important;
}