/* Reserveren bij Carlito's (voorbeeld met Eterno Manage). Alles onder .rpg zodat de rest van de site ongemoeid blijft. */
.rpg{background:var(--cream)}
.rpg .site-header{background:var(--ink)}
.rpg main{padding-top:84px}
.rpg .rkop{padding:48px 0 26px;text-align:center}
.rpg .rkop .wrap{max-width:640px}
.rpg .rkop h1{font-size:clamp(2.2rem,8vw,3.4rem);margin:0 0 .3em}
.rpg .lead{color:var(--ink-soft);margin:0 0 20px}
.rpg .rwrap{width:min(100% - 36px,640px);margin:0 auto;padding-bottom:calc(96px + env(safe-area-inset-bottom))}
.rpg .stappen{display:flex;gap:6px;margin:0 0 26px;padding:0;list-style:none}
.rpg .stappen li{flex:1;height:4px;background:var(--line);transition:background .3s}
.rpg .stappen li.klaar,.rpg .stappen li.act{background:var(--terracotta)}
.rpg .stap{display:none;animation:rin .45s ease}
.rpg .stap.act{display:block}
@keyframes rin{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.rpg .stap h2{font-size:clamp(1.6rem,6vw,2.2rem);margin:0 0 6px}
.rpg .sub{font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;color:var(--terracotta);font-weight:600;margin:0 0 10px}

/* vestiging kiezen */
.rpg .vest{display:grid;gap:10px;margin:0 0 24px}
@media(min-width:560px){.rpg .vest{grid-template-columns:1fr 1fr}}
.rpg .vestkaart{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding:16px 18px;border:1px solid var(--line);background:var(--paper);color:var(--ink);text-align:left;cursor:pointer;font-family:var(--font-sans)}
.rpg .vestkaart h3{font:600 1.25rem var(--font-serif);margin:0}
.rpg .vestkaart small{display:block;color:var(--ink-soft);font-size:.88rem;margin-top:2px}
.rpg .vestkaart[aria-pressed="true"]{border-color:var(--terracotta);background:rgba(193,68,58,.07);box-shadow:inset 0 0 0 1px var(--terracotta)}
.rpg .vestkaart[aria-pressed="true"]::after{content:"✓";font-size:1.4rem;color:var(--terracotta)}
.rpg .vestkaart:focus-visible,.rpg .kd:focus-visible,.rpg .uur:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.rpg .kiesvest{color:var(--ink-soft);margin:0 0 18px;padding:14px 16px;border:1px dashed rgba(28,24,21,.3);font-size:.95rem}

/* personen */
.rpg .personen{display:flex;align-items:center;justify-content:center;gap:22px;margin:0 0 22px;padding:16px;border:1px solid var(--line);background:var(--paper)}
.rpg .personen button{width:54px;height:54px;border-radius:50%;border:1px solid var(--terracotta);background:transparent;color:var(--terracotta);font-size:1.7rem;cursor:pointer;line-height:1}
.rpg .personen button:disabled{opacity:.35;cursor:default}
.rpg .personen output{font:600 2.8rem/1 var(--font-serif);min-width:2.4ch;text-align:center}
.rpg .personen small{display:block;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);margin-top:6px}
.rpg .groepmelding{margin:0 0 20px;padding:16px;border:1px solid var(--terracotta);background:rgba(193,68,58,.07);display:none}
.rpg .groepmelding.aan{display:block}
.rpg .groepmelding a{color:var(--terracotta-dark);font-weight:600}
.rpg .sluitmelding{margin:14px 0 12px;padding:12px 14px;border:1px solid var(--terracotta);background:rgba(193,68,58,.07);font-size:.95rem;line-height:1.5}
.rpg .sluitmelding b{color:var(--terracotta-dark)}

/* maandkalender */
.rpg .kal-kop{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:6px 0 10px}
.rpg .kal-pijl{flex:none;width:48px;height:48px;border:1px solid var(--line);background:var(--paper);color:var(--terracotta);font-size:1.7rem;line-height:1;cursor:pointer}
.rpg .kal-pijl:disabled{opacity:.3;cursor:not-allowed}
.rpg .kal-maand{flex:1;display:block}
.rpg .kal-maand select{width:100%;height:48px;padding:0 14px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:600 1.15rem var(--font-serif);text-transform:capitalize;text-align:center;text-align-last:center;appearance:none;-webkit-appearance:none;border-radius:0}
.rpg .kal-week,.rpg .kal-rooster{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.rpg .kal-week span{text-align:center;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);padding:4px 0}
.rpg .kal-rooster i{display:block}
.rpg .kd{aspect-ratio:1;min-height:44px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:500 1.1rem var(--font-sans);cursor:pointer;padding:0}
.rpg .kd.vandaag{border-color:var(--terracotta)}
.rpg .kd[aria-pressed="true"]{background:var(--terracotta);border-color:var(--terracotta);color:#fff;font-weight:600}
.rpg .kd:disabled{opacity:.3;cursor:not-allowed;background:transparent}
.rpg .kal-legende{margin:10px 0 0;font-size:.8rem;color:var(--ink-soft)}

/* uren */
.rpg .uurblok{margin:0 0 18px}
.rpg .uurblok h3{font:600 .76rem var(--font-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--terracotta);margin:0 0 10px}
.rpg .uren-chips{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.rpg .uur{padding:15px 0;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:500 1.05rem var(--font-sans);cursor:pointer}
.rpg .uur[aria-pressed="true"]{background:var(--terracotta);border-color:var(--terracotta);color:#fff;font-weight:600}
.rpg .uur:disabled{opacity:.35;text-decoration:line-through;cursor:not-allowed}

/* gegevens */
.rpg .rveld{display:grid;gap:6px;margin:0 0 14px;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.rpg .rveld input,.rpg .rveld textarea{width:100%;min-height:54px;padding:14px 16px;background:var(--paper);border:1px solid rgba(28,24,21,.22);color:var(--ink);font:400 1.05rem var(--font-sans);letter-spacing:0;text-transform:none;border-radius:0}
.rpg .rveld textarea{min-height:90px;resize:vertical}
.rpg .rveld input:focus,.rpg .rveld textarea:focus{outline:none;border-color:var(--terracotta)}
.rpg .rveld .fout,.rpg .formfout,.rpg .annuleerblok .fout{color:var(--terracotta-dark);font-size:.85rem;text-transform:none;letter-spacing:0;min-height:1.2em}
.rpg .formfout{font-size:.95rem;margin:0}
.rpg .rnb{display:flex;gap:12px;align-items:flex-start;margin:4px 0 16px;font-size:.9rem;line-height:1.5;color:var(--ink-soft);cursor:pointer}
.rpg .rnb input{flex:none;width:20px;height:20px;margin-top:2px;accent-color:var(--terracotta)}

/* knoppen onderaan */
.rpg .knop{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;border:1px solid var(--terracotta);background:var(--terracotta);color:#fff;font:600 .85rem/1 var(--font-sans);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;cursor:pointer;border-radius:var(--radius)}
.rpg .knop:hover{background:var(--terracotta-dark);border-color:var(--terracotta-dark)}
.rpg .knop.licht{background:transparent;color:var(--ink);border-color:rgba(28,24,21,.4)}
.rpg .knop.licht:hover{background:rgba(28,24,21,.06);border-color:var(--ink)}
.rpg .nav2{position:fixed;left:0;right:0;bottom:0;z-index:55;display:flex;gap:10px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(247,241,230,.97);border-top:1px solid var(--line)}
.rpg .nav2 .knop{flex:1}
.rpg .nav2 .terug{flex:0 0 auto;min-width:56px}
.rpg .nav2 .knop[disabled]{opacity:.4;pointer-events:none}
@media(min-width:700px){.rpg .nav2{position:static;background:none;border:0;padding:20px 0 0}.rpg .rwrap{padding-bottom:60px}}

/* bevestiging */
.rpg .klaarkop{text-align:center;margin:0 0 22px}
.rpg .klaarkop .vink{display:inline-grid;place-items:center;width:72px;height:72px;border-radius:50%;border:2px solid var(--green);color:var(--green);font-size:2.2rem;margin-bottom:14px;animation:rpop .6s cubic-bezier(.2,1.4,.4,1)}
@keyframes rpop{from{transform:scale(.3);opacity:0}to{transform:none;opacity:1}}
.rpg .samen{padding:20px;border:1px solid var(--terracotta);background:var(--paper);margin:0 0 18px}
.rpg .samen dl{margin:0;display:grid;gap:10px}
.rpg .samen dl div{display:flex;justify-content:space-between;gap:14px;border-bottom:1px solid var(--line);padding-bottom:10px}
.rpg .samen dt{color:var(--ink-soft)}.rpg .samen dd{margin:0;text-align:right;font-weight:500}
.rpg .agenda{display:grid;gap:10px;margin:0 0 18px}
.rpg .agenda .knop{width:100%}
.rpg .annuleerblok{display:grid;gap:6px;justify-items:center;margin:6px 0 16px}
.rpg .annuleer{background:none;border:0;color:var(--ink-soft);font:500 .9rem var(--font-sans);text-decoration:underline;text-underline-offset:3px;cursor:pointer;padding:10px}
.rpg .annuleer[data-klaar="1"]{color:var(--terracotta-dark)}
.rpg .demonoot{padding:14px 16px;border:1px dashed rgba(28,24,21,.3);color:var(--ink-soft);font-size:.85rem;margin:0 0 18px}
.rpg .demonoot a,.rpg .lead a{color:var(--terracotta-dark);font-weight:600}
.rpg .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.rpg .rfoot{padding:36px 0 0}

/* take-away bestellen (12/11/2026) */
.rpg .tkintro h2{margin:0 0 6px}
.rpg .tkuren{margin:0 0 16px;padding:14px 16px;border:1px solid var(--line);background:var(--paper);font-size:.98rem}
.rpg .tkh{font-size:clamp(1.35rem,5vw,1.8rem);margin:30px 0 10px}
.rpg .fine{color:var(--ink-soft);font-size:.88rem;margin:0 0 10px}
.rpg .tkmenu{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.rpg .tkitem{display:grid;grid-template-columns:1fr auto auto;gap:6px 14px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line)}
.rpg .tki b{display:block;font:600 1.05rem var(--font-serif)}
.rpg .tkd{display:block;color:var(--ink-soft);font-size:.86rem;margin-top:2px}
.rpg .tkp{font-weight:600;white-space:nowrap}
.rpg .tkq{display:flex;align-items:center;gap:8px}
.rpg .tkq button{width:40px;height:40px;border-radius:50%;border:1px solid var(--terracotta);background:transparent;color:var(--terracotta);font-size:1.3rem;line-height:1;cursor:pointer}
.rpg .tkq button:disabled{opacity:.3;cursor:default}
.rpg .tkq output{min-width:1.6ch;text-align:center;font-weight:600}
.rpg .tkmand{margin-top:8px}
.rpg .tkrij{list-style:none;margin:0;padding:0;border:1px solid var(--line);background:var(--paper)}
.rpg .tkrij li{display:flex;justify-content:space-between;gap:12px;padding:10px 14px;border-bottom:1px solid var(--line)}
.rpg .tkrij li:last-child{border-bottom:0}
.rpg .tkrij .tot{background:rgba(193,68,58,.07);font-size:1.05rem}
.rpg .tkdagen{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.rpg .tkdag{padding:11px 14px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:500 .95rem var(--font-sans);cursor:pointer;text-transform:capitalize}
.rpg .tkdag[aria-pressed="true"]{background:var(--terracotta);border-color:var(--terracotta);color:#fff}
.rpg .tkbetaal h3{margin:0 0 6px}
.rpg .qrbox{display:flex;justify-content:center;margin:14px 0}
.rpg .qrbox svg{max-width:100%;height:auto;border:1px solid var(--line)}
.rpg .tkwacht{display:flex;align-items:center;gap:10px;justify-content:center;margin:16px 0 0;font-weight:600;color:var(--terracotta-dark)}
.rpg .tkpuls{width:12px;height:12px;border-radius:50%;background:var(--terracotta);animation:tkpuls 1.2s ease-in-out infinite}
@keyframes tkpuls{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}
.tkbar{position:fixed;left:0;right:0;bottom:0;z-index:55;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(28,24,21,.96);color:#fff}
.tkbar[hidden]{display:none}
.tkbar .knop{min-height:44px;padding:0 18px;font-size:.78rem}
@media(max-width:640px){.rpg .tkitem{grid-template-columns:1fr auto}.rpg .tkp{grid-column:1;justify-self:start}.rpg .tkq{grid-column:2;grid-row:1 / span 2}}
@media(prefers-reduced-motion:reduce){.rpg .tkpuls{animation:none}}

/* bar-keuze */
.rpg .zitkeuze{margin:0 0 20px}
.rpg .zitkeuze[hidden]{display:none}
.rpg .zk-kop{margin:0 0 8px;font:600 .72rem var(--font-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft)}
.rpg .zk-rij{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.rpg .zk{padding:14px 10px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:500 1rem var(--font-sans);cursor:pointer}
.rpg .zk[aria-pressed="true"]{background:var(--terracotta);border-color:var(--terracotta);color:#fff;font-weight:600}
.rpg .zk:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.rpg .zknoot{margin:10px 0 0;font-size:.92rem;color:var(--ink-soft)}