/* Aanvullingen voor de Wix Headless-versie: initialen als er (nog) geen foto is. */
.profile__initials {
  display: grid; place-items: center; width: 100%; height: 100%; min-height: 12rem;
  font-size: clamp(2.5rem, 2rem + 2vw, 4rem); font-weight: 300; letter-spacing: -.02em;
  color: var(--green-800);
  background: radial-gradient(80% 60% at 100% 0%, rgb(216 232 222 / .9), rgb(216 232 222 / 0) 70%), linear-gradient(170deg, var(--mint-50), var(--cream-50));
}
.appt__photo--initials {
  display: grid; place-items: center; font-weight: 600; font-size: 1.125rem; color: var(--green-800);
  background: var(--mint-100);
}

/* Homepage-infobalk: snelle links naar voorschriften, verslagen en uitslagen */
.infobar__links { grid-column: 1 / -1; display: grid; justify-items: center; gap: 8px; margin: 0; padding: 0; list-style: none; }
.infobar__links li { width: 100%; max-width: 14rem; }
.infobar__links .btn { width: 100%; min-height: 2.5rem; padding: .3rem .9rem; font-size: 1rem; gap: .45em; justify-content: center; text-align: center; white-space: nowrap; hyphens: none; background: var(--mint-200); border-color: var(--mint-300); color: var(--green-800); }
.infobar__links .btn:hover { background: var(--mint-300); border-color: var(--green-400); }
.infobar__links .btn .icon { width: .95em; height: .95em; }

/* Online afspraak in een groot venster (public/js/booking-popup.js) */
html.bookpop-open { overflow: hidden; }
.bookpop { width: min(1040px, 96vw); height: min(92vh, 920px); max-width: none; max-height: none; margin: auto; padding: 0; border: 0; border-radius: 24px; background: #fff; color: var(--ink); box-shadow: 0 30px 80px -20px rgb(10 30 22 / .55); overflow: hidden; }
.bookpop[open] { display: flex; flex-direction: column; align-items: stretch; }
.bookpop::backdrop { background: rgb(14 32 25 / .62); }
.bookpop__bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 12px 12px 24px; background: var(--mint-100); border-bottom: 1px solid var(--line); }
.bookpop__title { margin: 0; font-size: 1.1875rem; font-weight: 600; line-height: 1.3; color: var(--green-800); }
.bookpop__close { display: inline-flex; align-items: center; gap: .5em; min-height: 2.75rem; padding: .4rem 1.1rem; border: 1.5px solid var(--mint-300); border-radius: 999px; background: #fff; color: var(--green-800); font: inherit; font-size: 1.0625rem; font-weight: 500; cursor: pointer; }
.bookpop__close:hover { background: var(--mint-200); }
.bookpop__close .icon { width: 1.1em; height: 1.1em; }
.bookpop__stage { position: relative; flex: 1; min-height: 0; background: #fff; }
.bookpop__loading { position: absolute; inset: 0; display: grid; place-items: center; margin: 0; padding: 24px; text-align: center; color: var(--ink-2); }
.bookpop__frame { position: relative; display: block; width: 100%; height: 100%; border: 0; }
.bookpop__stage:not(.is-loaded) .bookpop__frame { visibility: hidden; }
.bookpop__stage.is-loaded .bookpop__loading { display: none; }
.bookpop__foot { margin: 0; padding: 10px 24px; border-top: 1px solid var(--line); background: var(--mint-50); font-size: 1rem; color: var(--ink-2); }
@media (max-width: 640px) {
  .bookpop { width: 100vw; height: 100dvh; border-radius: 0; }
  .bookpop__bar { padding-left: 16px; }
  .bookpop__title { font-size: 1.0625rem; }
  .bookpop__foot { padding: 8px 16px; }
}
@media (prefers-reduced-motion: no-preference) {
  .bookpop[open] { animation: bookpop-in .22s ease-out; }
  .bookpop[open]::backdrop { animation: bookpop-fade .22s ease-out; }
}
@keyframes bookpop-in { from { opacity: 0; transform: translateY(12px) scale(.985); } }
@keyframes bookpop-fade { from { opacity: 0; } }

/* Welkomstpopup op de startpagina (public/js/welkom-popup.js) */
.welkom { width: 100%; max-width: min(520px, calc(100vw - 32px)); margin: auto; padding: 0; border: 0; border-radius: var(--r-lg); background: #fff; color: var(--ink); box-shadow: var(--shadow-2); overflow: hidden; }
.welkom::backdrop { background: rgb(13 26 20 / .55); }
.welkom__top { position: relative; padding: 28px 28px 22px; background: var(--mint-100); }
.welkom__top .icon { width: 30px; height: 30px; color: var(--green-800); }
.welkom__close { position: absolute; right: 12px; top: 12px; display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgb(255 255 255 / .8); color: var(--ink); cursor: pointer; }
.welkom__close:hover { background: #fff; }
.welkom__body { padding: 22px 28px 28px; }
.welkom__title { margin: 0 0 .6rem; font-size: 1.75rem; line-height: 1.15; letter-spacing: -.015em; }
.welkom__body p { color: var(--ink-2); }
.welkom__body .btn { margin-top: 1.4rem; }
@media (prefers-reduced-motion: no-preference) {
  .welkom[open] { animation: bookpop-in .22s ease-out; }
  .welkom[open]::backdrop { animation: bookpop-fade .22s ease-out; }
}
@media print { .welkom { display: none !important; } }
