.tav-gallery{display:grid;grid-template-columns:repeat(var(--tav-columns,4),minmax(0,1fr));gap:var(--tav-gap,12px);width:100%;box-sizing:border-box;margin:16px 0}.tav-tile{min-width:0;text-align:center}.tav-visual{display:block;position:relative;overflow:hidden}.tav-visual img{display:block;width:100%;height:var(--tav-height,150px);object-fit:cover;box-sizing:border-box}.tav-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:12px;box-sizing:border-box;color:#fff;background:rgba(0,0,0,.32);font-size:clamp(14px,1.6vw,23px);font-weight:700;line-height:1.25;text-align:center;text-shadow:0 1px 4px rgba(0,0,0,.7);overflow-wrap:anywhere}.tav-image-link{display:block;text-decoration:none!important}.tav-image-link:hover .tav-overlay{background:rgba(0,0,0,.45)}.tav-button{display:inline-block;margin-top:10px;padding:8px 14px;border:1px solid currentColor;text-decoration:none!important;background:transparent;color:inherit}.tav-button:hover{opacity:.75}.tav-auto-wrapper{list-style:none!important;width:100%;clear:both;box-sizing:border-box}.tav-auto-wrapper .tav-gallery{margin-top:0}@media(max-width:600px){.tav-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:360px){.tav-gallery{grid-template-columns:1fr}}

/* v1.2: instelbare blokbreedte en geen verticale witruimte */
.tav-gallery{width:var(--tav-width,100%)!important;max-width:100%;margin:0 auto!important;padding:0!important;row-gap:0!important;column-gap:var(--tav-gap,12px)!important}
.tav-auto-wrapper{margin-top:0!important;margin-bottom:0!important;padding-top:0!important;padding-bottom:0!important}
.tav-tile{margin-top:0!important;margin-bottom:0!important;padding-top:0!important;padding-bottom:0!important}
.tav-visual,.tav-image-link{margin:0!important;padding:0!important}

/* v1.5: afzonderlijk instelbare witruimte boven en onder. */
.tav-gallery{margin-top:var(--tav-space-top,0px)!important;margin-bottom:var(--tav-space-bottom,0px)!important;}
.tav-auto-wrapper .tav-gallery{margin-top:var(--tav-space-top,0px)!important;margin-bottom:var(--tav-space-bottom,0px)!important;}

/* v1.6: ruimte werkt ook bij automatisch ingevoegde LI-elementen. */
.tav-auto-wrapper{margin-top:0!important;margin-bottom:0!important;}
.tav-gallery{margin-top:var(--tav-space-top,0px)!important;margin-bottom:var(--tav-space-bottom,0px)!important;}
.tav-auto-wrapper .tav-gallery{margin-top:var(--tav-space-top,0px)!important;margin-bottom:var(--tav-space-bottom,0px)!important;}

/* v1.7: verticale witruimte is interne ruimte en kan niet samenvallen met artikelmarges. */
.tav-gallery, .tav-auto-wrapper .tav-gallery{
  margin-top:0!important; margin-bottom:0!important;
  padding-top:var(--tav-space-top,0px)!important;
  padding-bottom:var(--tav-space-bottom,0px)!important;
  box-sizing:border-box!important;
}

/* v1.8: knop IN afbeelding; overlaytekst normaal gewicht */
.tav-gallery .tav-tile{position:relative!important;}
.tav-gallery .tav-overlay{font-weight:400!important;padding-bottom:48px!important;}
.tav-gallery .tav-button{position:absolute!important;z-index:5!important;bottom:12px!important;left:50%!important;transform:translateX(-50%)!important;margin:0!important;max-width:calc(100% - 20px)!important;box-sizing:border-box!important;white-space:normal!important;background:rgba(255,255,255,.92)!important;color:#222!important;border:1px solid rgba(255,255,255,.85)!important;padding:7px 13px!important;text-align:center!important;font-size:14px!important;font-weight:400!important;line-height:1.3!important;border-radius:3px!important;}
.tav-gallery .tav-button:hover{background:#fff!important;opacity:1!important;}

/* v1.9: groene knop op afbeelding, witte normale tekst erboven */
.tav-gallery .tav-overlay{color:#fff!important;font-weight:400!important;padding-bottom:55px!important;}
.tav-gallery .tav-button{background:#527b49!important;color:#fff!important;border:1px solid #527b49!important;font-weight:400!important;}
.tav-gallery .tav-button:hover,.tav-gallery .tav-button:focus{background:#40653a!important;color:#fff!important;border-color:#40653a!important;opacity:1!important;}

/* v2.0: instelbare grootte van de witte overlaytekst, onafhankelijk van de knop */
.tav-gallery .tav-overlay{font-size:var(--tav-text-size,20px)!important;font-weight:400!important;color:#fff!important;}

/* v2.1: Kennisbank-stijl: zeer donkergroen met subtiele goudkleurige rand. */
.tav-gallery .tav-button,
.tav-gallery .tav-button:visited {
  background:#19291f!important;
  color:#f4e9d2!important;
  border:1px solid #a18a53!important;
  border-radius:2px!important;
  font-weight:400!important;
  letter-spacing:.08em;
  box-shadow:none!important;
}
.tav-gallery .tav-button:hover,
.tav-gallery .tav-button:focus {
  background:#263b2c!important;
  color:#fff7e6!important;
  border-color:#b9a16b!important;
  opacity:1!important;
}

/* v2.2: gewone tekst en veilige HTML/shortcode onder elkaar op de afbeelding */
.tav-gallery .tav-overlay-text,.tav-gallery .tav-overlay-custom{display:block;color:#fff!important;font-size:inherit!important;font-weight:400!important;}
.tav-gallery .tav-overlay-custom > :first-child{margin-top:0!important;}
.tav-gallery .tav-overlay-custom > :last-child{margin-bottom:0!important;}
.tav-gallery .tav-overlay-custom a{color:#fff!important;}

/* v2.3: instelbare donkere laag per afbeeldingenblok, ook bij hover. */
.tav-gallery .tav-overlay, .tav-gallery .tav-image-link:hover .tav-overlay { background:rgba(0,0,0,var(--tav-overlay-opacity,0.10))!important; }

/* Alleen twee gerichte correcties: geen laag op shortcode/HTML, ook zonder afbeelding. */
.tav-gallery .tav-overlay:has(.tav-overlay-custom){background:transparent!important;text-shadow:none!important;filter:none!important;backdrop-filter:none!important;}
.tav-gallery .tav-overlay-custom,.tav-gallery .tav-overlay-custom *{text-shadow:none!important;filter:none!important;backdrop-filter:none!important;opacity:1!important;}
.tav-gallery .tav-no-image{height:auto;min-height:var(--tav-height,150px);overflow:visible;display:block;}
.tav-gallery .tav-no-image .tav-overlay-text,.tav-gallery .tav-no-image .tav-overlay-custom{color:inherit!important;text-shadow:none!important;}
.tav-gallery .tav-no-image .tav-overlay-custom a{color:inherit!important;}

/* Alleen correctie: alle kaders en afbeeldingen dezelfde ingestelde hoogte. */
.tav-gallery .tav-tile,.tav-gallery .tav-visual,.tav-gallery .tav-no-image,.tav-gallery .tav-image-link{height:var(--tav-height,150px)!important;min-height:0!important;max-height:var(--tav-height,150px)!important;box-sizing:border-box!important;}
.tav-gallery .tav-visual{overflow:hidden!important;}
.tav-gallery .tav-visual img{width:100%!important;height:100%!important;object-fit:cover!important;}

/* v2.4.2: verduistering onafhankelijk van tekst of HTML, tekst blijft helder. */
.tav-gallery .tav-visual:has(> img)::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:rgba(0,0,0,var(--tav-overlay-opacity,0.10))!important;}
.tav-gallery .tav-visual:has(> img) > .tav-overlay{background:transparent!important;z-index:2;}
.tav-gallery .tav-visual:has(> img) > .tav-overlay:has(.tav-overlay-custom){background:transparent!important;}

/* Mobiel en smalle schermen: afbeeldingen altijd onder elkaar. */
@media screen and (max-width: 768px) {
  .tav-gallery, .tav-auto-wrapper .tav-gallery {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* v2.4.3: knop en zoekbalk circa 20px hoger op de afbeelding. */
.tav-gallery .tav-button{bottom:32px!important;}
.tav-gallery .tav-overlay-custom form:has(input[type="search"]),
.tav-gallery .tav-overlay-custom form:has(input[name="s"]),
.tav-gallery .tav-overlay-custom .wp-block-search{transform:translateY(-20px);}

/* Knoppen blijven donkergroen; alleen bij hover worden ze goudkleurig. */
.tav-gallery .tav-button,
.tav-gallery .tav-button:visited {
  background:#19291f!important;
  color:#f4e9d2!important;
  border-color:#a18a53!important;
  transition:background-color .2s ease,border-color .2s ease,color .2s ease!important;
}
.tav-gallery .tav-button:hover {
  background:#bda46b!important;
  color:#19291f!important;
  border-color:#d5bd82!important;
}

/* v2.4.4: knoppositie per blok instelbaar in het beheer. */
.tav-gallery .tav-button{bottom:var(--tav-button-bottom,32px)!important;}
