/**
 * Neutral styling: it inherits the theme's fonts and colours through
 * CSS variables, so it looks at home anywhere without being restyled.
 */
.sala-form{
	--sala-accent:#1d2327;
	--sala-line:rgba(0,0,0,.12);
	--sala-muted:rgba(0,0,0,.55);
	--sala-radius:10px;
	max-width:760px;
	margin:0 auto;
}

.sala-step{display:none}
.sala-step.is-active{display:block;animation:sala-in .35s ease}
@keyframes sala-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.sala-eyebrow{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;
	color:var(--sala-muted);margin:0 0 .5rem}
.sala-title{font-size:clamp(1.4rem,3.4vw,2rem);line-height:1.2;margin:0 0 1.4rem}
.sala-hint{font-size:.9rem;color:var(--sala-muted);line-height:1.6}

/* rooms */
.sala-rooms{display:grid;gap:.6rem;margin-bottom:1.6rem}
.sala-room{display:block;width:100%;text-align:left;padding:1rem 1.15rem;cursor:pointer;
	background:none;border:1px solid var(--sala-line);border-radius:var(--sala-radius);
	transition:border-color .2s,background .2s}
.sala-room:hover{border-color:var(--sala-accent)}
.sala-room.is-on{border-color:var(--sala-accent);background:rgba(0,0,0,.04)}
.sala-room-name{display:block;font-size:1.1rem;font-weight:600}
.sala-room-desc{display:block;font-size:.85rem;color:var(--sala-muted);margin-top:.2rem}

/* party counter */
.sala-counter{display:flex;align-items:center;gap:1.6rem;margin-bottom:.8rem}
.sala-minus,.sala-plus{width:54px;height:54px;border-radius:50%;cursor:pointer;
	background:none;border:1px solid var(--sala-line);font-size:1.4rem;line-height:1;
	transition:border-color .2s}
.sala-minus:hover,.sala-plus:hover{border-color:var(--sala-accent)}
.sala-count{font-size:2.6rem;font-weight:600;min-width:2.4ch;text-align:center}

/* calendar */
.sala-cal-head{display:flex;align-items:center;gap:1rem;margin-bottom:.9rem}
.sala-cal-month{font-size:1.05rem;font-weight:600;text-transform:capitalize}
.sala-cal-prev,.sala-cal-next{width:38px;height:38px;border-radius:50%;cursor:pointer;
	background:none;border:1px solid var(--sala-line);font-size:1.1rem}
.sala-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.35rem}
.sala-day{aspect-ratio:1;border:1px solid var(--sala-line);border-radius:8px;cursor:pointer;
	background:none;font-size:.95rem;transition:border-color .2s,background .2s}
.sala-day:hover:not(:disabled){border-color:var(--sala-accent)}
.sala-day:disabled{opacity:.3;cursor:not-allowed}
.sala-day.is-on{background:var(--sala-accent);color:#fff;border-color:var(--sala-accent)}

/* seatings */
.sala-services{display:grid;gap:.6rem;margin-bottom:1.6rem}
.sala-service{display:flex;flex-direction:column;align-items:flex-start;gap:.15rem;
	padding:1rem 1.15rem;cursor:pointer;text-align:left;
	background:none;border:1px solid var(--sala-line);border-radius:var(--sala-radius)}
.sala-service:hover:not(:disabled){border-color:var(--sala-accent)}
.sala-service.is-on{border-color:var(--sala-accent);background:rgba(0,0,0,.04)}
.sala-service:disabled{opacity:.45;cursor:not-allowed}
.sala-service-label{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--sala-muted)}
.sala-service b{font-size:1.25rem}
.sala-service-by{font-size:.85rem;color:var(--sala-muted)}
.sala-service em{font-style:normal;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;
	color:var(--sala-muted);margin-top:.25rem}

/* details */
.sala-recap{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.2rem}
.sala-recap span{font-size:.82rem;padding:.35rem .75rem;border:1px solid var(--sala-line);border-radius:100px}
.sala-fields{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.2rem}
.sala-fields label{display:block}
.sala-fields .sala-wide{grid-column:1/-1}
.sala-fields span{display:block;font-size:.8rem;color:var(--sala-muted);margin-bottom:.35rem}
.sala-fields small{display:block;font-size:.78rem;color:var(--sala-muted);margin-top:.4rem;line-height:1.5}
.sala-fields input,.sala-fields textarea{width:100%;padding:.7rem .85rem;font:inherit;
	background:none;border:1px solid var(--sala-line);border-radius:8px}
.sala-fields input:focus,.sala-fields textarea:focus{outline:none;border-color:var(--sala-accent)}
@media(max-width:620px){.sala-fields{grid-template-columns:1fr}}

/* buttons */
.sala-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1.2rem}
.sala-btn{padding:.85rem 1.6rem;font:inherit;font-size:.82rem;font-weight:600;
	letter-spacing:.08em;text-transform:uppercase;cursor:pointer;
	background:var(--sala-accent);color:#fff;border:1px solid var(--sala-accent);border-radius:100px}
.sala-btn:hover{opacity:.86}
.sala-btn:disabled{opacity:.5;cursor:wait}
.sala-ghost{background:none;color:inherit;border-color:var(--sala-line)}
.sala-btn-danger{background:#b32d2e;border-color:#b32d2e}
.sala-error{color:#b32d2e;font-size:.9rem;margin:.6rem 0 0}
.sala-code{font-size:1.6rem;font-weight:700;letter-spacing:.12em;margin-top:.6rem}

/* manage screen */
.sala-manage{max-width:560px;margin:4rem auto;padding:0 1.2rem}
.sala-summary{list-style:none;padding:0;margin:1.6rem 0}
.sala-summary li{display:flex;justify-content:space-between;gap:1rem;
	padding:.7rem 0;border-top:1px solid var(--sala-line,rgba(0,0,0,.12))}
.sala-summary span{color:rgba(0,0,0,.55)}
.sala-note{font-size:.9rem;color:rgba(0,0,0,.55);line-height:1.6}

/* running-clock mode: many times, so they go in a grid */
.sala-services.is-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.sala-services.is-grid .sala-service{align-items:center;text-align:center;padding:.8rem .6rem}
.sala-services.is-grid .sala-service b{font-size:1.1rem}