:root {
  --strandhuisje-kalender-background: #fff;
  --strandhuisje-kalender-foreground: #243f4b;
  --strandhuisje-kalender-muted: #53656d;
  --strandhuisje-kalender-primary: #216078;
  --strandhuisje-kalender-primary-foreground: #fff;
  --strandhuisje-kalender-border: #dbe3e5;
  --strandhuisje-kalender-shadow: 0 -4px 20px #243f4b18;
  --strandhuisje-kalender-boekaccent: #70bbed;
}
.strandhuisje-kalender-iframe { width: 100%; max-width: 100%; border: 0; display: block; }
.strandhuisje-kalender-boekbalk { position: fixed; z-index: 9990; inset: auto 0 0; background: var(--strandhuisje-kalender-background); color: var(--strandhuisje-kalender-foreground); border-top: 1px solid var(--strandhuisje-kalender-border); box-shadow: var(--strandhuisje-kalender-shadow); padding: 12px 20px max(12px, env(safe-area-inset-bottom)); font: 15px/1.4 system-ui, sans-serif; }
.strandhuisje-kalender-boekbalk[hidden] { display: none; }
.strandhuisje-kalender-boekbalk-inhoud { position: relative; max-width: 1100px; margin: auto; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-right: 40px; }
.strandhuisje-kalender-boekbalk-tekst { min-width: 0; flex: 1; }
.strandhuisje-kalender-boekbalk p { margin: 0 0 4px; width: 100%; font-size: var(--regel-grootte, 15px); font-weight: 600; white-space: nowrap; line-height: 1.5; letter-spacing: 0; }
.strandhuisje-kalender-boekbalk small { display: block; color: var(--strandhuisje-kalender-muted); font-size: 12px; white-space: nowrap; }
.strandhuisje-kalender-boekbalk .strandhuisje-kalender-datums { position: absolute; top: -4px; right: -4px; display: grid; place-items: center; width: 40px; height: 40px; min-width: 40px; padding: 8px; border: 0; border-radius: 6px; background: var(--strandhuisje-kalender-background); color: var(--strandhuisje-kalender-primary); cursor: pointer; }
.strandhuisje-kalender-datums svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; }
.strandhuisje-kalender-datums:focus-visible { outline: 2px solid var(--strandhuisje-kalender-primary); }
.strandhuisje-kalender-boekbalk[data-sluiten="true"] { opacity: 0; transform: translateY(100%); transition: opacity .18s ease, transform .18s ease; pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .strandhuisje-kalender-boekbalk[data-sluiten="true"] { transition: none; } }
.strandhuisje-kalender-boekbalk a { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; max-width: 100%; min-height: 44px; padding: 12px 20px; border-radius: 6px; background: var(--strandhuisje-kalender-primary); color: var(--strandhuisje-kalender-primary-foreground); font-size: 15px; font-weight: 700; text-decoration: none; text-align: center; }
.strandhuisje-kalender-boekbalk a:focus-visible { outline: 3px solid var(--strandhuisje-kalender-primary); outline-offset: 3px; }
.strandhuisje-kalender-boekbalk a { position: relative; overflow: hidden; }
.strandhuisje-kalender-boekbalk a::after { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: var(--strandhuisje-kalender-boekaccent); transform: scaleX(0); transform-origin: center; transition: transform .22s ease-in; pointer-events: none; }
.strandhuisje-kalender-boekbalk a[data-accent="true"]::after { transform: scaleX(1); transition: transform .55s ease-out; }
@media (prefers-reduced-motion: reduce) { .strandhuisje-kalender-boekbalk a::after, .strandhuisje-kalender-boekbalk a[data-accent="true"]::after { transition: none; } }
body.strandhuisje-kalender-boeking-actief { padding-bottom: 84px; }
@media (max-width: 600px) {
  .strandhuisje-kalender-boekbalk { padding-inline: 12px; }
  .strandhuisje-kalender-boekbalk-inhoud { flex-direction: column; align-items: stretch; gap: 8px; padding-right: 0; }
  .strandhuisje-kalender-boekbalk-tekst { padding-right: 36px; }
  .strandhuisje-kalender-boekbalk p { font-size: var(--regel-grootte, 14px); }
  .strandhuisje-kalender-boekbalk a { padding: 10px 12px; }
  body.strandhuisje-kalender-boeking-actief { padding-bottom: 144px; }
}