.bel0-booking {
  --bel0-border: #e3e8ef;
  --bel0-bg: #ffffff;
  --bel0-soft: #f6f8fb;
  --bel0-text: #101828;
  --bel0-muted: #667085;
  width: 100%;
  max-width: 940px;
  margin: 0 auto;
  border: 1px solid var(--bel0-border);
  border-radius: 20px;
  background: var(--bel0-bg);
  overflow: hidden;
  box-shadow: 0 16px 44px rgba(16,24,40,.10);
  color: var(--bel0-text);
}

.bel0-booking * { box-sizing: border-box; }

.bel0-booking__header {
  padding: 20px 24px;
  border-bottom: 1px solid var(--bel0-border);
  background: linear-gradient(180deg,#fff 0%,#fbfcfe 100%);
}

.bel0-booking__header strong {
  display: block;
  font-size: 20px;
  line-height: 1.25;
  letter-spacing: -.01em;
}

.bel0-booking__header span {
  display: block;
  margin-top: 4px;
  color: var(--bel0-muted);
  font-size: 13px;
}

.bel0-booking__messages {
  min-height: 205px;
  max-height: 380px;
  overflow-y: auto;
  padding: 22px 24px;
  background: var(--bel0-soft);
}

.bel0-msg {
  width: fit-content;
  max-width: 85%;
  margin: 0 0 12px;
  padding: 11px 14px;
  border-radius: 15px;
  line-height: 1.45;
  font-size: 15px;
}

.bel0-msg--bot {
  background: #fff;
  border: 1px solid var(--bel0-border);
  border-bottom-left-radius: 5px;
}

.bel0-msg--user {
  margin-left: auto;
  background: #111827;
  color: #fff;
  border-bottom-right-radius: 5px;
}

.bel0-booking__controls { padding: 22px 24px 10px; }
.bel0-step[hidden] { display: none !important; }
.bel0-booking [hidden] { display: none !important; }

.bel0-service-grid,
.bel0-times {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 10px;
}

.bel0-choice,
.bel0-btn {
  appearance: none;
  border: 1px solid #d0d5dd;
  border-radius: 12px;
  background: #fff;
  color: #101828;
  min-height: 46px;
  padding: 11px 14px;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  transition: transform .12s ease, box-shadow .12s ease, opacity .12s ease, border-color .12s ease;
}

.bel0-choice:hover,
.bel0-btn:hover {
  transform: translateY(-1px);
  border-color: #98a2b3;
  box-shadow: 0 6px 18px rgba(16,24,40,.09);
}

.bel0-btn { width: 100%; margin-top: 12px; }
.bel0-btn--primary { background: #111827; color: #fff; border-color: #111827; }
.bel0-btn:disabled { opacity: .6; cursor: wait; transform: none; }

.bel0-link-btn {
  appearance: none;
  border: 0;
  background: transparent;
  color: #344054;
  padding: 12px 0 4px;
  font: inherit;
  font-size: 13px;
  text-decoration: underline;
  cursor: pointer;
}

.bel0-label { display:block; margin:12px 0 6px; font-weight:700; font-size:14px; }
.bel0-label span { font-weight:400; color:var(--bel0-muted); }

.bel0-input {
  display:block;
  width:100%;
  min-height:46px;
  border:1px solid #d0d5dd;
  border-radius:10px;
  padding:10px 12px;
  background:#fff;
  color:#101828;
  font:inherit;
}
.bel0-input:focus { outline:2px solid #101828; outline-offset:1px; }

.bel0-summary { border:1px solid var(--bel0-border); border-radius:12px; overflow:hidden; }
.bel0-summary__row { display:flex; justify-content:space-between; gap:16px; padding:10px 12px; border-bottom:1px solid var(--bel0-border); font-size:14px; }
.bel0-summary__row:last-child { border-bottom:0; }
.bel0-summary__row span { text-align:right; }

.bel0-booking__status { min-height:22px; padding:2px 24px 18px; color:var(--bel0-muted); font-size:13px; }
.bel0-booking__status.is-error { color:#b42318; }
.bel0-booking__status.is-success { color:#067647; }

/* PROFESSIONAL PACKAGE LAYOUT */
.bel0-package-grid { display:block; }

.bel0-package-section {
  --accent:#175cd3;
  --accent-soft:#eff8ff;
  --accent-border:#b2ddff;
  margin:0 0 24px;
  padding:18px;
  border:1px solid var(--accent-border);
  border-radius:18px;
  background:linear-gradient(180deg,var(--accent-soft) 0%,#fff 30%);
}

.bel0-package-section--blue { --accent:#175cd3; --accent-soft:#eff8ff; --accent-border:#b2ddff; }
.bel0-package-section--gold { --accent:#b7791f; --accent-soft:#fffaf0; --accent-border:#f3d39b; }
.bel0-package-section--purple { --accent:#6941c6; --accent-soft:#f9f5ff; --accent-border:#d9d6fe; }
.bel0-package-section--green { --accent:#067647; --accent-soft:#ecfdf3; --accent-border:#abefc6; }
.bel0-package-section--orange { --accent:#c4320a; --accent-soft:#fff4ed; --accent-border:#f9dbaf; }

.bel0-package-section__heading {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  margin:0 0 16px;
  padding:0 2px;
}

.bel0-package-section__heading h3 {
  margin:0;
  color:var(--accent);
  font-size:20px;
  line-height:1.2;
  letter-spacing:-.01em;
}

.bel0-package-section__heading p {
  margin:5px 0 0;
  color:#475467;
  font-size:13px;
  line-height:1.45;
}

.bel0-package-section__pill {
  flex:0 0 auto;
  border:1px solid var(--accent-border);
  border-radius:9px;
  background:#fff;
  color:var(--accent);
  padding:7px 10px;
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
}

.bel0-package-section__grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}

.bel0-package-card {
  position:relative;
  appearance:none;
  width:100%;
  min-height:230px;
  border:1px solid #e4e7ec;
  border-radius:14px;
  background:#fff;
  color:#101828;
  padding:20px 15px 15px;
  text-align:center;
  font:inherit;
  cursor:pointer;
  box-shadow:0 4px 12px rgba(16,24,40,.05);
  transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}

.bel0-package-card:hover {
  transform:translateY(-2px);
  border-color:var(--accent-border);
  box-shadow:0 10px 24px rgba(16,24,40,.11);
}

.bel0-package-card__badge {
  display:inline-block;
  margin:-8px auto 13px;
  border-radius:999px;
  background:var(--accent);
  color:#fff;
  padding:5px 9px;
  font-size:10px;
  line-height:1;
  font-weight:800;
  letter-spacing:.03em;
  text-transform:uppercase;
}

.bel0-package-card strong {
  display:block;
  min-height:39px;
  font-size:15px;
  line-height:1.3;
}

.bel0-package-card__price {
  display:block;
  margin:10px 0 0;
  color:var(--accent);
  font-size:22px;
  line-height:1.1;
  font-weight:850;
}

.bel0-package-card small {
  display:block;
  min-height:58px;
  margin:10px 0 0;
  color:#667085;
  font-size:12px;
  line-height:1.45;
}

.bel0-package-card__select {
  display:block;
  margin-top:14px;
  border:1px solid var(--accent-border);
  border-radius:9px;
  background:#fff;
  color:var(--accent);
  padding:9px 10px;
  font-size:12px;
  font-weight:800;
}

.bel0-package-card:hover .bel0-package-card__select {
  background:var(--accent);
  border-color:var(--accent);
  color:#fff;
}

.bel0-payment-options { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.bel0-payment-card {
  appearance:none;
  width:100%;
  border:1px solid #d0d5dd;
  border-radius:14px;
  background:#fff;
  color:#101828;
  padding:16px;
  text-align:left;
  font:inherit;
  cursor:pointer;
  transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease;
}
.bel0-payment-card:hover { transform:translateY(-1px); border-color:#98a2b3; box-shadow:0 6px 18px rgba(16,24,40,.09); }
.bel0-payment-card strong { display:block; font-size:15px; line-height:1.3; }
.bel0-payment-card span { display:block; margin-top:5px; color:#667085; font-size:13px; line-height:1.4; }
.bel0-payment-card--featured { border-width:2px; border-color:#111827; }
.bel0-pay-link { display:block; text-align:center; text-decoration:none; }
.bel0-pay-note { margin:10px 0 0; color:#475467; font-size:13px; line-height:1.45; }

@media (max-width: 820px) {
  .bel0-package-section__grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width: 560px) {
  .bel0-booking { border-radius:14px; }
  .bel0-booking__header,
  .bel0-booking__messages,
  .bel0-booking__controls { padding-left:16px; padding-right:16px; }
  .bel0-service-grid,
  .bel0-times,
  .bel0-package-section__grid,
  .bel0-payment-options { grid-template-columns:1fr; }
  .bel0-booking__messages { min-height:190px; }
  .bel0-msg { max-width:92%; }
  .bel0-package-section { padding:14px; }
  .bel0-package-section__heading { align-items:center; }
  .bel0-package-section__heading h3 { font-size:18px; }
  .bel0-package-card { min-height:0; }
  .bel0-package-card strong,
  .bel0-package-card small { min-height:0; }
}
