/* =============================================================
   Booking calendar widget — styled with the site's own tokens
   (system.css must be loaded on the page). Everything is prefixed
   .bkg- so it can't collide with existing styles.
   ============================================================= */

.bkg-wrap{
  max-width:460px;
  margin-inline:auto;
  text-align:left;
  font-family:var(--sans);
  color:var(--ink-2);
}

.bkg-card{
  background:var(--surface,#fff);
  border:1px solid var(--line,rgba(201,168,76,.22));
  border-radius:var(--radius-card,12px);
  box-shadow:var(--shadow-card,0 14px 40px -22px rgba(80,60,20,.30));
  padding:clamp(1.1rem,4vw,1.6rem);
}

/* ---- loading ---- */
.bkg-loading{
  display:flex;align-items:center;justify-content:center;gap:.6rem;
  min-height:280px;color:var(--muted,#8C837F);font-size:.9rem;
}
.bkg-spinner{
  width:18px;height:18px;border-radius:50%;
  border:2px solid var(--line,rgba(201,168,76,.3));
  border-top-color:var(--gold,#C9A84C);
  animation:bkg-spin .8s linear infinite;
}
@keyframes bkg-spin{to{transform:rotate(360deg)}}

/* ---- month header ---- */
.bkg-head{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:1rem;
}
.bkg-month{
  font-family:var(--serif,'Playfair Display',serif);
  font-size:1.2rem;color:var(--ink,#1E1A18);font-weight:500;
  letter-spacing:-.01em;
}
.bkg-nav{
  display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:50%;
  background:transparent;border:1px solid var(--line,rgba(201,168,76,.3));
  color:var(--ink-2,#3D3532);cursor:pointer;
  transition:background .2s ease,border-color .2s ease,color .2s ease;
}
.bkg-nav:hover:not(:disabled){background:var(--gold-wash,rgba(201,168,76,.09));border-color:var(--gold,#C9A84C)}
.bkg-nav:disabled{opacity:.28;cursor:default}
.bkg-nav svg{width:16px;height:16px}

/* ---- day grid ---- */
.bkg-dows,.bkg-grid{
  display:grid;grid-template-columns:repeat(7,1fr);gap:4px;
}
.bkg-dows{margin-bottom:.35rem}
.bkg-dow{
  text-align:center;font-size:.62rem;font-weight:600;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted,#8C837F);padding:.2rem 0;
}
.bkg-day{
  aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;
  position:relative;border:1px solid transparent;border-radius:10px;
  background:transparent;font-family:var(--sans);font-size:.92rem;
  color:var(--muted,#8C837F);cursor:default;
  transition:background .15s ease,border-color .15s ease,color .15s ease;
}
.bkg-day.is-empty{visibility:hidden}
.bkg-day.is-available{
  color:var(--ink,#1E1A18);font-weight:500;cursor:pointer;
  background:transparent;
  border-color:var(--gold,#C9A84C);
}
.bkg-day.is-available:hover{
  background:var(--gold-wash,rgba(201,168,76,.12));
  border-color:var(--gold-dk,#A8873A);
}
.bkg-day.is-unavailable{color:var(--muted,#8C837F);opacity:.45}
.bkg-day.is-selected,
.bkg-day.is-selected:hover{
  background:var(--gold,#C9A84C);border-color:var(--gold,#C9A84C);
  color:var(--ink,#1E1A18);font-weight:600;
}

/* ---- time slots ---- */
.bkg-slots{margin-top:1.3rem;border-top:1px solid var(--line-soft,rgba(201,168,76,.14));padding-top:1.15rem}
.bkg-slots-h{
  font-family:var(--sans);font-size:.7rem;font-weight:600;letter-spacing:.09em;
  text-transform:uppercase;color:var(--ink-2,#3D3532);margin-bottom:.75rem;
}
.bkg-tznote{font-size:.72rem;color:var(--muted,#8C837F);margin:-.35rem 0 .85rem;line-height:1.45}
.bkg-chiprow{display:flex;flex-wrap:wrap;gap:.55rem}
.bkg-slot{
  font-family:var(--sans);font-size:.9rem;font-weight:500;
  padding:.6rem 1.05rem;border-radius:999px;
  border:1px solid var(--gold,#C9A84C);background:#fff;color:var(--ink,#1E1A18);
  cursor:pointer;transition:background .15s ease,color .15s ease,border-color .15s ease;
}
.bkg-slot:hover{background:var(--gold-wash,rgba(201,168,76,.12))}
.bkg-slot.is-selected{background:var(--gold,#C9A84C);border-color:var(--gold,#C9A84C);color:var(--ink,#1E1A18);font-weight:600}
.bkg-slot.is-unavailable{
  border-color:var(--line-soft,rgba(201,168,76,.14));
  color:var(--muted,#8C837F);background:transparent;cursor:default;opacity:.5;
}
/* dual time (visitor local + UK) */
.bkg-slot--dual{display:inline-flex;flex-direction:column;align-items:center;gap:1px;line-height:1.15;padding-top:.5rem;padding-bottom:.5rem}
.bkg-slot-main{font-weight:500}
.bkg-slot-sub{font-size:.66rem;font-weight:400;opacity:.72}
.bkg-slot--dual.is-selected .bkg-slot-sub{opacity:.9}
.bkg-uk-eq{color:var(--muted,#8C837F);font-size:.86rem}
.bkg-form-sel .bkg-uk-eq{display:inline-block;margin-top:.15rem}

/* ---- prompt / empty states ---- */
.bkg-prompt{margin-top:1.3rem;color:var(--muted,#8C837F);font-size:.88rem;text-align:center;padding:.4rem 0}

/* ---- form ---- */
.bkg-form{margin-top:1.35rem;border-top:1px solid var(--line-soft,rgba(201,168,76,.14));padding-top:1.2rem}
.bkg-form-sel{
  font-size:.92rem;color:var(--ink,#1E1A18);margin-bottom:1rem;
  background:var(--gold-tint,#FFFDF7);border:1px solid var(--line-soft,rgba(201,168,76,.14));
  border-radius:8px;padding:.7rem .9rem;line-height:1.5;
}
.bkg-form-sel strong{font-weight:600}
.bkg-field{margin-bottom:.85rem}
.bkg-label{
  display:block;font-size:.7rem;font-weight:600;letter-spacing:.07em;text-transform:uppercase;
  color:var(--ink-2,#3D3532);margin-bottom:.4rem;
}
.bkg-input{
  font-family:var(--sans);font-size:1rem;line-height:1.5;color:var(--ink,#1E1A18);
  background:var(--surface,#fff);border:1px solid var(--line,rgba(201,168,76,.22));
  border-radius:var(--radius,2px);padding:.8rem 1rem;width:100%;outline:none;
  transition:border-color .2s ease;
}
.bkg-input:focus{border-color:var(--gold,#C9A84C)}
.bkg-input::placeholder{color:var(--muted,#8C837F)}

.bkg-cta{
  display:flex;align-items:center;justify-content:center;gap:.5rem;
  width:fit-content;min-width:160px;margin:1.3rem auto 0;
  font-family:var(--sans);font-size:.7rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  line-height:1;padding:.95rem 2.6rem;
  border:1px solid var(--coral,#C97B6C);border-radius:999px;
  background:var(--coral,#C97B6C);color:#fff;cursor:pointer;
  transition:background .2s ease,border-color .2s ease,opacity .2s ease;
}
.bkg-cta:hover:not(:disabled){background:var(--coral-dk,#B06558);border-color:var(--coral-dk,#B06558)}
.bkg-cta:disabled{opacity:.6;cursor:default}

.bkg-msg{
  display:none;margin-top:.9rem;padding:.75rem .95rem;border-radius:var(--radius,2px);
  font-size:.85rem;line-height:1.55;
}
.bkg-msg.is-on{display:block}
.bkg-msg.is-err{background:#fbecec;color:#7a2b2b;border-left:3px solid #c47171}

.bkg-back{
  background:none;border:none;color:var(--gold-dk,#A8873A);font-family:var(--sans);
  font-size:.8rem;cursor:pointer;padding:.2rem 0;margin-top:.9rem;text-decoration:underline;
}
.bkg-back:hover{color:var(--gold-dk,#A8873A)}

.bkg-assure{
  display:flex;align-items:center;justify-content:center;gap:.45rem;
  margin-top:.9rem;color:var(--muted,#8C837F);font-size:.72rem;line-height:1.4;text-align:center;
}
.bkg-assure svg{flex:none;opacity:.7}