/* 119.0 - mobiel/tablet: producten eerst, filters alleen op verzoek */
.vh-mobile-filter-open,
.vh-filter-mobile-head{display:none}

@media(max-width:900px){
  /* Op productlijsten neemt de filterkolom geen ruimte meer boven de producten in. */
  .vh-catalog-section:not(.vh-catalog-section--group-landing) .vh-catalog-layout{
    display:block!important;
    grid-template-columns:1fr!important;
  }
  .vh-catalog-section:not(.vh-catalog-section--group-landing) .vh-catalog-results{
    width:100%!important;
    min-width:0!important;
  }

  .vh-catalog-section:not(.vh-catalog-section--group-landing) .vh-filter-panel{
    position:fixed!important;
    z-index:1005!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    top:auto!important;
    width:100%!important;
    max-width:none!important;
    max-height:min(82vh,720px)!important;
    margin:0!important;
    padding:0 16px calc(18px + env(safe-area-inset-bottom))!important;
    overflow:auto!important;
    overscroll-behavior:contain!important;
    background:#fff!important;
    border:1px solid #cfdee7!important;
    border-bottom:0!important;
    border-radius:20px 20px 0 0!important;
    box-shadow:0 -20px 55px rgba(4,34,53,.24)!important;
    transform:translateY(105%)!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transition:transform .22s ease,visibility 0s linear .22s!important;
  }
  .vh-catalog-section:not(.vh-catalog-section--group-landing) .vh-filter-panel.is-mobile-open{
    transform:translateY(0)!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transition:transform .22s ease,visibility 0s!important;
  }

  .vh-filter-mobile-head{
    position:sticky;
    z-index:3;
    top:0;
    display:flex!important;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin:0 -16px 14px;
    padding:14px 16px 12px;
    background:#fff;
    border-bottom:1px solid #e1eaf0;
  }
  .vh-filter-mobile-head strong{
    color:#0b2d45;
    font-size:19px;
    line-height:1.2;
  }
  .vh-filter-mobile-head button{
    min-height:38px;
    padding:0 12px;
    border:1px solid #bfd4df;
    border-radius:9px;
    background:#fff;
    color:#075f92;
    font:inherit;
    font-size:13px;
    font-weight:850;
    cursor:pointer;
  }

  .vh-mobile-filter-open{
    display:inline-flex!important;
    align-items:center;
    justify-content:center;
    min-height:40px;
    padding:0 14px;
    border:1px solid #008acb;
    border-radius:8px;
    background:#eaf7fc;
    color:#075f92;
    font:inherit;
    font-size:13px;
    font-weight:900;
    cursor:pointer;
  }
  .vh-mobile-filter-open.is-active{
    background:#008acb;
    color:#fff;
  }

  /* De producttoolbar staat direct boven het assortiment en blijft compact. */
  .vh-catalog-section:not(.vh-catalog-section--group-landing) .vh-catalog-toolbar{
    min-height:44px!important;
    margin:0 0 12px!important;
    gap:10px!important;
  }
  .vh-catalog-section:not(.vh-catalog-section--group-landing) .vh-catalog-toolbar>div{
    gap:8px!important;
  }

  .vh-mobile-filter-backdrop{
    position:fixed;
    z-index:1004;
    inset:0;
    border:0;
    padding:0;
    background:rgba(7,31,46,.42);
    backdrop-filter:blur(1px);
  }
  .vh-mobile-filter-backdrop[hidden]{display:none!important}
  body.vh-filter-drawer-open{overflow:hidden!important}
  body.vh-filter-drawer-open .houthulp-launcher{display:none!important}

  .vh-mobile-filter-apply{
    position:sticky;
    bottom:calc(-18px - env(safe-area-inset-bottom));
    z-index:3;
    display:block;
    width:calc(100% + 32px);
    min-height:52px;
    margin:18px -16px calc(-18px - env(safe-area-inset-bottom));
    padding:0 16px env(safe-area-inset-bottom);
    border:0;
    border-top:1px solid #dce7ed;
    background:#008acb;
    color:#fff;
    font:inherit;
    font-weight:900;
    cursor:pointer;
  }
}

@media(max-width:760px){
  /* De bestaande mobiele regel zette de filterkaart weer in de pagina; dit overschrijft dat bewust. */
  .vh-catalog-section:not(.vh-catalog-section--group-landing) .vh-filter-panel{
    margin-bottom:0!important;
  }
  .vh-catalog-section:not(.vh-catalog-section--group-landing){
    padding-top:12px!important;
  }
  .vh-catalog-section:not(.vh-catalog-section--group-landing) .vh-catalog-toolbar>strong{
    font-size:13px!important;
  }
  .vh-catalog-section:not(.vh-catalog-section--group-landing) .vh-view-button{
    display:none!important;
  }
}
