/* ─── BOOKING SECTION ────────────────────────────────────────── */
.bk-sec { background: var(--charcoal); padding: var(--sp-2xl) var(--sp-xl); }
.bk-inner { max-width: 940px; margin: 0 auto; }
.bk-hdr { text-align: center; margin-bottom: 40px; color: var(--cream); }
.bk-hdr p { color: rgba(245,240,232,.46); font-size: .84rem; max-width: 460px; margin: .4rem auto 0; }
.checkin-note {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: rgba(201,162,39,.11);
  border: 1px solid rgba(201,162,39,.26);
  color: var(--gold);
  padding: 6px 13px;
  font-size: .72rem;
  letter-spacing: .09em;
  text-transform: uppercase;
  margin-top: 12px;
}

/* Steps */
.step { margin-bottom: 28px; }
.step-lbl {
  font-size: .64rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 11px;
  display: flex;
  align-items: center;
  gap: 10px;
}
.step-lbl::after { content: ''; flex: 1; height: 1px; background: rgba(201,162,39,.15); }

/* ─── GUEST PICKER ───────────────────────────────────────────── */
.guest-sel { display: flex; align-items: center; gap: 20px; margin: 12px 0 8px; }
.g-btn {
  width: 44px; height: 44px;
  background: rgba(201,162,39,.1);
  border: 1px solid rgba(201,162,39,.3);
  color: var(--gold);
  font-size: 1.4rem;
  cursor: pointer;
  transition: background .2s;
  flex-shrink: 0;
  border-radius: 2px;
}
.g-btn:hover    { background: rgba(201,162,39,.2); }
.g-btn:disabled { opacity: .3; cursor: not-allowed; }
.g-num { text-align: center; min-width: 60px; }
.g-num span {
  display: block;
  font-family: 'Cormorant Garamond', serif;
  font-size: 2.4rem;
  font-weight: 300;
  color: var(--cream);
  line-height: 1;
}
.g-num small { font-size: var(--fs-xs); letter-spacing: .15em; text-transform: uppercase; color: rgba(245,240,232,.4); }

.cot-assign {
  margin-top: 14px;
  padding: 14px 16px;
  background: rgba(201,162,39,.06);
  border: 1px solid rgba(201,162,39,.15);
  color: var(--cream);
}
.cot-assign strong { color: var(--gold); font-size: .9rem; font-weight: 400; }
.cot-assign small  { display: block; font-size: .7rem; color: rgba(245,240,232,.38); margin-top: 4px; letter-spacing: .05em; }

.avail-msg { margin-top: 10px; font-size: .78rem; padding: 8px 12px; border-radius: 2px; }
.avail-ok  { background: rgba(45,74,45,.2); border: 1px solid var(--moss); color: #9ccd9c; }
.avail-no  { background: rgba(180,55,55,.15); border: 1px solid rgba(180,55,55,.4); color: #e8a0a0; }

/* ─── CALENDAR ───────────────────────────────────────────────── */
.cal { color: var(--cream); }
.cal-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}
.cal-nav button {
  background: none;
  border: 1px solid rgba(245,240,232,.17);
  color: var(--cream);
  width: 30px; height: 30px;
  cursor: pointer;
  font-size: .88rem;
  transition: border-color .2s, color .2s;
  min-width: 44px;
  min-height: 44px;
}
.cal-nav button:hover { border-color: var(--gold); color: var(--gold); }
.cal-nav span { font-family: 'Cormorant Garamond', serif; font-size: .98rem; font-weight: 300; letter-spacing: .08em; }

.cal-months { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.cm-ttl { text-align: center; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; opacity: .43; margin-bottom: 7px; }
.dh { display: grid; grid-template-columns: repeat(7,1fr); gap: 2px; margin-bottom: 2px; }
.dh span { text-align: center; font-size: .58rem; letter-spacing: .07em; text-transform: uppercase; opacity: .34; padding: 2px 0; }
.dg { display: grid; grid-template-columns: repeat(7,1fr); gap: 2px; }

.d {
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: .76rem;
  border-radius: 2px;
  transition: background .15s, color .15s;
  cursor: default;
}
.d.avail {
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(201,162,39,.35);
}
.d.avail:hover,
.d.avail:active { background: rgba(201,162,39,.17); color: var(--gold); }
.d.past    { opacity: .2; }
.d.blocked { background: rgba(180,55,55,.12); color: rgba(245,240,232,.25); cursor: not-allowed; font-size: .68rem; }
.d.ci,
.d.co      { background: var(--gold); color: var(--charcoal); font-weight: 600; }
.d.rng     { background: rgba(201,162,39,.1); }
.d.td      { position: relative; }
.d.td::after {
  content: '';
  position: absolute;
  bottom: 2px;
  left: 50%;
  transform: translateX(-50%);
  width: 3px; height: 3px;
  border-radius: 50%;
  background: var(--gold);
}

.cal-hint  { margin-top: 9px; font-size: .76rem; color: rgba(245,240,232,.4); text-align: center; min-height: 1.1em; }
.dates-row { display: none; gap: 20px; flex-wrap: wrap; margin-top: 8px; }
.dr-item small  { font-size: .64rem; letter-spacing: .09em; text-transform: uppercase; opacity: .4; display: block; }
.dr-item strong { font-size: .86rem; color: var(--cream); font-weight: 400; }

/* ─── SAUNA TOGGLE ───────────────────────────────────────────── */
.tog-row {
  display: flex;
  align-items: center;
  gap: 11px;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: rgba(201,162,39,.3);
}
.tog {
  width: 42px; height: 22px;
  background: rgba(245,240,232,.12);
  border-radius: 11px;
  position: relative;
  transition: background .2s;
  flex-shrink: 0;
}
.tog.on { background: var(--gold); }
.tok {
  width: 16px; height: 16px;
  background: #fff;
  border-radius: 50%;
  position: absolute;
  top: 3px; left: 3px;
  transition: left .2s;
  box-shadow: 0 1px 3px rgba(0,0,0,.3);
}
.tog.on .tok { left: 23px; }
.tog-lbl       { font-size: .84rem; color: var(--cream); }
.tog-lbl small { display: block; font-size: .68rem; color: rgba(245,240,232,.38); margin-top: 2px; }
.sauna-extra   { margin-top: 14px; display: none; grid-template-columns: 1fr 1fr; gap: 11px; }

/* ─── FORM FIELDS ────────────────────────────────────────────── */
.ff { display: flex; flex-direction: column; gap: 4px; }
.ff label { font-size: .64rem; letter-spacing: .11em; text-transform: uppercase; color: rgba(245,240,232,.4); }
.ff input,
.ff select,
.ff textarea {
  background: rgba(245,240,232,.06);
  border: 1px solid rgba(245,240,232,.12);
  color: var(--cream);
  padding: 10px 11px;
  font-family: 'Jost', sans-serif;
  font-size: 16px;
  outline: none;
  transition: border-color .2s;
  -webkit-appearance: none;
  border-radius: 0;
}
.ff input:focus,
.ff select:focus,
.ff textarea:focus { border-color: var(--gold); }
.ff input::placeholder,
.ff textarea::placeholder { color: rgba(245,240,232,.24); }
.ff select        { color: #f5f0e8; }
.ff select option { background: #3a302a; color: #f5f0e8; }
.ff textarea      { resize: vertical; min-height: 66px; }
.fgrid            { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
.fgrid .full      { grid-column: 1 / -1; }
/* Cottage guest-count selects (inside booking step 1) */
.cot-gw select {
  width: 100%;
  background: #3a302a;
  border: 1px solid rgba(201,162,39,.28);
  color: #f5f0e8;
  padding: 7px 10px;
  font-family: 'Jost', sans-serif;
  font-size: .76rem;
  -webkit-appearance: none;
  border-radius: 0;
  cursor: pointer;
  outline: none;
}
.cot-gw select option { background: #3a302a; color: #f5f0e8; }

/* ─── PRICE SUMMARY ──────────────────────────────────────────── */
.pbox { background: rgba(201,162,39,.05); border: 1px solid rgba(201,162,39,.15); padding: 18px 22px; margin: 22px 0 18px; }
.pr   { display: flex; justify-content: space-between; font-size: .79rem; color: rgba(245,240,232,.5); padding: 4px 0; border-bottom: 1px solid rgba(245,240,232,.05); }
.pr:last-of-type { border: none; }
.pt   { display: flex; justify-content: space-between; font-size: 1rem; color: var(--cream); padding: 10px 0 0; margin-top: 5px; border-top: 1px solid rgba(201,162,39,.2); }
.pt b { color: var(--gold); }
.pnote { font-size: .66rem; color: rgba(245,240,232,.26); margin-top: 6px; line-height: 1.55; }

.sub-btn {
  width: 100%;
  background: var(--gold);
  color: var(--charcoal);
  border: none;
  padding: 15px;
  font-family: 'Jost', sans-serif;
  font-size: .84rem;
  font-weight: 600;
  letter-spacing: .11em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .2s;
  min-height: 48px;
}
.sub-btn:hover    { background: var(--gold-dark); }
.sub-btn:disabled { background: rgba(201,162,39,.25); cursor: not-allowed; }

/* ─── CONFIRMATION PANEL ─────────────────────────────────────── */
.conf-panel { display: none; background: rgba(45,74,45,.18); border: 1px solid var(--moss); padding: 24px 28px; margin-top: 18px; color: var(--cream); }
.conf-panel.on  { display: block; }
.conf-panel h3  { font-family: 'Cormorant Garamond', serif; font-size: 1.4rem; font-weight: 300; color: #9ccd9c; margin-bottom: 14px; }
.conf-grid      { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-bottom: 18px; }
.conf-item small  { font-size: .63rem; letter-spacing: .09em; text-transform: uppercase; opacity: .42; display: block; }
.conf-item strong { font-size: .86rem; color: var(--cream); font-weight: 400; }
.conf-sec         { margin-bottom: 14px; padding-bottom: 14px; border-bottom: 1px solid rgba(245,240,232,.07); }
.conf-sec:last-child { border: none; margin-bottom: 0; padding-bottom: 0; }
.conf-sec h4      { font-size: .66rem; letter-spacing: .17em; text-transform: uppercase; color: var(--gold); margin-bottom: 7px; }
.conf-sec p,
.conf-sec li      { font-size: .8rem; color: rgba(245,240,232,.62); line-height: 1.7; }
.conf-sec ul      { padding-left: 15px; }
.iban { font-family: monospace; font-size: .88rem; color: var(--gold); letter-spacing: .05em; }

.bk-err    { display: none; background: rgba(180,55,55,.15); border: 1px solid #c55; color: #e8a0a0; padding: 11px 14px; font-size: .82rem; text-align: center; margin-top: 12px; }
.bk-err.on { display: block; }

/* ─── ADMIN APPROVAL POPUP ───────────────────────────────────── */
.adm { display: none; position: fixed; inset: 0; z-index: 2000; background: rgba(10,6,3,.97); align-items: center; justify-content: center; }
.adm.on { display: flex; }
.adm-box {
  background: var(--charcoal);
  border: 1px solid rgba(201,162,39,.26);
  padding: 38px;
  max-width: 480px;
  width: 92%;
  text-align: center;
  color: var(--cream);
}
.adm-box h2 { font-family: 'Cormorant Garamond', serif; font-size: 1.8rem; font-weight: 300; margin-bottom: 14px; }
.adm-box p  { color: rgba(245,240,232,.58); font-size: .84rem; line-height: 1.7; margin-bottom: 7px; }
.adm-btn {
  display: inline-block;
  margin-top: 18px;
  background: var(--gold);
  color: var(--charcoal);
  padding: 11px 26px;
  font-family: 'Jost', sans-serif;
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
  border: none;
  transition: background .2s;
}
.adm-btn:hover { background: var(--gold-dark); }
.adm-close {
  display: block;
  margin-top: 8px;
  background: none;
  border: 1px solid rgba(245,240,232,.16);
  color: rgba(245,240,232,.44);
  padding: 9px 22px;
  font-family: 'Jost', sans-serif;
  font-size: .76rem;
  letter-spacing: .09em;
  text-transform: uppercase;
  cursor: pointer;
  width: 100%;
}
