#appointment-widget { max-width: 520px; margin: 0 auto; }
#dates-container { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 5px; }
#dates-container > div { flex: 0 0 auto; width: auto; min-width: 65px; }

.date-btn {
  min-width: 60px;
  padding: 8px 4px;
  border: 2px solid #e5e5e5;
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s ease;
  text-align: center;
}

.date-btn:hover:not(.date-btn-disabled) {
  border-color: #1e87f0;
  background: #f8f8f8;
}

.date-btn.date-btn-active {
  border-color: #1e87f0;
  background: #1e87f0;
  color: #fff;
}

.date-btn.date-btn-disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.date-btn.date-btn-has-slots { border-color: #32d296; }
.date-btn .date-day { font-size: 18px; font-weight: 800; line-height: 1.2; }
.date-btn .date-weekday { font-size: 11px; text-transform: uppercase; opacity: 0.75; font-weight: 700; }
.date-btn .date-month { font-size: 10px; opacity: 0.7; }

.time-slot-btn {
  padding: 12px 8px;
  border: 2px solid #e5e5e5;
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s ease;
  font-size: 15px;
  font-weight: 700;
}

.time-slot-btn:hover {
  border-color: #1e87f0;
  background: #f0f7ff;
}

.time-slot-btn.time-slot-active {
  border-color: #1e87f0;
  background: #1e87f0;
  color: #fff;
}

@media (max-width: 640px) {
  .date-btn { min-width: 55px; padding: 6px 3px; }
  .date-btn .date-day { font-size: 16px; }
}

#booking-section { margin-top: 14px; }

.booking-selected-box {
  background: linear-gradient(180deg, #f3f8ff 0%, #eef6ff 100%) !important;
  border: 1px solid rgba(30,135,240,.22) !important;
  color: #111 !important;
  padding: 12px 14px;
}

.booking-selected-row { display:flex; gap:10px; align-items:flex-start; }
.booking-selected-label { flex:0 0 auto; white-space:nowrap; color:#0f5fb6; }
.booking-selected-value { flex:1 1 auto; min-width:0; }

#selected-datetime {
  display:inline-flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:baseline;
  line-height:1.25;
}

.sel-weekday { color:rgba(17,17,17,.70); font-weight:700; text-transform:capitalize; }
.sel-date { color:#0f5fb6; font-weight:900; }

.sel-time {
  display:inline-block;
  padding:2px 10px;
  border-radius:999px;
  background:rgba(50,210,150,.14);
  border:1px solid rgba(50,210,150,.25);
  color:#167b52;
  font-weight:900;
  letter-spacing:.2px;
  white-space:nowrap;
}

.booking-cta {
  background:#0f5fb6 !important;
  border:2px solid #0b4a8b !important;
  color:#fff !important;
  box-shadow:0 10px 18px rgba(15,95,182,.25);
  letter-spacing:.2px;
}

.booking-cta:hover,
.booking-cta:focus {
  background:#0b4a8b !important;
  border-color:#083a6e !important;
  box-shadow:0 12px 22px rgba(15,95,182,.32);
}

.booking-cta:active { transform:translateY(1px); }

#schedule-form .schedule-modal {
  background:#f5f5f5 !important;
  border-radius:25px;
  box-shadow:0 25px 70px rgba(0,0,0,.22);
}

#schedule-form .schedule-picked {
  background:#eef6ff !important;
  color:#111 !important;
  border:1px solid rgba(30,135,240,.18) !important;
}

.uk-modal-page { overflow:hidden; }

#schedule-form.uk-open {
  background:rgba(10,16,24,0.45);
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
}

#schedule-form.uk-open:before {
  content:'';
  position:fixed;
  inset:0;
  background:rgba(10,16,24,0.45);
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
  pointer-events:none;
}

#schedule-form .rf-slot-line {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:baseline;
  line-height:1.25;
}

#schedule-form .rf-slot-weekday { color:rgba(17,17,17,.70); font-weight:700; text-transform:capitalize; }
#schedule-form .rf-slot-date { color:#111; font-weight:900; }

#schedule-form .rf-slot-time {
  display:inline-block;
  padding:2px 10px;
  border-radius:999px;
  background:rgba(30,135,240,.12);
  border:1px solid rgba(30,135,240,.20);
  color:#0f5fb6;
  font-weight:900;
  letter-spacing:.2px;
  white-space:nowrap;
}

#schedule-form .rf-consent { cursor:pointer; }
#schedule-form .rf-consent-text { line-height:1.35; }

#schedule-form .rf-consent-invalid .uk-checkbox {
  box-shadow:0 0 0 3px rgba(240,80,110,.35);
  border-radius:4px;
}
