/* ==========================================================================
   Geus 2026 — wat Flatsome voor ons deed (sinds 0.5.0, het thema is los van Flatsome)
   Alleen geladen zonder Flatsome (inc/basis.php). Alle regels onder .g26-los.
   1. basis (reset, tekst, knoppen, formulieren, meldingen, tabellen)
   2. pagina's, blog en 404
   3. bouwblokken (de oude Flatsome-shortcodes in de inhoud)
   4. snel bekijken
   5. stappen, winkelwagen, kassa, Mijn account
   ========================================================================== */

/* ---------- 1. basis ---------- */
*, *::before, *::after { box-sizing: border-box; }
/* overflow-x: clip zoals Flatsome: een tooltip of 100vw-blok laat de pagina niet opzij schuiven
 * (op de telefoon schoof de kassa 30 px door .geus-tooltip-text). clip houdt sticky heel. */
body.g26-los { margin: 0; overflow-x: clip; }
:where(.g26-los img), :where(.g26-los video) { max-width: 100%; height: auto; }
:where(.g26-los img) { border-style: none; }
:where(.g26-los figure) { margin: 0; }
:where(.g26-los hr) { border: 0; border-top: 1px solid var(--lijn); margin: 28px 0; }
:where(.g26-los h1), :where(.g26-los h2), :where(.g26-los h3), :where(.g26-los h4), :where(.g26-los h5), :where(.g26-los h6) { margin: 0 0 .5em; line-height: 1.2; font-weight: 700; }
:where(.g26-los h1) { font-size: clamp(28px, 3.2vw, 40px); }
:where(.g26-los h2) { font-size: clamp(23px, 2.4vw, 30px); }
:where(.g26-los h3) { font-size: 21px; }
:where(.g26-los h4) { font-size: 18px; }
:where(.g26-los h5), :where(.g26-los h6) { font-size: 16px; }
:where(.g26-los p) { margin: 0 0 1em; }
:where(.g26-los ul), :where(.g26-los ol) { margin: 0 0 1em; padding-left: 1.3em; }
:where(.g26-los li) { margin-bottom: .25em; }
:where(.g26-los a) { text-decoration-thickness: 1px; text-underline-offset: 2px; }
:where(.g26-los button), :where(.g26-los input), :where(.g26-los select), :where(.g26-los textarea) { font: inherit; color: inherit; }
:where(.g26-los table) { border-collapse: collapse; width: 100%; margin: 0 0 1.4em; }
:where(.g26-los th), :where(.g26-los td) { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--lijn); vertical-align: middle; }
:where(.g26-los blockquote) { margin: 0 0 1.2em; padding: 14px 20px; border-left: 4px solid var(--merk); background: var(--vlak); border-radius: 0 12px 12px 0; }
:where(.g26-los .alignleft) { float: left; margin: 4px 22px 12px 0; }
:where(.g26-los .alignright) { float: right; margin: 4px 0 12px 22px; }
:where(.g26-los .aligncenter) { display: block; margin-inline: auto; }
:where(.g26-los .wp-caption-text), :where(.g26-los figcaption) { font-size: 14px; color: var(--inkt-zacht); margin-top: 6px; }
.screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; word-wrap: normal !important; }
.screen-reader-text:focus, .skip-link:focus { clip: auto !important; clip-path: none; height: auto; width: auto; margin: 0; left: 10px; top: 10px; z-index: 100000; padding: 12px 18px; background: var(--vlak); color: var(--inkt); border-radius: 10px; box-shadow: var(--schaduw); }
:where(.g26-los main) { display: block; min-height: 40vh; }
:where(.g26-los .clear), :where(.g26-los .clearfix::after) { content: ""; display: table; clear: both; }

/* knoppen (Flatsome gaf .button zijn vorm) */
:where(.g26-los .button), :where(.g26-los button.button), :where(.g26-los input[type="submit"]), :where(.g26-los a.button), :where(.g26-los .wp-element-button) {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px; margin: 0 6px 8px 0;
	background-color: var(--merk); color: var(--knop-tekst); border: 2px solid var(--merk);
	font-family: var(--kop-letter); font-weight: 700; font-size: 16px; line-height: 1.2; text-decoration: none; text-align: center;
	cursor: pointer; transition: background-color .15s, border-color .15s, color .15s;
}
:where(.g26-los .button:hover), :where(.g26-los input[type="submit"]:hover), :where(.g26-los .wp-element-button:hover) { background-color: var(--merk-diep); border-color: var(--merk-diep); color: var(--knop-tekst); }
:where(.g26-los .button.is-outline), :where(.g26-los .button.secondary), :where(.g26-los .woocommerce-cart-form .button[name="update_cart"]), :where(.g26-los .woocommerce-form-coupon .button) {
	background-color: transparent; color: var(--merk); box-shadow: none;
}
:where(.g26-los .button.is-outline:hover), :where(.g26-los .button.secondary:hover) { background-color: var(--merk-licht); color: var(--merk-diep); }
:where(.g26-los .button:disabled), :where(.g26-los .button.disabled), :where(.g26-los .button[disabled]) { opacity: .5; cursor: not-allowed; }
:where(.g26-los .button.loading) { opacity: .7; }

/* formulieren */
:where(.g26-los label) { display: block; margin-bottom: 5px; font-weight: 600; font-size: 14.5px; }
:where(.g26-los label.woocommerce-form__label-for-checkbox), :where(.g26-los label.checkbox), :where(.g26-los .woocommerce-form__label-for-checkbox) { display: inline-flex; align-items: center; gap: 8px; font-weight: 500; }
:where(.g26-los .required) { color: var(--accent); text-decoration: none; border: 0; }
:where(.g26-los input[type="checkbox"]), :where(.g26-los input[type="radio"]) { width: 18px; height: 18px; accent-color: var(--merk); margin: 0 6px 0 0; vertical-align: middle; }
:where(.g26-los .form-row) { margin: 0 0 14px; }
:where(.g26-los .form-row-first), :where(.g26-los .form-row-last) { width: calc(50% - 8px); float: left; }
:where(.g26-los .form-row-last) { float: right; }
:where(.g26-los .form-row-wide) { clear: both; }
:where(.g26-los .woocommerce-input-wrapper) { display: block; }
:where(.g26-los .select2-container .select2-selection--single) { height: 44px; border-radius: 12px; border: 1px solid var(--lijn); }
:where(.g26-los .select2-container .select2-selection--single .select2-selection__rendered) { line-height: 42px; padding-left: 14px; }
:where(.g26-los .select2-container .select2-selection--single .select2-selection__arrow) { height: 42px; }
@media (max-width: 560px) {
	:where(.g26-los .form-row-first), :where(.g26-los .form-row-last) { width: 100%; float: none; }
}

/* meldingen van WooCommerce */
.g26-los .woocommerce-message, .g26-los .woocommerce-info, .g26-los .woocommerce-error, .g26-los .woocommerce-noreviews, .g26-los p.no-comments {
	list-style: none; margin: 0 0 18px; padding: 14px 18px; border-radius: 14px; border: 1px solid var(--lijn);
	background: var(--vlak); color: var(--inkt); display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px;
}
.g26-los .woocommerce-message { border-color: var(--goed); background: var(--goed-licht); }
.g26-los .woocommerce-info { border-color: var(--merk); background: var(--merk-licht); }
.g26-los .woocommerce-error { border-color: var(--accent); background: var(--accent-licht); flex-direction: column; align-items: flex-start; }
.g26-los .woocommerce-error li { margin: 0; }
.g26-los .woocommerce-message .button, .g26-los .woocommerce-info .button { order: 2; margin: 0 0 0 auto; padding: 8px 16px; min-height: 0; font-size: 14px; }
/* Knoppen in meldingen ("Bekijk winkelwagen", "Afrekenen"): altijd leesbaar op de merkkleur, ook bij
 * aanwijzen, focus en in donker (de kleuren zijn variabelen). Ook een kale wc-forward-link van een
 * module. Staat er een Afrekenen-knop naast (inc/winkelwagen.php), dan is "Bekijk winkelwagen" de
 * rustige van de twee; zonder :has() (oudere browsers) zijn ze allebei gevuld. */
.g26-los :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) :is(a.button, a.wc-forward) {
	background-color: var(--merk); border: 2px solid var(--merk); color: var(--knop-tekst); text-decoration: none;
}
.g26-los :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) :is(a.button, a.wc-forward):is(:hover, :focus-visible) {
	background-color: var(--merk-diep); border-color: var(--merk-diep); color: var(--knop-tekst);
}
.g26-los :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) a.wc-forward:not(.button) { display: inline-flex; padding: 6px 14px; border-radius: 12px; font-weight: 700; }
.g26-los :is(.woocommerce-message, .woocommerce-info) .button ~ .button { margin-left: 0; }
/* De rustige "Bekijk winkelwagen" in --merk-diep: --merk haalt op het groen van de melding geen 4,5:1. */
.g26-los:not(.woocommerce-checkout) .woocommerce-message a.button:not(.g26-afrekenen):has(~ .g26-afrekenen) { background-color: transparent; border-color: var(--merk-diep); color: var(--merk-diep); }
.g26-los:not(.woocommerce-checkout) .woocommerce-message a.button:not(.g26-afrekenen):has(~ .g26-afrekenen):is(:hover, :focus-visible) { background-color: var(--merk-licht); border-color: var(--merk); color: var(--merk-diep); }
/* Op de kassa zelf (bijv. ?add-to-cart= of een doorsturing daarheen) geen Afrekenen naar dezelfde
 * pagina; "Bekijk winkelwagen" blijft dan de gevulde knop. */
.g26-los.woocommerce-checkout .woocommerce-message .g26-afrekenen { display: none; }
.g26-los .woocommerce-notices-wrapper:empty { display: none; }

/* sterren (beoordelingen) */
.g26-los .star-rating { position: relative; display: inline-block; overflow: hidden; width: 5.4em; height: 1.1em; line-height: 1; font-size: 14px; color: var(--ster); }
.g26-los .star-rating::before { content: "★★★★★"; position: absolute; top: 0; left: 0; color: var(--lijn); letter-spacing: .08em; }
.g26-los .star-rating span { position: absolute; top: 0; left: 0; overflow: hidden; padding-top: 1.5em; }
.g26-los .star-rating span::before { content: "★★★★★"; position: absolute; top: 0; left: 0; letter-spacing: .08em; }

/* paginering: zie het blok "paginering" in g26.css (één plek voor winkel, blog en filter) */

/* ---------- 2. pagina's, blog en 404 ---------- */
.g26-pagina { padding-block: 26px 56px; }
.g26-pagina-titel { margin: 6px 0 22px; }
.g26-pagina.is-gecentreerd .g26-pagina-titel, .g26-pagina.is-overzicht .g26-pagina-titel, .g26-pagina.is-404 .g26-pagina-titel { text-align: center; }
.g26-pagina.is-leeg { padding-top: 0; }
.g26-inhoud { font-size: 16.5px; line-height: 1.7; }
.g26-inhoud > :last-child { margin-bottom: 0; }
.g26-inhoud h2 { margin-top: 1.4em; }
.g26-inhoud h3 { margin-top: 1.2em; }
.g26-inhoud h2:first-child, .g26-inhoud h3:first-child { margin-top: 0; }
.g26-inhoud iframe { max-width: 100%; border: 0; border-radius: 14px; }
.g26-pagina.is-gecentreerd .g26-inhoud > p, .g26-pagina.is-gecentreerd .g26-inhoud > ul, .g26-pagina.is-gecentreerd .g26-inhoud > ol,
.g26-pagina.is-gecentreerd .g26-inhoud > h2, .g26-pagina.is-gecentreerd .g26-inhoud > h3, .g26-pagina.is-gecentreerd .g26-inhoud > h4,
.g26-pagina.is-gecentreerd .g26-inhoud > .g26-ux-accordeon, .g26-pagina.is-gecentreerd .g26-inhoud > table,
/* Een brede tabel staat in een eigen scrolvak; zonder deze regel liep dat vak tot de volle
   breedte terwijl de tekst ernaast op 860 bleef, en dat las als twee verschillende paginas. */
.g26-pagina.is-gecentreerd .g26-inhoud > .g26-tabelwrap,
.g26-pagina.is-bericht .g26-inhoud > *, .g26-pagina.is-bericht .g26-bericht-kop, .g26-pagina.is-bericht .g26-bericht-buren, .g26-pagina.is-bericht .g26-reacties {
	/* 18 okt 2026: geen leeskolom van 860 meer; alle pagina's lopen even breed als de kaartenrij (Mike). */
	max-width: none; margin-inline: auto;
}
.g26-tabelwrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.g26-tabelwrap > table { margin-bottom: 0; }

.g26-pagina.is-bericht .g26-inhoud > .g26-ux-rij, .g26-pagina.is-bericht .g26-inhoud > .g26-ux-sectie { max-width: none; }
.g26-bericht-kop { text-align: center; }
.g26-bericht-datum { color: var(--inkt-zacht); font-size: 14.5px; }
.g26-bericht-foto { margin: 0 auto 28px; }
.g26-bericht-foto img { display: block; width: 100%; max-height: 480px; object-fit: cover; border-radius: var(--radius); }
.g26-bericht-buren { display: flex; justify-content: space-between; gap: 16px; margin-top: 36px; padding-top: 18px; border-top: 1px solid var(--lijn); font-weight: 600; }
.g26-overzicht-uitleg { margin: 0 0 26px; }
.g26-404-zoek { max-width: 560px; margin: 18px 0; }
.g26-404-knoppen { display: flex; flex-wrap: wrap; gap: 10px; }
.g26-pagina.is-404 .g26-inhoud { max-width: 640px; margin-inline: auto; text-align: center; }
.g26-pagina.is-404 .g26-404-zoek { margin-inline: auto; }
.g26-pagina.is-404 .g26-404-knoppen { justify-content: center; }
.g26-reacties { margin-top: 40px; }
.g26-reacties-lijst { list-style: none; padding: 0; }
.g26-reacties-lijst .comment-body { padding: 14px 0; border-bottom: 1px solid var(--lijn); }

/* blogkaartjes (ook [blog_posts]) */
.g26-ux-blog { display: grid; grid-template-columns: repeat(var(--g26-blogkolommen, 3), minmax(0, 1fr)); gap: 18px; margin: 0 0 1.4em; }
.g26-ux-blogkaart { background: var(--vlak); border: 1px solid var(--lijn); border-radius: var(--radius); overflow: hidden; box-shadow: var(--schaduw-klein); }
.g26-ux-blogkaart > a { display: flex; flex-direction: column; height: 100%; color: inherit; text-decoration: none; }
.g26-ux-blogkaart img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; }
.g26-ux-blogkaart-tekst { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.g26-ux-blogkaart h2, .g26-ux-blogkaart h3 { font-size: 19px; margin: 0; }
.g26-ux-blogkaart p { margin: 0; color: var(--inkt-zacht); font-size: 15px; }
.g26-ux-blogkaart-cat { align-self: flex-start; display: inline-block; padding: 3px 10px; border-radius: 999px; background: var(--merk-licht); color: var(--merk-diep); font-size: 12.5px; font-weight: 700; text-decoration: none; }
.g26-ux-blogkaart-verder { margin-top: auto; color: var(--merk); font-weight: 700; font-size: 15px; }
.g26-ux-blogkaart:hover { border-color: var(--merk); }
@media (max-width: 860px) { .g26-ux-blog { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .g26-ux-blog { grid-template-columns: minmax(0, 1fr); } }

/* ---------- 3. bouwblokken ---------- */
.g26-ux-rij { --g26-gat: 20px; display: flex; flex-wrap: wrap; margin-inline: calc(var(--g26-gat) / -2); }
.g26-ux-rij.is-midden { align-items: center; }
.g26-ux-rij.is-onder { align-items: flex-end; }
.g26-ux-rij.is-gecentreerd { justify-content: center; }
.g26-ux-kol { flex: 0 0 calc(var(--g26-span, 12) / 12 * 100%); max-width: calc(var(--g26-span, 12) / 12 * 100%); padding-inline: calc(var(--g26-gat) / 2); padding-bottom: var(--g26-gat); min-width: 0; }
.g26-ux-kol-binnen { height: 100%; padding: var(--g26-kol-padding, 0); }
.g26-ux-rij.heeft-kol-bg > .g26-ux-kol > .g26-ux-kol-binnen { background: var(--g26-kol-bg); border-radius: var(--radius); }
.g26-ux-rij.is-diepte-1 > .g26-ux-kol > .g26-ux-kol-binnen, .g26-ux-kol.is-diepte-1 > .g26-ux-kol-binnen { box-shadow: var(--schaduw-klein); }
.g26-ux-kol-binnen > :last-child { margin-bottom: 0; }
@media (max-width: 849px) {
	.g26-ux-kol { flex-basis: calc(var(--g26-span-md, 12) / 12 * 100%); max-width: calc(var(--g26-span-md, 12) / 12 * 100%); }
	.g26-ux-kol-binnen[style*="--g26-padding-md"] { padding: var(--g26-padding-md) !important; }
	.g26-ux-kol-binnen[style*="--g26-margin-md"] { margin: var(--g26-margin-md) !important; }
	.g26-ux-niet-tablet { display: none !important; }
}
@media (max-width: 549px) {
	.g26-ux-kol { flex-basis: calc(var(--g26-span-sm, 12) / 12 * 100%); max-width: calc(var(--g26-span-sm, 12) / 12 * 100%); }
	.g26-ux-kol.is-eerst-tel { order: -1; }
	.g26-ux-rij[style*="--g26-kol-padding-sm"] > .g26-ux-kol > .g26-ux-kol-binnen { padding: var(--g26-kol-padding-sm); }
	.g26-ux-kol-binnen[style*="--g26-padding-sm"], .g26-ux-sectie[style*="--g26-padding-sm"] { padding: var(--g26-padding-sm) !important; }
	.g26-ux-kol-binnen[style*="--g26-margin-sm"], .g26-ux-beeld[style*="--g26-margin-sm"] { margin: var(--g26-margin-sm) !important; }
	.g26-ux-niet-tel { display: none !important; }
	.g26-ux-tekst[style*="--g26-uitlijning-sm"] { text-align: var(--g26-uitlijning-sm) !important; }
}
@media (min-width: 550px) { .g26-ux-alleen-tel { display: none !important; } }
@media (min-width: 850px) {
	.g26-ux-alleen-tablet { display: none !important; }
	.g26-ux-sectie[style*="--g26-padding-md"] { padding: var(--g26-padding-md) !important; }
}
.g26-ux-verborgen { display: none !important; }

.g26-ux-sectie { position: relative; margin: 0 0 24px; padding: 30px 0; border-radius: var(--radius); overflow: hidden; }
/* Een sectie zonder achtergrond is alleen een groepering: geen eigen lucht erin (de kolommen hebben al 20 px
 * onderaan en de sectie 24 px marge), en de laatste sectie van de pagina geen marge meer boven de paginarand.
 * Op /contact/ stond zo 155 px tussen de betaaliconen en "Contactformulier" en 194 px onder de verzendknop (0.6.3). */
.g26-inhoud > .g26-ux-sectie:not(.heeft-beeld):not(.is-donker):not([style]) { padding-block: 0; }
.g26-inhoud > .g26-ux-sectie:last-of-type { margin-bottom: 0; }
/* wpautop laat losse <br> en lege <p> achter tussen de bouwblokken ([/section]⏎[section], [/col]⏎[col]);
 * elk kost een regelhoogte of een alineamarge zonder dat er iets staat. */
.g26-inhoud > br, .g26-inhoud > p:empty, .g26-ux-sectie-inhoud > br, .g26-ux-sectie-inhoud > p:empty,
.g26-ux-rij > br, .g26-ux-rij > p:empty, .g26-ux-kol-binnen > p:empty { display: none; }
.g26-ux-sectie-beeld { position: absolute; inset: 0; background-size: cover; background-repeat: no-repeat; }
.g26-ux-sectie-laag { position: absolute; inset: 0; }
.g26-ux-sectie-inhoud { position: relative; padding-inline: 20px; }
.g26-ux-sectie.is-donker, .g26-ux-sectie.is-donker h1, .g26-ux-sectie.is-donker h2, .g26-ux-sectie.is-donker h3, .g26-ux-sectie.is-donker a:not(.button) { color: #fff; }

.g26-ux-beeld { width: var(--g26-breedte, 100%); max-width: 100%; margin: 0 0 1em; }
.g26-ux-beeld img { display: block; width: 100%; border-radius: 12px; }
@media (max-width: 849px) { .g26-ux-beeld[style*="--g26-breedte-md"] { width: var(--g26-breedte-md); } }
@media (max-width: 549px) { .g26-ux-beeld[style*="--g26-breedte-sm"] { width: var(--g26-breedte-sm); } }
.g26-ux-kol-binnen[style*="text-align:center"] .g26-ux-beeld, .g26-ux-tekst[style*="text-align:center"] .g26-ux-beeld { margin-inline: auto; }

.g26-ux-titel { margin: 6px 0 16px; }
.g26-ux-titel > * { display: inline-block; margin: 0; padding-bottom: 8px; border-bottom: 3px solid var(--merk); font-size: 18px; letter-spacing: .04em; text-transform: uppercase; }
.g26-ux-titel a { color: inherit; text-decoration: none; }
.g26-ux-gat { display: block; }
.g26-ux-tekst > :last-child { margin-bottom: 0; }
.g26-ux-html { margin: 0 0 1em; }
.g26-ux-paginakop { padding: 30px 20px; border-radius: var(--radius); background: var(--merk); color: #fff; text-align: center; margin: 0 0 20px; }
.g26-ux-paginakop h1 { color: #fff; margin: 0; }

.g26-ux-beeldvak { margin: 0 0 1em; border-radius: var(--radius); overflow: hidden; background: var(--vlak); border: 1px solid var(--lijn); height: calc(100% - 1em); }
.g26-ux-beeldvak > a { display: flex; flex-direction: column; height: 100%; color: inherit; text-decoration: none; }
.g26-ux-beeldvak-foto { position: relative; background: #fff; }
.g26-ux-beeldvak-foto[style*="padding-top"] img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.g26-ux-beeldvak-foto img { display: block; width: 100%; }
.g26-ux-beeldvak-tekst { padding: 12px 14px; text-align: center; font-weight: 700; }
.g26-ux-beeldvak-tekst > :last-child { margin-bottom: 0; }
.g26-ux-beeldvak.is-lichte-tekst .g26-ux-beeldvak-tekst, .g26-ux-beeldvak.is-lichte-tekst .g26-ux-beeldvak-tekst * { color: #fff; }
.g26-ux-beeldvak.is-groot .g26-ux-beeldvak-tekst { font-size: 18px; }
.g26-ux-beeldvak:hover { border-color: var(--merk); box-shadow: var(--schaduw-klein); }

.g26-ux-uitgelicht { display: flex; flex-direction: column; gap: 10px; margin: 0 0 1em; }
.g26-ux-uitgelicht.is-left { flex-direction: row; align-items: flex-start; gap: 16px; }
.g26-ux-uitgelicht.is-center { align-items: center; text-align: center; }
.g26-ux-uitgelicht-beeld img { display: block; height: auto; border-radius: 10px; }
.g26-ux-uitgelicht-titel { font-size: 18px; margin: 0 0 6px; }
.g26-ux-uitgelicht-tekst > :last-child { margin-bottom: 0; }

.g26-ux-producten { margin: 0 0 1.4em; }

.g26-ux-menu { list-style: none; margin: 0 0 1em; padding: 0; }
.g26-ux-menu-item { margin: 0; border-bottom: 1px solid var(--lijn); }
.g26-ux-menu-item a { display: block; padding: 8px 2px; color: var(--inkt); text-decoration: none; }
.g26-ux-menu-item a:hover { color: var(--merk); }
.g26-ux-menu-item.is-kop, .g26-ux-menu-item.is-kop a { font-weight: 700; text-transform: uppercase; font-size: 13px; letter-spacing: .06em; color: var(--inkt-zacht); }
.g26-ux-menu-label { display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px; background: var(--accent); color: #fff; font-size: 11px; font-weight: 700; vertical-align: middle; }

.g26-ux-teamlid { display: flex; gap: 18px; align-items: flex-start; margin: 0 0 1.4em; }
.g26-ux-teamlid-foto { flex: 0 0 140px; }
.g26-ux-teamlid-foto img { width: 140px; height: 140px; object-fit: cover; border-radius: 50%; display: block; }
.g26-ux-teamlid-rol { color: var(--inkt-zacht); margin: -4px 0 8px; }
.g26-ux-teamlid-links { display: flex; flex-wrap: wrap; gap: 12px; font-weight: 600; }
@media (max-width: 560px) { .g26-ux-teamlid { flex-direction: column; } }

.g26-ux-knop { margin: 6px 0 14px; }

.g26-ux-accordeon { margin: 0 0 1.4em; border-top: 1px solid var(--lijn); }
.g26-ux-accordeon-item { border-bottom: 1px solid var(--lijn); }
.g26-ux-accordeon-item > summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 4px; font-family: var(--kop-letter); font-weight: 700; font-size: 17.5px; color: var(--inkt); }
.g26-ux-accordeon-item > summary::-webkit-details-marker { display: none; }
.g26-ux-accordeon-item > summary::after { content: "+"; flex: 0 0 auto; color: var(--merk); font-size: 24px; line-height: 1; }
.g26-ux-accordeon-item[open] > summary::after { content: "–"; }
.g26-ux-accordeon-inhoud { padding: 0 4px 14px; }
.g26-ux-accordeon-inhoud > :last-child { margin-bottom: 0; }

.g26-ux-banner { position: relative; display: flex; align-items: center; justify-content: center; margin: 0 0 24px; border-radius: var(--radius); overflow: hidden; text-align: center; color: #fff; }
.g26-ux-banner-inhoud { position: relative; padding: 24px; }
.g26-ux-banner h1, .g26-ux-banner h2, .g26-ux-banner h3 { color: #fff; }

.g26-ux-melding { margin: 0 0 1.2em; padding: 14px 18px; border-radius: 14px; background: var(--accent-licht); border: 1px solid var(--accent-vlak); }
.g26-ux-melding > :last-child { margin-bottom: 0; }
.g26-ux-streep { height: 3px; width: 60px; background: var(--merk); border-radius: 3px; margin: 10px 0 18px; }
.g26-ux-streep.is-center { margin-inline: auto; }

.g26-ux-categorieen { display: grid; grid-template-columns: repeat(var(--g26-catkolommen, 4), minmax(0, 1fr)); gap: 12px; margin: 0 0 1.4em; }
.g26-ux-categorie { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 12px; border-radius: 14px; background: var(--vlak); border: 1px solid var(--lijn); color: var(--inkt); text-decoration: none; font-weight: 700; text-align: center; }
.g26-ux-categorie img { width: 100%; height: 100px; object-fit: contain; }
.g26-ux-categorie:hover { border-color: var(--merk); color: var(--merk); }
@media (max-width: 860px) { .g26-ux-categorieen { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 560px) { .g26-ux-categorieen { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.g26-ux-prijstabel { padding: 22px; border-radius: var(--radius); background: var(--vlak); border: 1px solid var(--lijn); text-align: center; margin: 0 0 1.4em; }
.g26-ux-prijstabel.is-uitgelicht { border: 2px solid var(--merk); }
.g26-ux-prijstabel-prijs { font: 800 28px/1.2 var(--kop-letter); color: var(--merk); margin: 4px 0 10px; }
.g26-ux-prijstabel ul { list-style: none; padding: 0; margin: 12px 0 0; }
.g26-ux-prijstabel li { padding: 6px 0; border-top: 1px solid var(--lijn); margin: 0; }
.g26-ux-anker { display: block; position: relative; top: -110px; visibility: hidden; }
.g26-ux-blok { margin: 0 0 1em; }

/* ---------- 4. snel bekijken ---------- */
.g26-sk-venster { width: min(980px, calc(100vw - 32px)); max-height: calc(100vh - 48px); padding: 0; border: 0; border-radius: var(--radius); background: var(--vlak); color: var(--inkt); box-shadow: 0 30px 80px rgba(0, 0, 0, .3); overflow: auto; }
.g26-sk-venster::backdrop { background: rgba(31, 42, 46, .5); }
body.g26-snelkijk-open { overflow: hidden; }
.g26-snelkijk-sluit { position: sticky; top: 10px; float: right; z-index: 2; margin: 10px 10px 0 0; width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; border: 1px solid var(--lijn); background: var(--vlak); color: var(--inkt); cursor: pointer; }
.g26-snelkijk-sluit .g26-i { width: 20px; height: 20px; }
.g26-snelkijk-inhoud { padding: 24px; }
.g26-sk-rij { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; align-items: start; }
.g26-sk-hoofdfoto { background: #fff; border-radius: 16px; border: 1px solid var(--lijn); overflow: hidden; position: relative; }
.g26-sk-hoofdfoto img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: contain; }
.g26-sk-duimen { display: flex; gap: 8px; margin-top: 10px; overflow-x: auto; }
.g26-sk-duim { flex: 0 0 64px; height: 64px; padding: 0; border: 2px solid var(--lijn); border-radius: 10px; background: #fff; cursor: pointer; overflow: hidden; }
.g26-sk-duim.is-actief { border-color: var(--merk); }
.g26-sk-duim img { width: 100%; height: 100%; object-fit: contain; display: block; }
.g26-sk-merk { font-size: 12.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--inkt-zacht); margin-bottom: 4px; }
.g26-sk-titel { font-size: 26px; margin: 0 0 10px; }
.g26-sk-titel a { color: var(--inkt); text-decoration: none; }
.g26-sk-info .price { font: 700 22px/1.3 var(--kop-letter); color: var(--inkt); margin: 0 0 10px; }
.g26-sk-info .price del { color: var(--inkt-zacht); font-weight: 400; font-size: 17px; margin-right: 6px; }
.g26-sk-info .price ins { text-decoration: none; color: var(--accent); }
.g26-sk-info .woocommerce-product-details__short-description { color: var(--inkt-zacht); font-size: 15.5px; }
.g26-sk-info form.cart { margin: 14px 0; }
.g26-sk-info table.variations { margin: 0 0 10px; }
.g26-sk-info table.variations th, .g26-sk-info table.variations td { display: block; padding: 4px 0; border: 0; }
.g26-sk-info .single_variation_wrap .woocommerce-variation-price { margin: 6px 0; }
.g26-sk-info .woocommerce-variation-add-to-cart, .g26-sk-info form.cart:not(.variations_form) { display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch; }
.g26-sk-info .quantity input.qty { width: 74px; height: 48px; text-align: center; border-radius: 12px; border: 1px solid var(--lijn); }
.g26-sk-info .single_add_to_cart_button { flex: 1 1 200px; min-height: 48px; }
.g26-sk-info .product_meta { font-size: 14px; color: var(--inkt-zacht); border-top: 1px solid var(--lijn); padding-top: 10px; margin-top: 10px; }
.g26-sk-meer { display: inline-block; margin-top: 10px; font-weight: 700; }
.g26-sk .onsale { position: absolute; top: 10px; left: 10px; padding: 4px 10px; border-radius: 999px; background: var(--accent); color: #fff; font-size: 13px; font-weight: 700; }
@media (max-width: 760px) {
	.g26-sk-rij { grid-template-columns: minmax(0, 1fr); gap: 16px; }
	.g26-snelkijk-inhoud { padding: 16px; }
	.g26-sk-titel { font-size: 22px; }
}

/* ---------- 5. stappen, winkelwagen, kassa, Mijn account ---------- */
.g26-kassastappen { margin: 4px 0 26px; }
.g26-kassastappen ol { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 22px; list-style: none; margin: 0; padding: 0; }
.g26-kassastappen li { margin: 0; display: flex; align-items: center; gap: 8px; color: var(--inkt-zacht); font-family: var(--kop-letter); font-weight: 700; font-size: 17px; }
.g26-kassastappen li + li::before { content: "›"; color: var(--lijn); font-size: 22px; margin-right: 14px; }
.g26-kassastappen a, .g26-kassastappen span { display: inline-flex; align-items: center; gap: 8px; color: inherit; text-decoration: none; }
.g26-stap-nr { display: inline-flex; width: 26px; height: 26px; align-items: center; justify-content: center; border-radius: 50%; border: 2px solid currentColor; font-size: 13px; }
.g26-kassastappen li.is-nu { color: var(--merk); }
.g26-kassastappen li.is-nu .g26-stap-nr { background: var(--merk); border-color: var(--merk); color: #fff; }
/* gedaan: in de merkkleur (eerst groen, maar dat paste niet bij de rest), het nummer wordt een vinkje */
.g26-kassastappen li.is-gedaan { color: var(--merk); }
.g26-kassastappen li.is-gedaan .g26-stap-nr { font-size: 0; }
.g26-kassastappen li.is-gedaan .g26-stap-nr::before { content: "✓"; font-size: 14px; line-height: 1; }
.g26-kassastappen li.is-gedaan a:hover { color: var(--merk-diep); }
@media (max-width: 560px) { .g26-kassastappen li { font-size: 14px; } .g26-kassastappen li + li::before { margin-right: 6px; } }

/* winkelwagen: tabel links, totalen rechts */
.g26-pagina.is-winkelwagen .woocommerce { display: grid; grid-template-columns: minmax(0, 1.75fr) minmax(300px, 1fr); gap: 0 34px; align-items: start; }
.g26-pagina.is-winkelwagen .woocommerce > .woocommerce-notices-wrapper, .g26-pagina.is-winkelwagen .woocommerce > .cart-empty, .g26-pagina.is-winkelwagen .woocommerce > .return-to-shop, .g26-pagina.is-winkelwagen .woocommerce > .wc-empty-cart-message { grid-column: 1 / -1; }
.g26-pagina.is-winkelwagen .woocommerce-cart-form { background: var(--vlak); border: 1px solid var(--lijn); border-radius: var(--radius); padding: 18px 20px; box-shadow: var(--schaduw-klein); }
.g26-pagina.is-winkelwagen .cart-collaterals { position: sticky; top: 20px; }
.g26-pagina.is-winkelwagen .cart_totals { width: 100% !important; float: none !important; background: var(--vlak); border: 1px solid var(--lijn); border-radius: var(--radius); padding: 18px 20px; box-shadow: var(--schaduw-klein); }
.g26-pagina.is-winkelwagen .cart_totals h2 { font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--inkt-zacht); }
.g26-los table.shop_table { border: 0; }
.g26-los table.shop_table td.product-thumbnail img { width: 72px; height: 72px; object-fit: contain; border-radius: 10px; background: #fff; }
.g26-los table.shop_table td.product-remove a.remove { display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center; border-radius: 50%; border: 1px solid var(--lijn); color: var(--inkt-zacht) !important; text-decoration: none; font-size: 18px; }
.g26-los table.shop_table td.product-remove a.remove:hover { border-color: var(--accent); color: var(--accent) !important; }
.g26-los table.shop_table td.product-name a { color: var(--inkt); font-weight: 600; text-decoration: none; }
.g26-los table.shop_table td.actions { padding-top: 16px; }
.g26-los table.shop_table td.actions .coupon { display: inline-flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.g26-los table.shop_table td.actions .coupon input.input-text { width: 180px; }
.g26-los table.shop_table td.actions > .button { float: right; }
.g26-los .wc-proceed-to-checkout .checkout-button { display: flex; width: 100%; margin: 6px 0 0; min-height: 52px; font-size: 18px; }
.g26-los .cross-sells { margin-top: 24px; }
.g26-los .cross-sells > h2 { font-size: 22px; }
.g26-los .return-to-shop .button { margin-top: 10px; }
@media (max-width: 960px) {
	.g26-pagina.is-winkelwagen .woocommerce { grid-template-columns: minmax(0, 1fr); }
	.g26-pagina.is-winkelwagen .cart-collaterals { position: static; margin-top: 20px; }
}
@media (max-width: 760px) {
	/* tabel wordt een lijst: per regel foto links, naam, prijs, aantal en totaal rechts, kruisje rechtsboven */
	.g26-los table.shop_table_responsive, .g26-los table.shop_table_responsive tbody, .g26-los table.shop_table_responsive tr, .g26-los table.shop_table_responsive td { display: block; width: 100%; }
	.g26-los table.shop_table_responsive thead { display: none; }
	.g26-los table.shop_table_responsive td { padding: 6px 0; border: 0; text-align: left; }
	.g26-los .woocommerce-cart-form .cart_item { position: relative; display: grid !important; grid-template-columns: 72px minmax(0, 1fr); column-gap: 14px; row-gap: 4px; padding: 14px 36px 14px 0; border-bottom: 1px solid var(--lijn); }
	.g26-los .woocommerce-cart-form .cart_item > td { padding: 0; }
	.g26-los .woocommerce-cart-form .cart_item > td::before { content: none !important; }
	.g26-los .woocommerce-cart-form .cart_item .product-remove { position: absolute; top: 12px; right: 0; width: auto; }
	.g26-los .woocommerce-cart-form .cart_item .product-thumbnail { grid-column: 1; grid-row: 1 / span 4; }
	.g26-los .woocommerce-cart-form .cart_item .product-thumbnail img { width: 72px; height: 72px; }
	.g26-los .woocommerce-cart-form .cart_item .product-name, .g26-los .woocommerce-cart-form .cart_item .product-price,
	.g26-los .woocommerce-cart-form .cart_item .product-quantity, .g26-los .woocommerce-cart-form .cart_item .product-subtotal { grid-column: 2; }
	.g26-los .woocommerce-cart-form .cart_item .product-price { color: var(--inkt-zacht); font-size: 14px; }
	.g26-los .woocommerce-cart-form .cart_item .product-subtotal { font-weight: 700; }
	.g26-los .woocommerce-cart-form .cart_item .product-quantity { margin: 4px 0; }
	.g26-los table.shop_table_responsive td.actions { padding-top: 14px; }
	.g26-los table.shop_table td.actions > .button { float: none; width: 100%; margin-top: 10px; }
}

/* kassa: gegevens links, overzicht rechts */
.g26-los form.checkout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(320px, 1fr); gap: 0 36px; align-items: start; }
.g26-los form.checkout > * { grid-column: 1; }
.g26-los form.checkout > #order_review_heading, .g26-los form.checkout > #order_review { grid-column: 2; }
.g26-los form.checkout > #order_review_heading { grid-row: 1; margin-top: 0; }
.g26-los form.checkout > #order_review { grid-row: 2 / span 20; position: sticky; top: 20px; background: var(--vlak); border: 1px solid var(--lijn); border-radius: var(--radius); padding: 18px 20px; box-shadow: var(--schaduw-klein); }
.g26-los form.checkout > #customer_details { grid-row: 1 / span 20; }
.g26-los .col2-set .col-1, .g26-los .col2-set .col-2 { width: 100%; float: none; }
.g26-los .col2-set { display: grid; gap: 10px; }
.g26-los form.checkout h3 { font-size: 20px; margin: 14px 0 12px; }
.g26-los #payment { background: transparent; }
.g26-los #payment ul.payment_methods { list-style: none; padding: 0; margin: 0 0 14px; border-top: 1px solid var(--lijn); }
.g26-los #payment ul.payment_methods li { padding: 10px 0; margin: 0; border-bottom: 1px solid var(--lijn); }
.g26-los #payment ul.payment_methods li label { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; }
.g26-los #payment ul.payment_methods li img { max-height: 26px; width: auto; margin-left: 6px; }
.g26-los #payment .payment_box { margin: 8px 0 0; padding: 10px 14px; border-radius: 12px; background: var(--vlak-2); font-size: 14.5px; }
.g26-los #payment .place-order { padding: 6px 0 0; }
.g26-los #place_order { width: 100%; min-height: 54px; font-size: 18px; margin: 10px 0 0; }
.g26-los .woocommerce-terms-and-conditions-wrapper { font-size: 14px; color: var(--inkt-zacht); }
.g26-los .woocommerce-form-login-toggle, .g26-los .woocommerce-form-coupon-toggle { grid-column: 1 / -1; }
@media (max-width: 960px) {
	.g26-los form.checkout { grid-template-columns: minmax(0, 1fr); }
	.g26-los form.checkout > #order_review_heading, .g26-los form.checkout > #order_review, .g26-los form.checkout > #customer_details { grid-column: 1; grid-row: auto; position: static; }
}

/* Mijn account */
.g26-pagina.is-account .woocommerce { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 0 34px; align-items: start; }
.g26-pagina.is-account .woocommerce > :not(.woocommerce-MyAccount-navigation):not(.woocommerce-MyAccount-content) { grid-column: 1 / -1; }
.g26-los .woocommerce-MyAccount-navigation, .g26-los .woocommerce-MyAccount-content { width: 100% !important; float: none !important; }
.g26-los .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 8px; background: var(--vlak); border: 1px solid var(--lijn); border-radius: var(--radius); }
.g26-los .woocommerce-MyAccount-navigation li { margin: 0; }
.g26-los .woocommerce-MyAccount-navigation li a { display: block; padding: 10px 14px; border-radius: 10px; color: var(--inkt); font-weight: 600; text-decoration: none; }
.g26-los .woocommerce-MyAccount-navigation li a:hover { background: var(--merk-licht); }
.g26-los .woocommerce-MyAccount-navigation li.is-active a { background: var(--merk); color: var(--knop-tekst); }
.g26-los .woocommerce-MyAccount-content { background: var(--vlak); border: 1px solid var(--lijn); border-radius: var(--radius); padding: 20px 22px; }
.g26-los .u-columns.col2-set { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; }
/* de formulieren zelf hebben al een kader (g26.css) */
.g26-los .woocommerce-form-login .button, .g26-los .woocommerce-form-register .button { width: 100%; min-height: 48px; margin-top: 6px; }
.g26-los .lost_password { margin-top: 10px; font-size: 14.5px; }
@media (max-width: 860px) {
	.g26-pagina.is-account .woocommerce { grid-template-columns: minmax(0, 1fr); gap: 16px; }
	.g26-los .u-columns.col2-set { grid-template-columns: minmax(0, 1fr); }
}

/* winkelwagen: geen dubbel waardebonveld in de tabel, geen knop "bijwerken" (dat gaat vanzelf) */
.g26-los .woocommerce-cart-form td.actions .coupon, .g26-los .woocommerce-cart-form button[name="update_cart"] { display: none !important; }
.g26-los .woocommerce-cart-form td.actions { text-align: left; }
.g26-los .woocommerce-cart-form td.actions .g26-verder { margin-right: 8px; }
.g26-los .g26-waardebon { margin-top: 14px; padding: 14px 20px; background: var(--vlak); border: 1px solid var(--lijn); border-radius: var(--radius); }
.g26-los .g26-waardebon .widget-title { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 16px; }
.g26-los .g26-waardebon .widget-title .g26-i { width: 18px; height: 18px; color: var(--merk); }
.g26-los .g26-waardebon .coupon { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.g26-los .g26-waardebon .coupon .widget-title { flex: 1 1 100%; }
.g26-los .g26-waardebon input.input-text { flex: 1 1 160px; }
.g26-los .g26-waardebon .button { margin: 0; }

/* aantal met − en + (buiten de productpagina, die heeft eigen regels in g26.css) */
.g26-los .ux-quantity { display: inline-flex; align-items: stretch; border: 1px solid var(--lijn); border-radius: 12px; overflow: hidden; background: var(--vlak); height: 44px; }
.g26-los .ux-quantity.hidden { display: none; }
.g26-los .ux-quantity input.qty { width: 46px; border: 0 !important; border-radius: 0 !important; text-align: center; padding: 0 !important; background: transparent; -moz-appearance: textfield; height: 100%; min-height: 0; box-shadow: none !important; }
.g26-los .ux-quantity input.qty::-webkit-outer-spin-button, .g26-los .ux-quantity input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.g26-los .ux-quantity__button { width: 38px; border: 0; background: transparent; color: var(--inkt); font-size: 20px; line-height: 1; cursor: pointer; padding: 0; }
.g26-los .ux-quantity__button:hover { background: var(--merk-licht); color: var(--merk-diep); }

/* productpagina: wat na de koopknop in dezelfde rij staat (bijv. de voeradvieslink) op een eigen regel, zoals onder Flatsome */
.g26-los .woocommerce-variation-add-to-cart > p, .g26-los form.cart:not(.variations_form) > p, .g26-los .woocommerce-variation-add-to-cart > div:not(.quantity) { flex: 1 1 100%; margin: 12px 0 0; }
.g26-los .g26-sk .g26-sk-info.summary { float: none; width: auto; }

/* invoervelden vol breed, zoals Flatsome ze gaf (zonder gewicht: eigen regels winnen) */
:where(.g26-los) :where(input[type="text"], input[type="email"], input[type="password"], input[type="tel"], input[type="number"]:not(.qty), input[type="search"], input[type="url"], input[type="date"], select, textarea) { width: 100%; max-width: 100%; }
:where(.g26-los) :where(textarea) { min-height: 110px; }

/* Snel bekijken: het mandje vóór "In winkelwagen". De oude stijl (style.css) haalde het uit
 * Flatsome's iconenfont; zonder Flatsome werd dat een leeg vakje. Nu hetzelfde mandje als in de kop. */
.g26-los .product-quick-view-container .single_add_to_cart_button::before {
	content: ""; width: 18px; height: 18px; vertical-align: -3px; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6h15l-1.5 8h-12z'/%3E%3Cpath d='M6 6 5 3H2'/%3E%3Ccircle cx='9' cy='20' r='1.5'/%3E%3Ccircle cx='18' cy='20' r='1.5'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 6h15l-1.5 8h-12z'/%3E%3Cpath d='M6 6 5 3H2'/%3E%3Ccircle cx='9' cy='20' r='1.5'/%3E%3Ccircle cx='18' cy='20' r='1.5'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* zijwagen: aantal met − en + en het subtotaal van de regel (zoals Flatsome's mini-cart) */
.g26-los .g26-wagen .ux-mini-cart-qty { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 8px; }
.g26-los .g26-wagen .woocommerce-mini-cart-item .ux-mini-cart-qty .quantity.ux-quantity { display: inline-flex; margin: 0; height: 34px; border-radius: 10px; }
.g26-los .g26-wagen .ux-mini-cart-qty .ux-quantity__button { width: 30px; font-size: 18px; }
.g26-los .g26-wagen .ux-mini-cart-qty input.qty { width: 36px; font-size: 15px; }
.g26-los .g26-wagen .ux-mini-cart-qty .product-subtotal { font-weight: 700; color: var(--inkt); white-space: nowrap; }
.g26-los .g26-wagen.is-bezig .widget_shopping_cart_content { opacity: .55; pointer-events: none; transition: opacity .15s; }

/* bedankpagina (checkout/thankyou.php uit het oude childthema, met Flatsome's kolommen):
 * links de bestelling, rechts het kader met "Bedankt" en het bestelnummer; op de telefoon dat kader eerst */
.g26-los .woocommerce-order.row { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 0 36px; align-items: start; }
.g26-los .woocommerce-order.row > .large-7 { grid-column: 1; grid-row: 1; }
.g26-los .woocommerce-order.row > .large-5 { grid-column: 2; grid-row: 1; position: sticky; top: 20px; }
.g26-los .woocommerce-order.row > .large-12 { grid-column: 1 / -1; }
.g26-los .woocommerce-order .is-well { background: var(--vlak); border: 1px solid var(--lijn); border-radius: var(--radius); padding: 18px 20px; box-shadow: var(--schaduw-klein); }
.g26-los .woocommerce-thankyou-order-received { font-family: var(--kop-letter); font-size: 21px; font-weight: 700; color: var(--merk-diep); margin: 0 0 8px; }
.g26-los ul.woocommerce-order-overview { list-style: none; padding: 0; margin: 8px 0 0; }
.g26-los ul.woocommerce-order-overview li { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-top: 1px solid var(--lijn); font-size: 15px; color: var(--inkt-zacht); }
.g26-los ul.woocommerce-order-overview li strong { color: var(--inkt); text-align: right; }
@media (max-width: 960px) {
	.g26-los .woocommerce-order.row { grid-template-columns: minmax(0, 1fr); }
	.g26-los .woocommerce-order.row > .large-5 { grid-column: 1; grid-row: 1; position: static; margin-bottom: 20px; }
	.g26-los .woocommerce-order.row > .large-7 { grid-column: 1; grid-row: 2; }
}

/* invoervelden: hoogte en binnenruimte zoals Flatsome ze gaf (zonder stond de eerste letter tegen de
 * ronde hoek) en iets minder rond (Mike, 6 okt). Zelfde gewicht als Flatsome's regel, zodat
 * de eigen opmaak van modules (voerkiezer e.d.) blijft winnen. */
:where(.g26-los) :is(input[type="text"], input[type="email"], input[type="tel"], input[type="password"], input[type="url"], input[type="date"], select) { height: 44px; padding: 0 12px; }
:where(.g26-los) input[type="number"]:where(:not(.qty)) { height: 44px; padding: 0 12px; }
:where(.g26-los) textarea { padding: 10px 12px; }
.g26-los input[type="text"], .g26-los input[type="email"], .g26-los input[type="tel"], .g26-los input[type="number"], .g26-los input[type="password"],
.g26-los input[type="date"], .g26-los select, .g26-los textarea, .g26-los .select2-container .select2-selection--single { border-radius: 8px; }

/* land kiezen met vlaggetjes (g26.js); de keuzelijst blijft voor WooCommerce, maar onzichtbaar */
.g26-landen { display: flex; flex-wrap: wrap; gap: 8px; }
.g26-land { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 14px; border: 1.5px solid var(--lijn); border-radius: 8px; background: var(--vlak); color: var(--inkt); font: inherit; font-weight: 600; cursor: pointer; }
.g26-land svg, .g26-land .g26-land-code { width: 24px; height: 16px; border-radius: 2px; box-shadow: 0 0 0 1px rgba(0, 0, 0, .14); flex: none; }
.g26-land .g26-land-code { display: inline-flex; align-items: center; justify-content: center; font-size: 10px; background: var(--vlak-2); }
.g26-land:hover { border-color: var(--merk); }
.g26-land[aria-checked="true"] { border-color: var(--merk); box-shadow: inset 0 0 0 1px var(--merk); color: var(--merk-diep); background: var(--merk-licht); }
.g26-met-vlaggen select, .g26-met-vlaggen .select2-container { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden; clip: rect(0 0 0 0); opacity: 0; pointer-events: none; }

/* ==========================================================================
   Maatkaarten in de nachtstand (8 oktober 2026)

   Deze regels stonden eerst in g26.css, maar kwamen daar niet door: de browser
   paste wel 'color' en 'outline-offset' uit diezelfde regel toe en niet de
   achtergrond en de rand. In dit tweede stylesheet, dat ná g26.css laadt, doen
   ze het wel. Waarom het in g26.css misgaat is nog niet uitgezocht.
   ========================================================================== */
html[data-theme="dark"] body.g26 .g26-maat {
	background: #262c2f !important;
	border-color: #343c40 !important;
	color: #eef1f0 !important;
}
html[data-theme="dark"] body.g26 .g26-maat:hover { border-color: #4fb2d6 !important; }
html[data-theme="dark"] body.g26 .g26-maat[aria-pressed="true"] {
	background: #1e3540 !important;
	border-color: #4fb2d6 !important;
}
html[data-theme="dark"] body.g26 .g26-maat-per,
html[data-theme="dark"] body.g26 .g26-maat-prijs del { color: #a6b0b4 !important; }

/* ==========================================================================
   Kassa (8 oktober 2026)
   ========================================================================== */

/* Focusstand: smalle kop met logo, "veilig afrekenen" en licht/donker; geen voettekst (kop.php, voet.php) */
.g26-kop.is-focus .g26-kop-rij { justify-content: space-between; padding-block: 10px; }
.g26-focus-rechts { display: flex; align-items: center; gap: 14px; }
.g26-focus-veilig { display: inline-flex; align-items: center; gap: 6px; color: var(--inkt-zacht); font-weight: 600; font-size: 14.5px; }
.g26-focus-veilig svg { width: 18px; height: 18px; color: var(--goed); }
.g26-focus .g26-main { padding-bottom: 48px; }
@media (max-width: 420px) { .g26-focus-veilig > span { display: none; } }

/* "(inclusief € x btw)" op een eigen regel onder het totaal */
.g26 .order-total .includes_tax { display: block; margin-top: 2px; line-height: 1.35; }

/* Nieuwsbriefvinkje: de uitleg als twee punten onder het vinkje, niet achter het label aan */
.g26 #geus_newsletter_optin_field .woocommerce-input-wrapper { display: block; }
.g26 #geus_newsletter_optin_field label.checkbox { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
.g26 #geus_newsletter_optin_field .description { display: block !important; margin: 6px 0 0 30px; padding: 0; color: var(--inkt-zacht); font-size: 14px; line-height: 1.45; }
.g26 #geus_newsletter_optin_field .g26-nb-punt { display: block; position: relative; padding-left: 14px; }
.g26 #geus_newsletter_optin_field .g26-nb-punt::before { content: ""; position: absolute; left: 0; top: .6em; width: 5px; height: 5px; border-radius: 50%; background: var(--merk); }

/* Bezorg-/afhaalkiezer (geus-extras, verzendmethoden) in de nachtstand. De plug-in heeft vaste
   lichte kleuren; zelfde patroon als de maatkaarten hierboven (vaste waarden, !important). */
html[data-theme="dark"] body.g26 .geus-date-picker-container { background: #202527 !important; border-color: #343c40 !important; box-shadow: none !important; }
html[data-theme="dark"] body.g26 .geus-date-picker-container.is-loading::after { background: rgba(23, 26, 28, .7) !important; }
html[data-theme="dark"] body.g26 .geus-shipping-tabs { border-bottom-color: #343c40 !important; }
html[data-theme="dark"] body.g26 .geus-shipping-tab:not(.is-active) { background: #262c2f !important; border-color: #343c40 !important; color: #eef1f0 !important; }
html[data-theme="dark"] body.g26 .geus-shipping-tab:not(.is-active):hover { background: #2c3337 !important; border-color: #4a545a !important; }
html[data-theme="dark"] body.g26 .geus-date-picker-title,
html[data-theme="dark"] body.g26 .geus-slot-date,
html[data-theme="dark"] body.g26 .geus-slot-price,
html[data-theme="dark"] body.g26 .geus-date-list-option { color: #eef1f0 !important; }
html[data-theme="dark"] body.g26 .geus-slot-time { color: #c9d1d4 !important; }
html[data-theme="dark"] body.g26 .geus-date-list-option { background: #262c2f !important; border-color: #343c40 !important; }
html[data-theme="dark"] body.g26 .geus-date-list-option:hover { background: #2c3337 !important; border-color: #4a545a !important; }
html[data-theme="dark"] body.g26 .geus-date-list-option.is-geus-route { background: #1f3328 !important; border-color: #2f5a40 !important; }
html[data-theme="dark"] body.g26 .geus-date-list-option.is-geus-route:hover { border-color: #6fcf8e !important; }
html[data-theme="dark"] body.g26 .geus-date-list-option.is-geus-route .geus-slot-text :not(.geus-slot-date):not(.geus-slot-time) { color: #6fcf8e !important; }
html[data-theme="dark"] body.g26 .geus-date-list-option.is-selected { background: #1e3540 !important; border-color: #4fb2d6 !important; box-shadow: 0 0 0 1px #4fb2d6 !important; }
html[data-theme="dark"] body.g26 .geus-date-list-option.is-geus-route.is-selected { background: #1f3328 !important; }
html[data-theme="dark"] body.g26 .geus-date-list-option.geus-route-blocked,
html[data-theme="dark"] body.g26 .geus-date-list-option.geus-slot-unavailable { background: #1d2224 !important; border-color: #343c40 !important; }
html[data-theme="dark"] body.g26 .geus-route-blocked .geus-slot-text,
html[data-theme="dark"] body.g26 .geus-slot-unavailable .geus-slot-text,
html[data-theme="dark"] body.g26 .geus-slot-unavailable .geus-slot-price { color: #8a959a !important; }
html[data-theme="dark"] body.g26 .geus-route-blocked-note { background: #3a2f1a !important; border-color: #6b5420 !important; color: #f3d48a !important; }
html[data-theme="dark"] body.g26 .geus-slot-ready-note { color: #f0b46a !important; }
html[data-theme="dark"] body.g26 .geus-carrier-logo { border-radius: 3px; }
html[data-theme="dark"] body.g26 .geus-date-list::-webkit-scrollbar-track { background: #202527 !important; }
html[data-theme="dark"] body.g26 .geus-date-list::-webkit-scrollbar-thumb { background: #4a545a !important; }

/* Sneeuwvlokje achter diepvries in zijwinkelwagen, winkelwagen en kassa (inc/vormgeving.php):
   getekend met een masker, omdat WooCommerce <svg> uit de productnaam haalt. */
.g26-vries-los { display: inline-block; width: 15px; height: 15px; margin-left: 5px; vertical-align: -2px; background-color: var(--merk); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2v20M4.9 6l14.2 12M19.1 6 4.9 18'/%3E%3Cpath d='m9 4 3 2 3-2M9 20l3-2 3 2'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2v20M4.9 6l14.2 12M19.1 6 4.9 18'/%3E%3Cpath d='m9 4 3 2 3-2M9 20l3-2 3 2'/%3E%3C/svg%3E") center / contain no-repeat; }

/* Allergie-filter bovenin de filters (geus-extras, mijn-dieren): sinds plugin 1.461.0
   leest het blok zijn kleuren uit de themavariabelen (--inkt, --inkt-zacht, --merk,
   --accent) en volgt daarmee de nachtstand vanzelf; hier is geen uitzondering meer nodig. */

/* Onderrand van de filterbalk: alleen tonen als de knop "alles wissen" er echt staat;
   anders bleef er een leeg licht balkje over. */
.g26 .geus-filters-sidebar__footer:not(:has(> :not([style*="display: none"]):not([style*="display:none"]))) { display: none !important; }
html[data-theme="dark"] body.g26 .geus-filters-sidebar__footer { background: transparent !important; border-color: #343c40 !important; }

/* Uitverkochte maten: duidelijk als "Uitverkocht" gemarkeerd, niet alleen wat vager */
.g26 .g26-maat[data-niet-leverbaar] { opacity: 1; border-style: dashed; background: var(--vlak-2); }
.g26 .g26-maat[data-niet-leverbaar] .g26-maat-naam,
.g26 .g26-maat[data-niet-leverbaar] .g26-maat-prijs,
.g26 .g26-maat[data-niet-leverbaar] .g26-maat-per { color: var(--inkt-zacht); }
.g26 .g26-maat[data-niet-leverbaar] .g26-maat-prijs { text-decoration: line-through; }
.g26 .g26-maat[data-niet-leverbaar]::after { content: "Uitverkocht"; display: block; margin-top: 4px; font-size: 12px; font-weight: 700; color: #c0392b; }
html[data-theme="dark"] body.g26 button.g26-maat[data-niet-leverbaar] { background: #1d2224 !important; border-style: dashed !important; }
html[data-theme="dark"] body.g26 .g26-maat[data-niet-leverbaar]::after { color: #f19a92; }

/* ==========================================================================
   9 oktober 2026 (Mike): bezorgcheck smaller en met vlaggetjes, en de nachtstand voor
   blokken van Geus Extra's die hun lichte kleuren vast (vaak inline) meekrijgen.
   Inline stijlen winnen van alles behalve !important, vandaar die overal hieronder.
   ========================================================================== */

/* Bezorgcheck (module levergebieden): niet meer over de hele breedte, postcode en huisnummer
   naast elkaar, land met vlaggetjes (g26.js, zoals bij het afrekenen) en de knop in de huisstijl. */
.g26 .geus-levergebied-form { max-width: 560px !important; margin: 20px auto !important; padding: 20px !important; background: var(--vlak) !important; border: 1px solid var(--lijn) !important; border-radius: var(--radius) !important; text-align: left; }
.g26 #levergebied-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 8em); gap: 6px 12px; }
.g26 #levergebied-form > * { grid-column: 1 / -1; margin: 0 !important; }
.g26 #levergebied-form > label { margin-top: 8px !important; font-weight: 700 !important; color: var(--inkt); }
.g26 #levergebied-form > label:first-child { margin-top: 0 !important; }
.g26 #levergebied-form > label[for="country-input"] { grid-row: 1; }
.g26 #levergebied-form > :is(.g26-landen, select) { grid-row: 2; }
.g26 #levergebied-form > label[for="postcode-input"] { grid-row: 3; grid-column: 1; }
.g26 #levergebied-form > label[for="huisnummer-input"] { grid-row: 3; grid-column: 2; }
.g26 #levergebied-form > #postcode-input { grid-row: 4; grid-column: 1; }
.g26 #levergebied-form > #huisnummer-input { grid-row: 4; grid-column: 2; }
.g26 #levergebied-form > button { grid-row: 5; }
.g26 #levergebied-form :is(input[type="text"], select) { height: 44px; padding: 0 12px !important; border: 1px solid var(--lijn) !important; border-radius: 8px !important; background: var(--vlak-2) !important; color: var(--inkt) !important; }
.g26 #levergebied-form button[type="submit"] { height: 46px; margin-top: 10px !important; padding: 0 18px !important; border-radius: 10px !important; background: var(--merk) !important; color: var(--knop-tekst) !important; font-weight: 700 !important; }
.g26 #levergebied-form button[type="submit"]:hover { background: var(--merk-diep) !important; }

/* Uitslag van de bezorgcheck en de vaste teksten op Bezorgservice in de nachtstand */
html[data-theme="dark"] body.g26 .geus-levergebied-output [style*="#c2e1ed"] { background: var(--vlak-2) !important; border-color: var(--lijn) !important; border-left-color: var(--merk) !important; box-shadow: none !important; }
html[data-theme="dark"] body.g26 .geus-levergebied-output [style*="background:#e7f4f9"] { background: var(--merk-licht) !important; }
html[data-theme="dark"] body.g26 :is(.geus-levergebied-output, .g26-inhoud) [style*="color:#0d5c7c"] { color: var(--merk) !important; }
html[data-theme="dark"] body.g26 :is(.geus-levergebied-output, .g26-inhoud) :is([style*="color:#50575e"], [style*="color:#475569"], [style*="color:#646970"]) { color: var(--inkt-zacht) !important; }
html[data-theme="dark"] body.g26 .g26-inhoud [style*="color:#812523"] { color: #f19a92 !important; }
html[data-theme="dark"] body.g26 [style*="background:#fff4e5"] { background: #3a2f1c !important; color: #f3c98b !important; }
html[data-theme="dark"] body.g26 [style*="background:#fff3cd"] { background: #3a321c !important; border-color: #5c4f26 !important; color: var(--inkt) !important; }

/* Adres & bezorgen (Mijn account): de adressenkaart, "Je bezorgvoorkeuren zijn ingesteld" en het
   voorkeurenblok (dat ook op de bedankpagina staat). */
html[data-theme="dark"] body.g26 .geus-ap-addresses--top { background: var(--vlak-2) !important; border-color: var(--lijn) !important; box-shadow: none !important; }
html[data-theme="dark"] body.g26 :is(.geus-ap-section-heading, .geus-ap-addresses--top h2) { color: var(--inkt) !important; }
html[data-theme="dark"] body.g26 .geus-ap-addresses--top :is(p, address) { color: var(--inkt-zacht) !important; }
html[data-theme="dark"] body.g26 .geus-ap-addresses--top a { color: var(--merk) !important; }
html[data-theme="dark"] body.g26 .geus-ap-prefs__summary { background: var(--goed-licht) !important; border-color: rgba(111, 207, 142, .4) !important; color: var(--goed) !important; }
html[data-theme="dark"] body.g26 .geus-ap-prefs__cta { color: var(--merk) !important; }
html[data-theme="dark"] body.g26 .geus-ap-prefs__prompt { background: var(--merk-licht) !important; border-color: rgba(79, 178, 214, .45) !important; color: var(--merk-diep) !important; }
html[data-theme="dark"] body.g26 .geus-thankyou-questions-container { background: var(--vlak-2) !important; border-color: var(--lijn) !important; box-shadow: none !important; }
html[data-theme="dark"] body.g26 .geus-thankyou-questions-container :is(h3, h4, label, strong) { color: var(--inkt) !important; }
html[data-theme="dark"] body.g26 .geus-thankyou-questions-container p { color: var(--inkt-zacht) !important; }
html[data-theme="dark"] body.g26 .geus-thankyou-questions-container .geus-csf-section { border-color: var(--lijn) !important; }
html[data-theme="dark"] body.g26 .geus-csf-btn { background: var(--vlak) !important; border-color: var(--lijn) !important; color: var(--inkt) !important; box-shadow: none !important; }
html[data-theme="dark"] body.g26 .geus-csf-btn:hover { border-color: var(--merk) !important; }
html[data-theme="dark"] body.g26 .geus-csf-btn.is-active { background: var(--merk-licht) !important; border-color: var(--merk) !important; color: var(--merk-diep) !important; }
html[data-theme="dark"] body.g26 .geus-csf-loader { background: rgba(23, 26, 28, .75) !important; }
/* Geplande bezorgingen (Adres & bezorgen, module verzendmethoden): kaarten, stappen en labels */
html[data-theme="dark"] body.g26 .geus-pd-card { background: var(--vlak-2) !important; border-color: var(--lijn) !important; box-shadow: none !important; }
html[data-theme="dark"] body.g26 .geus-pd-card--hero { border-color: var(--merk) !important; }
html[data-theme="dark"] body.g26 :is(.geus-pd-moment, .geus-pd-item__value, .geus-pd-step.is-done .geus-pd-step__label) { color: var(--inkt) !important; }
html[data-theme="dark"] body.g26 :is(.geus-pd-card--hero .geus-pd-moment, .geus-pd-window-label, .geus-pd-section-title--today, .geus-pd-card__order a) { color: var(--merk) !important; }
html[data-theme="dark"] body.g26 :is(.geus-pd-route, .geus-pd-card__order, .geus-pd-section-title, .geus-pd-item__label, .geus-pd-step__label, .geus-pd-step__time) { color: var(--inkt-zacht) !important; }
html[data-theme="dark"] body.g26 .geus-pd-section-title { border-color: var(--lijn) !important; }
html[data-theme="dark"] body.g26 .geus-pd-item { background: var(--vlak) !important; border-color: var(--lijn) !important; }
html[data-theme="dark"] body.g26 .geus-pd-empty { background: var(--vlak-2) !important; border-color: var(--lijn) !important; color: var(--inkt-zacht) !important; }
html[data-theme="dark"] body.g26 .geus-pd-step:not(:first-child)::before { background: var(--lijn) !important; }
html[data-theme="dark"] body.g26 .geus-pd-step.is-done:not(:first-child)::before { background: var(--merk) !important; }
html[data-theme="dark"] body.g26 .geus-pd-step__dot { background: var(--vlak) !important; border-color: var(--lijn) !important; }
html[data-theme="dark"] body.g26 .geus-pd-step.is-done .geus-pd-step__dot { background: var(--merk) !important; border-color: var(--merk) !important; }
html[data-theme="dark"] body.g26 .geus-pd-badge--busy { background: #3a3417 !important; color: #f5d97a !important; }
html[data-theme="dark"] body.g26 :is(.geus-pd-badge--packed, .geus-pd-colli__chip--vries) { background: var(--merk-licht) !important; color: var(--merk-diep) !important; }
html[data-theme="dark"] body.g26 .geus-pd-badge--done { background: var(--goed-licht) !important; color: var(--goed) !important; }
html[data-theme="dark"] body.g26 .geus-pd-colli__chip--droog { background: #3a2f1c !important; color: #f3c98b !important; }
/* menuknop van Mijn account op de telefoon */
html[data-theme="dark"] body.g26 .geus-accountmenu-knop { background: var(--vlak) !important; border-color: var(--lijn) !important; color: var(--inkt) !important; }

/* Mijn dieren: het venster "… bewerken" had een vaste witte achtergrond */
html[data-theme="dark"] body.g26 .geus-dieren-modal-overlay > div { background: var(--vlak) !important; border: 1px solid var(--lijn); color: var(--inkt); }
html[data-theme="dark"] body.g26 .geus-dieren-modal-overlay h3 { color: var(--merk) !important; }

/* Agenda (module event-calendar): de kaarten en "Geen geplande evenementen" */
html[data-theme="dark"] body.g26 :is(.geus-event-card, .geus-event-empty) { background: var(--vlak) !important; border-color: var(--lijn) !important; box-shadow: none !important; }
html[data-theme="dark"] body.g26 :is(.geus-event-title, .geus-event-empty h3) { color: var(--inkt) !important; }
html[data-theme="dark"] body.g26 :is(.geus-event-desc, .geus-event-details-item, .geus-event-empty p) { color: var(--inkt-zacht) !important; }
html[data-theme="dark"] body.g26 .geus-event-details-list { border-color: var(--lijn) !important; }
html[data-theme="dark"] body.g26 .geus-event-date-badge { background: rgba(32, 37, 39, .9) !important; }
html[data-theme="dark"] body.g26 .geus-event-day { color: var(--merk) !important; }
html[data-theme="dark"] body.g26 .geus-event-month { color: var(--inkt) !important; }
html[data-theme="dark"] body.g26 .geus-event-weekday { color: var(--inkt-zacht) !important; }

/* Tarieftabellen van de module levergebieden (Bezorgservice en de postcodecheck):
   de module zet licht-blauwe kleuren inline; hier op de tokens, dus dag en nacht. */
.g26 .geus-tarieven thead th { background: var(--merk-licht) !important; border-bottom-color: var(--merk) !important; color: var(--inkt) !important; }
.g26 .geus-tarieven td { border-bottom-color: var(--lijn) !important; color: var(--inkt) !important; }
.g26 .geus-tarieven td.geus-tarief-gratis { color: var(--merk) !important; }
.g26 .geus-tarieven tbody tr:last-child td { border-bottom: 0 !important; }