/* Buiten-punten — klantkant (ontwerp design_handoff_puntensysteem). Knoppen = themaknoppen. */
.bs-pt-icoon{ display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:#c9a95c; color:#1f2a24; line-height:1; flex:none; }
.bs-pt-icoon svg{ display:block; }
.bs-pt-label{ display:block; font-size:11px; letter-spacing:1.4px; text-transform:uppercase; color:#8a6d2a; font-weight:600; }
.bs-pt-label.is-goud{ color:#c9a95c; }
.bs-pt-zand{ display:flex; gap:10px; align-items:center; background:#efece4; border-radius:10px; padding:10px 14px; font-size:13px; color:#1f2a24; }

/* Productpagina */
.bs-pt-blok{ border:1px solid #e3ded3; border-radius:12px; background:#fff; margin:14px 0 18px; font-size:13px; line-height:1.5; color:#1f2a24; }
.bs-pt-rij{ display:grid; grid-template-columns:22px 1fr; gap:10px; align-items:start; padding:11px 14px; }
.bs-pt-rij + .bs-pt-rij{ border-top:1px solid #e3ded3; }
.bs-pt-rij a{ color:#8a6d2a; font-weight:600; text-decoration:none; white-space:nowrap; }
.bs-pt-vink{ display:inline-flex; width:22px; height:22px; border-radius:50%; background:#e6eee6; color:#5f8a63; align-items:center; justify-content:center; font-weight:700; font-size:13px; }

/* Winkelmand / afrekenen */
.bs-pt-kaart{ background:#fff; border:1px solid #e3ded3; border-radius:16px; padding:20px 22px; margin:18px 0; font-size:14px; color:#1f2a24; }
.bs-pt-kop{ display:flex; justify-content:space-between; align-items:center; gap:12px; }
.bs-pt-kop strong{ display:block; font-size:16px; margin-top:2px; }
.bs-pt-uitleg{ margin:10px 0 0; font-size:12px; color:#5c645e; line-height:1.5; }
.bs-pt-uitleg a{ color:#8a6d2a; font-weight:600; }
.bs-pt-inzet-regel{ display:flex; justify-content:space-between; align-items:center; gap:14px; margin-top:14px; flex-wrap:wrap; }
.bs-pt-stepper{ display:inline-flex; align-items:center; gap:10px; border:1px solid #d9d3c6; border-radius:999px; padding:3px 6px; background:#fff; }
.bs-pt-stepper button{ width:36px; height:36px; border-radius:50%; border:0; background:#efece4; color:#1f2a24; font-size:18px; line-height:1; cursor:pointer; }
.bs-pt-stepper button:disabled{ opacity:.35; cursor:default; }
.bs-pt-aantal{ min-width:120px; text-align:center; font-weight:600; }
.bs-pt-korting{ color:#5f8a63; font-weight:600; white-space:nowrap; }
.bs-pt-balk{ height:6px; border-radius:3px; background:#efece4; overflow:hidden; margin:12px 0 0; }
.bs-pt-balk span{ display:block; height:100%; background:#c9a95c; transition:width .25s; }
.bs-pt-samenvatting{ display:none; margin:10px 0 0; font-size:13px; }
.bs-pt-samenvatting a{ color:#8a6d2a; font-weight:600; }
.bs-pt-inzet.is-ingeklapt .bs-pt-inzet-regel, .bs-pt-inzet.is-ingeklapt .bs-pt-balk, .bs-pt-inzet.is-ingeklapt .bs-pt-toelichting{ display:none; }
.bs-pt-inzet.is-ingeklapt .bs-pt-samenvatting{ display:block; }
.bs-pt-totaalregel td{ padding-top:10px !important; border:0 !important; }
.bs-pt-totaalregel .bs-pt-zand{ font-size:13px; }

/* Boekingswidget: plek met punten */
.bs-pt-plek{ display:flex; align-items:center; gap:12px; border:1px solid #d9d3c6; border-radius:12px; padding:12px 14px; margin:12px 0; cursor:pointer; background:#fff; }
.bs-pt-plek input{ position:absolute; opacity:0; width:0; height:0; }
.bs-pt-plek-vink{ width:20px; height:20px; border:1px solid #c9c3b6; border-radius:5px; background:#fff; flex:none; position:relative; }
.bs-pt-plek input:checked ~ .bs-pt-plek-vink{ background:#2a3a2e; border-color:#2a3a2e; }
.bs-pt-plek input:checked ~ .bs-pt-plek-vink::after{ content:''; position:absolute; left:7px; top:3px; width:5px; height:10px; border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg); }
.bs-pt-plek:has(input:checked){ background:#e6eee6; border-color:#2a3a2e; }
.bs-pt-plek-tekst{ flex:1; min-width:0; font-size:14px; }
.bs-pt-plek-tekst strong{ display:block; } .bs-pt-plek-tekst small{ display:block; color:#5c645e; font-size:12px; }
.bs-pt-plek-bedrag{ color:#5f8a63; font-weight:700; white-space:nowrap; }
.bs-pt-plek-info{ margin:12px 0; }

/* Vriendenbalk */
.bs-pt-vriend{ display:flex; gap:12px; align-items:center; background:#2a3a2e; color:#f7f5f0; border-radius:12px; padding:14px 16px; margin:0 0 18px; font-size:14px; line-height:1.5; }
.bs-pt-vriend-avatar{ width:36px; height:36px; border-radius:50%; background:#c9a95c; color:#1f2a24; font-weight:700; display:inline-flex; align-items:center; justify-content:center; flex:none; }

/* Mijn account: tegel + pagina */
.bs-pt-tegel .bs-pt-tegel-saldo{ font-family:inherit; font-size:48px; font-weight:600; line-height:1; margin:6px 0 8px; }
.bs-pt-tegel .bs-card-kop{ align-items:center; }
.bs-pt-goud.button, .uk-button.bs-pt-goud{ background:#c9a95c !important; color:#1f2a24 !important; border-color:#c9a95c !important; }
.bs-pt-pagina{ display:grid; grid-template-columns:1fr 1fr; gap:18px; align-items:start; }
@media (max-width:760px){ .bs-pt-pagina{ grid-template-columns:1fr; } }
.bs-pt-kolom{ display:flex; flex-direction:column; gap:18px; min-width:0; }
.bs-pt-saldokaart{ background:#2a3a2e; color:#f7f5f0; border-radius:20px; padding:26px 26px 22px; }
.bs-pt-saldokaart .bs-pt-saldo{ font-size:72px; font-weight:600; line-height:1; margin:8px 0 10px; }
.bs-pt-saldokaart p{ margin:0 0 16px; font-size:16px; line-height:1.5; }
.bs-pt-saldokaart small{ display:block; margin-top:14px; font-size:12px; opacity:.8; }
.bs-pt-saldokaart.is-leeg{ background:#fff; color:#1f2a24; border:1px solid #e3ded3; }
.bs-pt-saldokaart.is-leeg .bs-pt-saldo{ color:#b8b0a0; }
.bs-pt-knoppen{ display:flex; gap:10px; flex-wrap:wrap; }
.bs-pt-wit.uk-button-default{ background:transparent !important; border:1px solid rgba(255,255,255,.5) !important; color:#fff !important; }
.bs-pt-kaartwit, .bs-pt-kaartzand{ border-radius:16px; padding:20px 22px; }
.bs-pt-kaartwit{ background:#fff; border:1px solid #e3ded3; } .bs-pt-kaartzand{ background:#efece4; }
.bs-pt-kaartwit h3, .bs-pt-kaartzand h3{ margin:0 0 12px; font-size:18px; }
.bs-pt-stappen{ list-style:none; margin:0; padding:0; }
.bs-pt-stappen li{ display:flex; gap:12px; align-items:flex-start; padding:8px 0; font-size:14px; line-height:1.5; }
.bs-pt-stappen li span{ width:26px; height:26px; border-radius:50%; background:#efece4; color:#8a6d2a; font-weight:700; font-size:12px; display:inline-flex; align-items:center; justify-content:center; flex:none; }
.bs-pt-code{ display:flex; align-items:center; gap:10px; margin:12px 0; flex-wrap:wrap; }
.bs-pt-code code{ border:1px dashed #c9a95c; border-radius:999px; padding:8px 16px; font-weight:700; letter-spacing:1px; background:#fff; color:#1f2a24; font-size:14px; }
.bs-pt-vriendstat{ display:block; margin-top:10px; font-size:12px; color:#5c645e; }
.bs-pt-hist-kop{ display:flex; justify-content:space-between; align-items:baseline; } .bs-pt-hist-kop small{ color:#7a817b; font-size:12px; }
.bs-pt-hist-rij{ display:flex; justify-content:space-between; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid #f0ece3; font-size:14px; }
.bs-pt-hist-rij:last-child{ border-bottom:0; }
.bs-pt-hist-rij small{ display:block; color:#7a817b; font-size:12px; }
.bs-pt-hist-rij .is-plus{ color:#5f8a63; font-weight:700; font-variant-numeric:tabular-nums; } .bs-pt-hist-rij .is-min{ color:#b5473c; font-weight:700; font-variant-numeric:tabular-nums; }
.bs-pt-muted{ color:#7a817b; }
.bs-pt-verjaardag .description{ display:block; font-size:12px; color:#7a817b; margin-top:4px; }

/* Groene knoppen altijd witte tekst (thema/account kleurt links goud) */
.bs-pt-pagina .uk-button-primary, .bs-pt-pagina .uk-button-primary:hover, .bs-pt-pagina .uk-button-primary:focus, .bs-pt-pagina .bs-pt-wa{ color:#fff !important; }
.bs-pt-pagina a.uk-button{ text-decoration:none; }