/* RSVP form and small shared pieces used by every invitation template. Colours come from --line, --ink and --to. */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.rsvp{max-width:340px;margin:0 auto;display:flex;flex-direction:column;gap:16px;text-align:left}
.rsvp fieldset{border:0;padding:0;margin:0}
.rf{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:600}
.rf input{height:50px;border-radius:14px;border:1.5px solid color-mix(in srgb,var(--line) 70%,transparent);background:color-mix(in srgb,var(--line) 10%,transparent);color:inherit;font:inherit;font-size:17px;padding:0 14px;outline:0}
.rf input:focus{border-color:var(--line);box-shadow:0 0 0 4px color-mix(in srgb,var(--line) 25%,transparent)}
.rchoice{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.rchoice label,.rfns label{cursor:pointer}
.rchoice input,.rfns input{position:absolute;opacity:0}
.rchoice span{display:flex;align-items:center;justify-content:center;text-align:center;min-height:52px;padding:8px 10px;border-radius:14px;border:1.5px solid color-mix(in srgb,var(--line) 60%,transparent);font-weight:700;font-size:15px;transition:background .2s,color .2s}
.rchoice input:checked+span,.rfns input:checked+span{background:var(--line);border-color:var(--line);color:var(--to)}
.rchoice input:focus-visible+span,.rfns input:focus-visible+span{outline:2px solid var(--ink);outline-offset:2px}
.rfns{display:flex;flex-wrap:wrap;gap:8px}
.rfns legend{font-size:14px;font-weight:600;margin-bottom:8px;padding:0}
.rfns span{display:inline-flex;align-items:center;height:38px;padding:0 14px;border-radius:999px;border:1.5px solid color-mix(in srgb,var(--line) 60%,transparent);font-size:14px;font-weight:600;transition:background .2s,color .2s}
.ibtn{display:inline-flex;align-items:center;gap:8px;height:48px;padding:0 26px;border-radius:999px;border:1.5px solid var(--line);font-weight:700;font-size:14px;text-decoration:none;color:inherit;background:none}
.ibtn:hover{background:color-mix(in srgb,var(--line) 15%,transparent)}
.ibtn.solid{background:var(--line);color:var(--to);justify-content:center;margin-top:4px;cursor:pointer;font-family:inherit;font-size:15px}
.ibtn.solid:disabled{opacity:.5;cursor:not-allowed}
.rsvp small{text-align:center;opacity:.75;font-size:13px}
.rsvp-done{font-size:19px;max-width:28ch;margin:0 auto}
.rsvp-err{background:color-mix(in srgb,#C8324F 35%,transparent);border-radius:12px;padding:10px 14px;max-width:340px;margin:0 auto 14px;font-size:14px}
.ilang{position:fixed;top:calc(12px + env(safe-area-inset-top,0px));left:50%;transform:translateX(-50%);z-index:30;display:flex;gap:4px;padding:4px;border-radius:999px;background:rgba(255,255,255,.92);box-shadow:0 4px 16px rgba(0,0,0,.2);max-width:calc(100% - 96px);overflow-x:auto}
.ilang a{padding:6px 14px;border-radius:999px;font-size:13px;font-weight:600;color:#172524;text-decoration:none;white-space:nowrap}
.ilang a.on{background:#0E4A47;color:#fff}
.wm{position:fixed;inset:0;z-index:25;pointer-events:none;display:flex;flex-direction:column;justify-content:space-around;align-items:center;overflow:hidden}
.wm span{font-size:34px;font-weight:800;letter-spacing:.3em;color:rgba(160,160,160,.14);transform:rotate(-28deg);white-space:nowrap}