/* basis (voorheen globals.css): geen Tailwind-preflight — die zou de thema-cascade resetten */
:root{color-scheme:light}
html{background:#fff}
/* Opmaak die het live thema via JS injecteert (reviews-model.js → #fp-modelscore-opmaak, vormen-regel.js → #fp-modelvorm-opmaak).
   Hier als gewoon stylesheet (shop-onafhankelijk), omdat de regels server-side gerenderd worden. Regels letterlijk overgenomen. */
.fp-modelscore{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;margin:6px 0 2px;font-size:13px;line-height:1.4;color:#6b6b6b}
.fp-ms-sterren{position:relative;display:inline-block;flex:0 0 auto;font-size:15px;line-height:1;letter-spacing:1px;white-space:nowrap}
.fp-ms-leeg{color:#dcdcdc}
.fp-ms-vol{position:absolute;top:0;left:0;overflow:hidden;color:#f5b301;white-space:nowrap}
.fp-ms-cijfer{color:#1a1a1a;font-size:14px;font-weight:700}
.fp-ms-tekst{color:#6b6b6b}
.fp-modelscore.zonder-eigen .fp-ms-tekst{color:#4a4a4a}
.small-reviews .stars.fp-leeg-verborgen{display:none !important}
@media (max-width:767px){.fp-modelscore{font-size:12px;gap:3px 7px}.fp-ms-sterren{font-size:14px}.fp-ms-cijfer{font-size:13px}.fp-ms-tekst{flex:1 1 100%}}
.fp-modelvorm{margin:10px 0 6px;font-size:13px;line-height:1.4}
.fp-vorm-label{display:block;margin:0 0 8px;color:#6b6b6b}
.fp-vorm-lijst{display:flex;flex-wrap:wrap;gap:8px}
.fp-vorm-link{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:76px;padding:12px 6px 10px;border:1px solid #e2e2e2;border-radius:8px;color:#1a1a1a;font-weight:700;font-size:12px;text-align:center;text-decoration:none;background:#fff;transition:border-color .15s,background .15s}
.fp-vorm-link:hover{border-color:#1a1a1a;background:#f2f8f2}
.fp-vorm-link svg{display:block;flex:0 0 auto}
.fp-vorm-huidig{position:relative;border-color:#1a1a1a;background:#eef6ee;cursor:default}
.fp-vorm-huidig:hover{border-color:#1a1a1a;background:#eef6ee}
.fp-vorm-vink{position:absolute;top:-7px;right:-7px;width:18px;height:18px;border-radius:50%;background:#1a1a1a;box-shadow:0 0 0 2px #fff;display:flex;align-items:center;justify-content:center}
@media (max-width:767px){.fp-vorm-link{width:68px;padding:10px 4px 8px;font-size:11px}}
/* Kleurstalen op de kaart: het thema-CSS zet .fp-kleur op display:flex, wat het [hidden]-attribuut (UA display:none) overschrijft.
   Live rendert het GTM-script alleen de eerste 5 + "+N"; hier staan ze allemaal in de HTML en zijn de overige verborgen. */
.fp-kleur[hidden]{display:none !important}

/* "Op maat"-rekenmodule: live staat het blok alleen in de HTML als de Op maat-variant geselecteerd is; hier staat het verborgen in
   de pagina en toont storefront.js het bij klik op de rij. Het thema-CSS zet .custom-rekenmodule op display, dus [hidden] expliciet. */
.custom-rekenmodule[hidden]{display:none !important}
/* Retourvoorwaarden-popup: live via fancybox (overlay + gecentreerd blok); hier zonder jQuery met de klasse fp-open. */
#voorwaarde-popup.fp-open{display:block;position:fixed;inset:0;z-index:100000;background:rgba(0,0,0,.6);overflow:auto;padding:40px 15px}
#voorwaarde-popup.fp-open .voorwaarde-inner{position:relative;background:#fff;max-width:640px;margin:0 auto;border-radius:3px}

/* Maatbereik-hint in de rekenmodule (alleen zichtbaar bij buiten_bereik) */
.custom-rekenmodule .fp-maat-hint{margin:0 0 10px;padding:0 30px;color:#c0392b;font-size:13px}
.custom-rekenmodule .fp-maat-hint[hidden]{display:none !important}
.custom-rekenmodule .afwerkingoptionswiper{margin:0 0 1em;padding:0 30px}
.custom-rekenmodule .afwerkingOption a img{width:60px;height:60px;object-fit:cover}

/* Maattabel: oranje stip bij niet op voorraad (inventaris-spec: 'oranje stip bij niet-op-voorraad of backorder') */
.custom-variants .dot.fp-niet{background-color:#ffa200}

/* Winkelwagen /cart/ (S4a slice 1) — thema-kleuren, eigen opmaak (live = generieke Lightspeed-GUI) */
.fp-mand{padding-top:30px;padding-bottom:40px;min-height:50vh}
.fp-mand .gui-page-title{font-size:26px;font-weight:700;margin:0 0 20px}
.fp-mand-leeg{font-size:15px}
.fp-mand-tabel td{vertical-align:middle !important;border-top:1px solid #e6e6e6;padding:14px 10px}
.fp-mand-foto img{width:90px;height:90px;object-fit:cover;display:block}
.fp-mand-info a.title-font{font-weight:700;color:#333;text-decoration:none}
.fp-mand-maat{color:#6b6b6b;font-size:13px;margin-top:2px}
.fp-mand-lever{font-size:13px;color:#007941;margin-top:4px}
.fp-mand-lever.fp-niet{color:#d9800a}
.fp-mand-fout{color:#c0392b;font-size:13px}
.fp-mand-aantal .change{display:inline-flex;align-items:center;border:1px solid #e1e1e1}
.fp-mand-aantal .change a{display:inline-block;width:32px;height:34px;line-height:34px;text-align:center;color:#333;text-decoration:none}
.fp-mand-aantal .change input{width:44px;height:34px;border:0;border-left:1px solid #e1e1e1;border-right:1px solid #e1e1e1;text-align:center}
.fp-mand-prijs{text-align:right;white-space:nowrap;font-weight:700}
.fp-mand-prijs .old-price{color:#999;text-decoration:line-through;font-weight:400;margin-right:6px}
.fp-mand-weg a{color:#999}.fp-mand-weg a:hover{color:#c0392b}
.fp-mand-totaal{display:flex;justify-content:flex-end;gap:30px;font-size:18px;padding:16px 10px;border-top:2px solid #333}
.fp-mand-knoppen{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:10px}
.fp-mand-knoppen .btn{padding:12px 24px}
.fp-btn-licht{background:#fff !important;color:#333 !important;border:1px solid #333 !important}
.fp-btn-uit{opacity:.5;cursor:not-allowed}
@media (max-width:767px){.fp-mand-tabel td{padding:10px 4px}.fp-mand-foto img{width:64px;height:64px}.fp-mand-prijs{font-size:14px}}

/* Checkout /checkout/ + bedankt (S4a) */
.fp-checkout{padding-top:30px;padding-bottom:50px;min-height:50vh}
.fp-checkout .gui-page-title{font-size:26px;font-weight:700;margin:0 0 20px}
.fp-co-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:40px;align-items:start}
.fp-co-form h2{font-size:18px;font-weight:700;margin:26px 0 12px;padding-bottom:6px;border-bottom:1px solid #e6e6e6}
.fp-co-form h3{font-size:14px;font-weight:700;margin:14px 0 6px;color:#555}
.fp-veld{display:block;margin:0 0 10px}.fp-veld>span{display:block;font-size:12px;color:#6b6b6b;margin-bottom:3px}
.fp-veld input,.fp-veld select,.fp-veld textarea{width:100%;height:40px;border:1px solid #d9d9d9;padding:0 10px;font:inherit;background:#fff}
.fp-veld textarea{height:auto;padding:8px 10px}
.fp-veld.fp-fout input,.fp-veld.fp-fout select,.fp-check.fp-fout{border-color:#c0392b}
.fp-veld em,.fp-check em,.fp-fout-tekst{display:block;color:#c0392b;font-size:12px;font-style:normal;margin-top:3px}
.fp-rij{display:flex;gap:10px}.fp-c1{flex:1}.fp-c3{flex:3}
.fp-check{display:block;margin:10px 0;font-size:14px}.fp-check input{margin-right:6px}
.fp-radio{display:flex;align-items:center;gap:10px;border:1px solid #e1e1e1;padding:12px;margin:0 0 8px;cursor:pointer}
.fp-radio span{flex:1}.fp-radio small{display:block;color:#6b6b6b;font-size:12px}.fp-radio strong{white-space:nowrap}
.fp-dagen{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 12px}
.fp-dag{border:1px solid #333;background:#fff;padding:8px 10px;font:inherit;font-size:13px;cursor:pointer}
.fp-dag.fp-gekozen{background:#333;color:#fff}.fp-dag.fp-vol{opacity:.4;cursor:not-allowed;text-decoration:line-through}
.fp-co-knoppen{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:20px}
.fp-btn-betalen{padding:14px 32px;font-size:16px}.fp-btn-betalen[disabled]{opacity:.5;cursor:not-allowed}
.fp-serverfout{font-size:14px;font-weight:700}
.fp-co-overzicht{background:#f7f7f7;padding:20px;position:sticky;top:20px}
.fp-co-overzicht h2{font-size:18px;font-weight:700;margin:0 0 12px}
.fp-co-regels{list-style:none;margin:0;padding:0}.fp-co-regels li{display:flex;gap:8px;padding:8px 0;border-bottom:1px solid #e6e6e6;font-size:13px}
.fp-co-aantal{color:#6b6b6b;white-space:nowrap}.fp-co-naam{flex:1}.fp-co-naam small{display:block;color:#6b6b6b}.fp-co-prijs{white-space:nowrap;font-weight:700}
.fp-co-totalen{display:grid;grid-template-columns:1fr auto;gap:6px 12px;margin:12px 0 0;font-size:14px}.fp-co-totalen dd{margin:0;text-align:right}.fp-co-totalen .fp-totaal{font-weight:700;font-size:16px;padding-top:6px;border-top:1px solid #ccc}
.fp-ok{color:#007941;font-size:16px;font-weight:600}
@media (max-width:900px){.fp-co-grid{grid-template-columns:1fr}.fp-co-overzicht{position:static;order:-1}}

/* Gratis stalen (S3) */
.fp-stalen-intro{margin:-10px 0 20px;color:#555}
.fp-stalen-lijst{list-style:none;margin:0 0 10px;padding:0}
.fp-stalen-lijst li{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid #e6e6e6}
.fp-stalen-lijst img{width:56px;height:56px;object-fit:cover}
.fp-stalen-lijst a{flex:1;color:#333;text-decoration:none;font-weight:600}
.fp-staal-weg{background:none;border:0;color:#999;cursor:pointer}.fp-staal-weg:hover{color:#c0392b}
.fp-staal-add.fp-gekozen{opacity:.6}
.fp-stalen-naarwinkelwagen.fp-uit{opacity:.5;pointer-events:none}

/* Bestelstatus (S5) */
.fp-status-form{max-width:640px}
.fp-status-kaart{max-width:640px;border:1px solid #e6e6e6;padding:20px}
.fp-status-kop{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px}
.fp-status-nr{font-size:18px;font-weight:700}
.fp-status-badge{padding:4px 10px;border-radius:12px;background:#eee;font-size:12px;font-weight:700}
.fp-st-onderweg{background:#fff3d6}.fp-st-bezorgd{background:#e5f4e9;color:#007941}.fp-st-geannuleerd,.fp-st-niet_betaald{background:#fde8e6;color:#c0392b}
.fp-stappen{display:flex;list-style:none;margin:0 0 14px;padding:0;counter-reset:s}
.fp-stappen li{flex:1;text-align:center;font-size:12px;color:#999;position:relative;padding-top:22px}
.fp-stappen li::before{content:'';position:absolute;top:6px;left:50%;transform:translateX(-50%);width:12px;height:12px;border-radius:50%;background:#ddd}
.fp-stappen li::after{content:'';position:absolute;top:11px;left:50%;width:100%;height:2px;background:#ddd;z-index:-1}
.fp-stappen li:last-child::after{display:none}
.fp-stappen li.fp-stap-klaar{color:#333}.fp-stappen li.fp-stap-klaar::before,.fp-stappen li.fp-stap-klaar::after{background:#007941}
.fp-stappen li.fp-stap-nu::before{box-shadow:0 0 0 3px #e5f4e9}
.fp-status-uitleg{font-size:15px}
.fp-status-dl{display:grid;grid-template-columns:140px 1fr;gap:4px 10px;font-size:14px;margin:0 0 10px}.fp-status-dl dd{margin:0;word-break:break-all}
.fp-status-regels{list-style:none;margin:0 0 12px;padding:0;font-size:14px}.fp-status-regels li{padding:4px 0;border-bottom:1px solid #eee}.fp-status-regels small{color:#777}

/* Zoeksuggesties onder de zoekbalk */
#formSearchCustom,#formSearchMobile{position:relative}
/* Zoeklaag (instant search, PD 05-10): vaste laag onder de zoekbalk, à la Doofinder/Coolblue */
.fp-zoeklaag{position:fixed;left:0;right:0;bottom:0;z-index:1300;background:rgba(0,0,0,.35);text-align:left;font-family:'Open Sans',Arial,sans-serif}
.fp-zoeklaag[hidden]{display:none}
.fp-zl-box{position:relative;background:#fff;max-width:1400px;margin:0 auto;height:100%;max-height:calc(100vh - 8px);display:flex;flex-direction:column;box-shadow:0 12px 40px rgba(0,0,0,.25);border-radius:0 0 6px 6px;overflow:hidden}
.fp-zl-sluit{position:absolute;top:14px;right:18px;width:36px;height:36px;border:0;background:transparent;font-size:30px;line-height:36px;color:#444;cursor:pointer;z-index:2}
.fp-zl-sluit:hover{color:#000}
.fp-zl-chips{display:flex;flex-wrap:wrap;gap:8px;padding:18px 60px 10px 24px;min-height:20px}
.fp-zl-chip{border:1px solid #d6d6d6;border-radius:18px;background:#fff;padding:6px 14px;font-size:13px;color:#444;cursor:pointer;line-height:1.3}
.fp-zl-chip b{color:#000}
.fp-zl-chip:hover{border-color:#000;color:#000}
.fp-zl-body{display:flex;flex:1;min-height:0}
.fp-zl-zij{flex:0 0 260px;padding:12px 24px 24px;overflow:auto;border-right:1px solid #eee}
.fp-zl-blok{margin-bottom:22px}
.fp-zl-kop{font-weight:700;font-size:15px;margin-bottom:10px;color:#111}
.fp-zl-link{display:block;padding:5px 0;color:#222;font-size:14px;text-decoration:none}
.fp-zl-link i{width:18px;color:#777}
.fp-zl-link:hover{color:#000;text-decoration:underline}
.fp-zl-cat{display:flex;align-items:center;gap:9px;padding:5px 0;font-size:14px;color:#333;cursor:pointer;font-weight:400;margin:0}
.fp-zl-cat input{margin:0;width:16px;height:16px;accent-color:#111}
.fp-zl-cat span{flex:1}
.fp-zl-cat em{font-style:normal;color:#888;font-size:13px}
.fp-zl-cat.fp-zl-aan span{font-weight:700;color:#000}
.fp-zl-prijsveld{display:flex;gap:10px}
.fp-zl-prijsveld label{flex:1;display:flex;flex-direction:column;font-size:12px;color:#777;margin:0;font-weight:400}
.fp-zl-prijsveld input{width:100%;border:1px solid #d6d6d6;border-radius:3px;padding:6px 8px;font-size:14px;margin-top:3px;height:auto}
.fp-zl-wis{border:0;background:none;padding:0;color:#007941;font-size:13px;text-decoration:underline;cursor:pointer}
.fp-zl-main{flex:1;min-width:0;padding:8px 24px 24px;overflow:auto;position:relative}
.fp-zl-main.fp-zl-laden{opacity:.5}
.fp-zl-top{display:flex;justify-content:space-between;align-items:center;padding:6px 0 14px;gap:12px}
.fp-zl-aantal{font-weight:700;font-size:14px;color:#111}
.fp-zl-sort{font-size:13px;color:#555;margin:0;font-weight:400}
.fp-zl-sort select{border:1px solid #d6d6d6;border-radius:3px;padding:4px 6px;font-size:13px;height:auto;margin-left:4px;background:#fff}
.fp-zl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px}
.fp-zl-kaart{display:block;border:1px solid #e6e6e6;border-radius:3px;padding:10px;color:#222;text-decoration:none;background:#fff;transition:box-shadow .15s}
.fp-zl-kaart:hover{box-shadow:0 6px 18px rgba(0,0,0,.12);color:#000;text-decoration:none}
.fp-zl-img{position:relative;aspect-ratio:1/1;background:#f6f6f6;overflow:hidden;margin-bottom:8px}
.fp-zl-img img{width:100%;height:100%;object-fit:cover;display:block}
.fp-zl-noimg{display:block;width:100%;height:100%}
.fp-zl-img .fp-zl-2{position:absolute;inset:0;opacity:0;transition:opacity .2s ease-in-out}
.fp-zl-kaart:hover .fp-zl-img .fp-zl-2{opacity:1}
.fp-zl-badge{position:absolute;top:0;left:0;background:#007941;color:#fff;font-size:12px;font-weight:700;padding:3px 7px;z-index:1}
.fp-zl-best{position:absolute;top:0;right:0;background:#111;color:#fff;font-size:10px;font-weight:700;padding:3px 6px;text-transform:uppercase;z-index:1}
.fp-zl-titel{font-size:13px;line-height:1.35;min-height:35px;color:#222}
.fp-zl-merk{font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:#888;margin-top:2px}
.fp-zl-prijs{margin-top:6px;font-size:14px;display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.fp-zl-prijs s{color:#999;font-size:12px}
.fp-zl-prijs b{color:#111;font-size:15px}
.fp-zl-maat{color:#888;font-size:11px;margin-left:auto}
.fp-zl-meer-wrap{text-align:center;padding:18px 0 6px}
.fp-zl-meer{border:1px solid #111;background:#fff;color:#111;padding:9px 22px;font-size:13px;font-weight:700;border-radius:3px;cursor:pointer;text-transform:uppercase;letter-spacing:.5px}
.fp-zl-meer:hover{background:#111;color:#fff}
.fp-zl-alle{display:block;text-align:center;padding:12px 0 4px;color:#007941;font-weight:700;font-size:14px;text-decoration:none}
.fp-zl-alle:hover{text-decoration:underline}
.fp-zl-leeg{padding:30px 10px;color:#333;font-size:15px;max-width:520px}
.fp-zl-leeg p{color:#666;font-size:14px;margin-top:8px}
.fp-zl-spelling{width:100%;font-size:14px;color:#333;margin-bottom:4px}
.fp-zl-spelling .fp-zl-chip{margin:0 2px;font-weight:700;border-color:#007941;color:#007941}
.fp-zl-cats .fp-zl-extra{display:none}
.fp-zl-cats.fp-zl-uitgeklapt .fp-zl-extra{display:flex}
.fp-zl-meercats{border:0;background:none;padding:4px 0 0;color:#007941;font-size:13px;text-decoration:underline;cursor:pointer}
.fp-zl-m2{color:#888;font-size:12px}
.fp-zl-wis-groot{border:1px solid #111!important;border-radius:3px;padding:8px 18px!important;text-decoration:none!important;color:#111!important;font-weight:700;font-size:13px!important}
html.fp-zoeklaag-open{overflow:hidden}
@media (max-width:991px){.fp-zl-zij{flex-basis:210px;padding:12px 16px 20px}.fp-zl-main{padding:8px 16px 20px}.fp-zl-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}}
@media (max-width:767px){.fp-zoeklaag{top:0!important}.fp-zl-box{max-height:100vh;border-radius:0}.fp-zl-chips{padding:14px 52px 8px 14px}.fp-zl-body{flex-direction:column;overflow:auto}.fp-zl-zij{flex:none;border-right:0;border-bottom:1px solid #eee;padding:8px 14px 14px;overflow:visible}.fp-zl-blok{margin-bottom:14px}.fp-zl-cat{display:inline-flex;margin-right:12px}.fp-zl-main{overflow:visible;padding:8px 14px 20px}.fp-zl-grid{grid-template-columns:repeat(2,1fr);gap:10px}}