/* Superbruiloft klantenportaal – gebruikt de kleur- en lettervariabelen van de site. */
.sbp{--sbp-rand:var(--sb-lijn-licht,#e3d5c3);--sbp-roze:var(--sb-roze,#e8408f);--sbp-roze-d:var(--sb-roze-donker,#b8266a);--sbp-nacht:var(--sb-nachtfeest,#140b14);--sbp-champ:var(--sb-champagne,#f5ede3);--sbp-licht:var(--sb-champagne-licht,#fbf7f1);--sbp-muted:var(--sb-tekst-muted,#5b4756);color:var(--sb-tekst-op-licht,#140b14);font-family:var(--sb-font-body,'Archivo'),system-ui,sans-serif;font-size:var(--sb-fs-base,1.0625rem);line-height:1.6;max-width:1000px;margin-inline:auto;text-align:left}
.sbp *,.sbp *::before,.sbp *::after{box-sizing:border-box}
.sbp :is(h1,h2,h3,p,ul,ol,dl,dd,figure){margin:0}
.sbp a{color:var(--sbp-roze-d)}
.sbp-kaart{background:var(--sb-wit,#fff);border:1px solid var(--sbp-rand);border-radius:var(--sb-radius-l,20px);padding:clamp(1.25rem,1rem + 1.5vw,2rem);display:grid;gap:1rem;align-content:start}
.sbp-stapel{display:grid;gap:1.25rem;align-content:start}
.sbp-rooster{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:1.25rem}
.sbp-rooster--overzicht{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}
@media (max-width:1023px){.sbp-rooster--overzicht{grid-template-columns:minmax(0,1fr)}}
.sbp-label{font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--sbp-roze-d)}
.sbp-naam{font-family:var(--sb-font-accent,'Bodoni Moda'),Georgia,serif;font-style:italic;font-weight:400;font-size:clamp(2.1rem,1.5rem + 2.6vw,3.4rem);line-height:1.08;color:var(--sbp-roze);overflow-wrap:anywhere}
.sbp-titel{font-family:var(--sb-font-display,'Archivo'),sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:.01em;font-size:clamp(1.15rem,1.05rem + .5vw,1.4rem);line-height:1.2}
.sbp-tussenkop{margin:2rem 0 1rem}
.sbp-sub{color:var(--sbp-muted)}
.sbp-groot{font-size:1.25rem;font-weight:700}
.sbp-klein{font-size:.875rem;color:var(--sbp-muted)}
.sbp-leeg{color:var(--sbp-muted);font-style:italic}
.sbp-midden{text-align:center}
.sbp-kop{display:grid;gap:.4rem;margin-bottom:1.5rem}
.sbp-kop__acties{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.6rem}
.sbp-terug{font-weight:600;text-decoration:none;font-size:.9375rem}
.sbp-tabs{display:flex;gap:.4rem;overflow-x:auto;padding:.1rem .1rem .5rem;margin-bottom:1.25rem;scrollbar-width:thin}
.sbp-tab{flex:none;padding:.55rem 1.05rem;border-radius:999px;border:1px solid var(--sbp-rand);background:var(--sb-wit,#fff);color:inherit!important;text-decoration:none;font-weight:600;font-size:.9375rem;white-space:nowrap;transition:border-color .2s ease}
.sbp-tab:hover{border-color:var(--sbp-roze)}
.sbp-tab[aria-current=page]{background:var(--sbp-nacht);border-color:var(--sbp-nacht);color:var(--sbp-champ)!important}
.sbp-inhoud{display:grid;gap:1.25rem}
.sbp-knop{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:46px;padding:.65rem 1.4rem;border-radius:999px;border:1.5px solid var(--sbp-roze);background:var(--sbp-roze);color:var(--sbp-nacht)!important;font:inherit;font-weight:700;line-height:1.2;text-decoration:none;cursor:pointer;transition:background .2s ease,border-color .2s ease}
.sbp-knop:hover{background:var(--sb-roze-hover,#f0609f);border-color:var(--sb-roze-hover,#f0609f)}
.sbp-knop--rand{background:transparent;border-color:currentColor;color:inherit!important}
.sbp-knop--rand:hover{background:rgba(232,64,143,.08);border-color:var(--sbp-roze)}
.sbp-knop--klein{min-height:38px;padding:.4rem .95rem;font-size:.875rem}
.sbp-knop[disabled]{opacity:.6;cursor:wait}
.sbp-link{background:none;border:0;padding:.25rem 0;font:inherit;font-size:.875rem;font-weight:600;color:var(--sbp-roze-d);text-decoration:underline;cursor:pointer}
.sbp-form{display:grid;gap:1.25rem;margin:0}
.sbp-kaart .sbp-form{gap:.75rem}
.sbp-rij{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:1rem}
.sbp-veld{display:grid;gap:.35rem;font-weight:600;font-size:.9375rem;margin:0}
.sbp-veld small{font-weight:400;color:var(--sbp-muted);font-size:.8125rem}
.sbp :is(input[type=text],input[type=email],input[type=tel],input[type=url],input[type=search],input[type=time],input[type=number],input[type=date],textarea,select){width:100%;min-height:46px;margin:0;padding:.6rem .8rem;border:1px solid var(--sbp-rand);border-radius:var(--sb-radius-s,10px);background:var(--sbp-licht);font:inherit;font-weight:400;color:inherit;box-shadow:none}
.sbp textarea{min-height:110px;resize:vertical}
.sbp input[readonly]{background:var(--sb-zand,#e9dfd3);color:var(--sbp-muted)}
.sbp :is(input,textarea,select,button,a,summary):focus-visible{outline:3px solid var(--sbp-roze);outline-offset:2px}
.sbp-vink{display:flex;gap:.6rem;align-items:flex-start;font-weight:600;margin:0;cursor:pointer}
.sbp-vink input{width:1.25rem;height:1.25rem;margin:.2rem 0 0;flex:none;accent-color:var(--sbp-roze)}
.sbp-afronden{background:var(--sbp-licht)}
.sbp-chips{display:flex;flex-wrap:wrap;gap:.5rem}
.sbp-chip{display:inline-flex;align-items:center;gap:.45rem;padding:.45rem .85rem;border:1px solid var(--sbp-rand);border-radius:999px;background:var(--sbp-licht);font-weight:500;font-size:.9375rem;cursor:pointer;margin:0}
.sbp-chip:has(input:checked){background:var(--sb-blush,#f4c9da);border-color:var(--sbp-roze)}
.sbp-chip input{accent-color:var(--sbp-roze);margin:0}
.sbp-melding{padding:.8rem 1rem;border-radius:var(--sb-radius-s,10px);background:#e8f5ec;border:1px solid #a6d4b2;color:#143a20}
.sbp-melding--fout{background:#fcebf1;border-color:#eaa6bf;color:#6b1230}
.sbp-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.sbp .screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
.sbp-inlog{max-width:560px;margin-inline:auto}
.sbp details{display:grid;gap:.75rem}
.sbp summary{cursor:pointer;font-weight:600;color:var(--sbp-roze-d);font-size:.9375rem}
.sbp details[open]>summary{margin-bottom:.75rem}
.sbp-handmatig .sbp-knop{margin-top:.75rem}
/* Status */
.sbp-status{list-style:none;padding:0;display:grid;gap:.5rem}
.sbp-status li{display:grid;grid-template-columns:2.25rem minmax(0,1fr) auto;gap:.8rem;align-items:center;padding:.7rem .9rem;border:1px solid var(--sbp-rand);border-radius:var(--sb-radius-m,14px);background:var(--sbp-licht)}
.sbp-status__nr{width:2.25rem;height:2.25rem;border-radius:50%;display:grid;place-items:center;font-weight:800;background:var(--sb-zand,#e9dfd3);color:var(--sb-tekst-op-licht-zacht,#3d2a39)}
.sbp-status li.is-klaar .sbp-status__nr{background:var(--sbp-nacht);color:var(--sbp-champ)}
.sbp-status li.is-beurt{border-color:var(--sbp-roze);background:#fff;box-shadow:0 0 0 3px rgba(232,64,143,.15)}
.sbp-status li.is-beurt .sbp-status__nr{background:var(--sbp-roze);color:var(--sbp-nacht)}
.sbp-status__naam{display:block;font-weight:700}
.sbp-status__info{display:block;font-size:.875rem;color:var(--sbp-muted)}
.sbp-status a{font-size:.875rem;font-weight:700}
/* Nummers */
.sbp-nummers{list-style:none;padding:0;display:grid;gap:.45rem}
.sbp-nummers li{display:flex;align-items:center;gap:.75rem;padding:.55rem .8rem;border:1px solid var(--sbp-rand);border-radius:var(--sb-radius-s,10px);background:var(--sbp-licht)}
.sbp-nummer__tekst{flex:1;min-width:0}
.sbp-nummer__titel{display:block;font-weight:700;overflow-wrap:anywhere;line-height:1.35}
.sbp-nummer__meta{display:block;font-size:.875rem;color:var(--sbp-muted);overflow-wrap:anywhere}
.sbp-lijstveld{display:grid;gap:1rem}
.sbp-zoek{display:grid;gap:.4rem}
.sbp-zoek__status:empty{display:none}
.sbp-zoek__resultaten{list-style:none;padding:0;display:grid;gap:.35rem}
.sbp-zoek__resultaten:empty{display:none}
.sbp-zoek__resultaten button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.6rem .8rem;border:1px solid var(--sbp-rand);border-radius:var(--sb-radius-s,10px);background:#fff;color:inherit;font:inherit;text-align:left;cursor:pointer}
.sbp-zoek__resultaten button:hover{border-color:var(--sbp-roze);background:var(--sbp-licht)}
.sbp-plus{flex:none;font-weight:800;font-size:.875rem;color:var(--sbp-roze-d)}
/* Programma */
.sbp-prog{display:grid;gap:.75rem}
.sbp-prog__rij{display:grid;grid-template-columns:7rem minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr) auto;gap:.6rem;align-items:end;padding:.8rem;border:1px solid var(--sbp-rand);border-radius:var(--sb-radius-m,14px);background:var(--sbp-licht)}
.sbp-prog__rij .sbp-link{align-self:center;margin-top:1.4rem}
@media (max-width:767px){.sbp-prog__rij{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}.sbp-prog__rij>:nth-child(n+3){grid-column:1/-1}.sbp-prog__rij .sbp-link{margin:0;justify-self:start}}
.sbp-tijdlijn{list-style:none;padding:0;display:grid;gap:.6rem}
.sbp-tijdlijn li{display:grid;grid-template-columns:4.5rem minmax(0,1fr);gap:.75rem;padding-bottom:.6rem;border-bottom:1px solid var(--sbp-rand)}
.sbp-tijdlijn__tijd{font-weight:800;color:var(--sbp-roze-d)}
/* Waarden (alleen-lezen) */
.sbp-waarden{display:grid;gap:.75rem}
.sbp-waarde{display:grid;grid-template-columns:minmax(0,12rem) minmax(0,1fr);gap:.75rem}
.sbp-waarde dt{font-weight:700}
@media (max-width:600px){.sbp-waarde{grid-template-columns:1fr;gap:.1rem}}
/* Gastenlink */
.sbp-linkvak{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}
.sbp-linkvak code{flex:1 1 18rem;padding:.65rem .85rem;border-radius:var(--sb-radius-s,10px);background:var(--sbp-nacht);color:var(--sbp-champ);font-size:.875rem;overflow-wrap:anywhere;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
/* Top-lijst en stemmen */
.sbp-top{list-style:none;padding:0;display:grid;gap:.5rem;counter-reset:sbptop}
.sbp-top>li{counter-increment:sbptop;display:grid;grid-template-columns:2rem minmax(0,1fr) auto;gap:.75rem;align-items:center;padding:.6rem .8rem;border:1px solid var(--sbp-rand);border-radius:var(--sb-radius-s,10px);background:#fff}
.sbp-top>li::before{content:counter(sbptop);font-weight:800;font-size:1.1rem;text-align:center;color:var(--sbp-roze-d)}
.sbp-top>li.sbp-leeg{grid-template-columns:1fr}
.sbp-top>li.sbp-leeg::before{content:none}
.sbp-top form{margin:0}
.sbp-stem{display:inline-flex;align-items:center;gap:.4rem;min-height:40px;min-width:4.25rem;justify-content:center;padding:.35rem .8rem;border-radius:999px;border:1.5px solid var(--sbp-rand);background:#fff;color:inherit;font:inherit;font-weight:800;cursor:pointer;transition:background .2s ease,border-color .2s ease}
.sbp-stem:hover{border-color:var(--sbp-roze)}
.sbp-stem[aria-pressed=true]{background:var(--sbp-roze);border-color:var(--sbp-roze);color:var(--sbp-nacht)}
.sbp-stem svg{width:1rem;height:1rem}
/* Feestkaarten (lijst) */
.sbp-feestkaart{text-decoration:none;color:inherit!important;gap:.35rem;transition:border-color .2s ease,transform .2s ease}
.sbp-feestkaart:hover{border-color:var(--sbp-roze);transform:translateY(-2px)}
.sbp-feestkaart__naam{font-family:var(--sb-font-accent,'Bodoni Moda'),Georgia,serif;font-style:italic;font-size:1.75rem;line-height:1.15;color:var(--sbp-roze)}
/* Gastenpagina */
.sbp-gast{max-width:720px}
.sbp-gast__kop{text-align:center;display:grid;gap:.35rem;margin-bottom:1.5rem}
.sbp-gast>.sbp-klein{margin-top:1.5rem}
@media (prefers-reduced-motion:reduce){.sbp *{transition:none!important}}

/* 1.1.0 */
.sbp-mix{display:grid;gap:.75rem;margin-top:.5rem;padding-top:1rem;border-top:1px solid var(--sbp-rand)}
.sbp-mix:not(:has(input[type=checkbox]:checked)) .sbp-mix__tekst{display:none}
.sbp-prog__rij.is-verplaatst{animation:sbp-verplaatst 1.4s ease-out}
@keyframes sbp-verplaatst{from{background-color:var(--sb-blush,#f4c9da)}to{background-color:transparent}}
@media (prefers-reduced-motion:reduce){.sbp-prog__rij.is-verplaatst{animation:none}}
/* 1.2.0 */
.sbp-trouwkaart{display:grid;gap:.5rem;margin:.5rem 0 1rem}
.sbp-trouwkaart img{display:block;max-width:min(100%,360px);height:auto;border:1px solid var(--sbp-rand);border-radius:12px}
