/* Gedeelde, rustige afwerking van de klantpagina’s. */
:root{--pagina-schaduw:0 12px 36px rgba(22,55,40,.065)}
main .winkelwagenkop,main .afrekenkop,main .paginatitel{gap:20px;align-items:center;margin-bottom:28px}
main .winkelwagenkop h1,main .afrekenkop h1,main .paginatitel h1,main .bestelkeuze>h1{font-size:clamp(28px,4vw,40px);line-height:1.15;letter-spacing:-.025em}
main .afrekenkop{padding:24px 28px;border:1px solid var(--rand);border-radius:20px;background:var(--licht)}
main .afrekenen{max-width:900px;margin-left:auto;margin-right:auto;gap:24px}
main .afrekenen fieldset{min-width:0;padding:24px;border:1px solid var(--rand);border-radius:18px;background:var(--wit);box-shadow:var(--pagina-schaduw)}
main .afrekenen legend{padding:0 10px;font-size:18px;font-weight:750;color:var(--inkt)}
main .afrekenen input:not([type=radio]):not([type=checkbox]),main .afrekenen select,main .afrekenen textarea{max-width:100%;border-radius:9px;border:1px solid var(--rand);background:var(--wit);color:var(--inkt)}
main .afrekenen input:focus-visible,main .afrekenen select:focus-visible,main .afrekenen textarea:focus-visible{outline:3px solid var(--lime);outline-offset:2px}
main .afrekenen .betaalkeuze{border-radius:12px;padding:16px;gap:14px}
main .afrekenen .kostenoverzicht .eindtotaal{padding:18px 0 4px;font-size:23px;border-top:2px solid var(--rand)}
main .winkelwagenkop~.tabel{border-radius:18px;box-shadow:var(--pagina-schaduw)}
main .winkelwagenregel{padding-top:22px;padding-bottom:22px}
main .inlogkaart,main .accountnieuw,main .keuzekaart,main .accountwelkom{border-radius:20px;box-shadow:var(--pagina-schaduw)}
main .accountkeuzes>a,main .bestelkaarten>article{border-radius:16px;box-shadow:0 4px 14px rgba(22,55,40,.045)}
main .keuzekaart{padding:28px;border:1px solid var(--rand)}
main .keuzekaart.aanbevolen{border:2px solid #55816a}
main .knop:focus-visible,main .tabelknop:focus-visible{outline:3px solid var(--lime);outline-offset:4px}
/* Alle betalingsuitkomsten hebben dezelfde indeling, met een eigen statuskleur. */
main .betaalterug{--status-achtergrond:#edf4ee;--status-inkt:#28583e;max-width:880px;margin:8px auto 28px;padding:36px 40px;text-align:left;background:var(--wit);border:1px solid var(--rand);border-radius:24px;box-shadow:var(--pagina-schaduw)}
main .betaalterug--wachten{--status-achtergrond:#faf2dc;--status-inkt:#735616}
main .betaalterug--afgebroken{--status-achtergrond:#faeeeb;--status-inkt:#873e36}
.betaalterug .betaalmerk{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:28px}
.betaalterug .betaalmerk img{display:block;width:64px;height:64px;object-fit:contain}
.betaalterug .betaalmerk span{font-size:13px;font-weight:700;color:var(--inkt)}
.betaalterug .betaalstatusicoon{display:grid;place-items:center;width:58px;height:58px;margin-bottom:16px;border-radius:18px;background:var(--status-achtergrond);color:var(--status-inkt)}
.betaalstatusicoon svg{width:30px;height:30px;display:block}
.betaalterug .betaallabel{display:inline-block;padding:5px 11px;border-radius:30px;background:var(--status-achtergrond);color:var(--status-inkt);font-size:13px;font-weight:750}
main .betaalterug h1{max-width:660px;margin:14px 0 16px;font-size:clamp(28px,4vw,38px);line-height:1.17;letter-spacing:-.025em;color:var(--inkt)}
.betaalterug .betaaltoelichting{max-width:690px;margin:0 0 24px;font-size:17px;line-height:1.7;color:var(--inkt)}
.betaalterug .betaalsamenvatting{display:grid;grid-template-columns:1fr 1fr;gap:20px 28px;padding:22px 24px;margin:24px 0;background:var(--licht);border:1px solid var(--rand);border-radius:16px}
.betaalsamenvatting>div{min-width:0}.betaalsamenvatting dt{font-size:13px;margin-bottom:4px}.betaalsamenvatting dd{margin:0;font-size:17px;font-weight:750;overflow-wrap:anywhere}
.betaalterug .accountaanduiding{margin:20px 0;padding:0;border:0;background:none;color:var(--inkt);font-size:14px;line-height:1.65;text-align:left}
.betaalterug .accountaanduiding strong{font-weight:600}.betaalterug .accountaanduiding small{font-size:13px}
.betaalterug .overschrijfgegevens,.betaalterug .donatiebedankt{width:100%;max-width:none;margin:20px 0;padding:20px;text-align:left;border-radius:14px;background:var(--licht);color:var(--inkt)}
.betaalterug .betaalacties{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:26px;padding-top:22px;border-top:1px solid var(--rand)}
.betaalterug .betaalacties a{display:inline-flex;justify-content:center;align-items:center;min-height:46px;padding:11px 17px;border-radius:10px;font-size:14px;font-weight:750;text-decoration:none}
.betaalterug .betaalacties .tabelknop{background:var(--wit);color:var(--inkt);border:1px solid var(--rand)}
.betaalterug .betaalacties .knop{background:#164f3b;color:#fff}
body[data-thema="donker"]{--pagina-schaduw:none}
body[data-thema="donker"] .betaalterug{--status-achtergrond:#203e2e;--status-inkt:#cce5d2}
body[data-thema="donker"] .betaalterug--wachten{--status-achtergrond:#3d3521;--status-inkt:#f0ddac}
body[data-thema="donker"] .betaalterug--afgebroken{--status-achtergrond:#422d2a;--status-inkt:#f2ccc5}
body[data-thema="contrast"] .betaalterug,body[data-thema="contrast"] .afrekenen fieldset{border:2px solid #000;box-shadow:none}
@media(max-width:600px){main .betaalterug{margin-top:0;padding:24px 18px;border-radius:18px}.betaalterug .betaalmerk{margin-bottom:22px}.betaalterug .betaalmerk img{width:50px;height:50px}.betaalterug .betaaltoelichting{font-size:16px}.betaalterug .betaalsamenvatting{padding:17px;gap:18px;grid-template-columns:1fr}.betaalterug .betaalacties{flex-direction:column;align-items:stretch}.betaalterug .betaalacties a{width:100%}main .afrekenkop{padding:20px}main .afrekenen fieldset{padding:20px 15px}main .keuzekaart{padding:22px}}