/**
 * I150 — Multi-service cart chrome (generic PUBLIC BOOKING).
 * Same CSS for production and demo. No demo-only styles.
 */
.booking-cart-host,
.booking-service-cart,
.bsc-shell {
  width: 100%;
  max-width: 720px;
  margin: 0 auto;
  box-sizing: border-box;
}

.bsc-shell { display: grid; gap: 14px; }

.bsc-head { display: grid; gap: 4px; }
.bsc-title {
  margin: 0;
  font-size: 18px;
  font-weight: 900;
  color: var(--accent, #0f6b5c);
  line-height: 1.4;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line, #cfd9e0);
}
.bsc-lead {
  margin: 0;
  font-size: 14px;
  color: var(--ink-muted, #5a6b78);
  line-height: 1.55;
}

.bsc-lines { display: grid; gap: 12px; }

.bsc-line {
  border: 1px solid var(--line, #cfd9e0);
  border-radius: 12px;
  background: #fff;
  padding: 14px;
  display: grid;
  gap: 12px;
}

.bsc-line-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.bsc-line-name {
  margin: 0;
  font-size: 16px;
  font-weight: 800;
  color: var(--ink, #1a2836);
  line-height: 1.35;
}
.bsc-remove {
  border: 0;
  background: transparent;
  color: var(--ink-muted, #5a6b78);
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  text-decoration: underline;
  cursor: pointer;
  min-height: 40px;
  padding: 4px 6px;
}

.bsc-qty {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.bsc-qty-label {
  font-size: 13px;
  font-weight: 700;
  color: var(--accent, #0f6b5c);
}
.bsc-qty-ctrl {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.bsc-qty-btn {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  border: 1px solid var(--line, #cfd9e0);
  background: #fff;
  font: inherit;
  font-size: 18px;
  font-weight: 700;
  cursor: pointer;
  color: var(--accent, #0f6b5c);
}
.bsc-qty-val {
  min-width: 2rem;
  text-align: center;
  font-weight: 800;
  font-size: 16px;
}

.bsc-options { display: grid; gap: 8px; }
.bsc-opt-label {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  color: var(--accent, #0f6b5c);
}
.bsc-opt {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--line, #cfd9e0);
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
  min-height: 48px;
}
.bsc-opt.is-on {
  border-color: var(--accent, #0f6b5c);
  background: var(--accent-soft, #e8f5f1);
}
.bsc-opt input { width: auto; margin-top: 3px; flex: 0 0 auto; }
.bsc-opt-copy { display: grid; gap: 2px; }
.bsc-opt-copy strong { font-size: 14px; }
.bsc-opt-copy em {
  font-style: normal;
  font-size: 12px;
  color: var(--ink-muted, #5a6b78);
}
.bsc-opt-empty {
  margin: 0;
  font-size: 13px;
  color: var(--ink-muted, #5a6b78);
}

.bsc-line-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  font-size: 13px;
  color: var(--ink-muted, #5a6b78);
}

.bsc-catalog {
  display: grid;
  gap: 8px;
}
.bsc-catalog-label {
  margin: 0;
  font-size: 13px;
  font-weight: 700;
  color: var(--accent, #0f6b5c);
}
.bsc-catalog-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  text-align: left;
  padding: 14px 16px;
  border: 1px dashed var(--line, #cfd9e0);
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  font: inherit;
  min-height: 52px;
}
.bsc-catalog-item:hover {
  border-color: var(--accent, #0f6b5c);
  background: var(--accent-soft, #e8f5f1);
}
.bsc-catalog-copy { display: grid; gap: 2px; }
.bsc-catalog-copy strong { font-size: 15px; color: var(--ink, #1a2836); }
.bsc-catalog-copy em {
  font-style: normal;
  font-size: 12px;
  color: var(--ink-muted, #5a6b78);
}
.bsc-catalog-mark {
  font-size: 20px;
  font-weight: 700;
  color: var(--accent, #0f6b5c);
}

.bsc-live {
  border: 1px solid var(--line, #cfd9e0);
  border-radius: 12px;
  background: var(--accent-soft, #e8f5f1);
  padding: 12px 14px;
}
.bsc-live-title {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 800;
  color: var(--accent, #0f6b5c);
}
.bsc-live-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}
.bsc-live-row {
  display: grid;
  gap: 2px;
  font-size: 14px;
}
.bsc-live-name { font-weight: 700; }
.bsc-live-opts { font-size: 12px; color: var(--ink-muted, #5a6b78); }
.bsc-live-amt { font-size: 13px; }
.bsc-live-travel,
.bsc-live-total { margin: 8px 0 0; font-size: 14px; }
.bsc-live-empty { margin: 0; font-size: 13px; color: var(--ink-muted, #5a6b78); }

.bsc-nav.sq-nav {
  display: flex;
  gap: 0.55rem;
  margin-top: 0.25rem;
}
.bsc-nav .sq-nav-btn {
  flex: 1;
  min-width: 7rem;
  min-height: 48px;
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  border-radius: var(--radius-btn, 10px);
  cursor: pointer;
}
.bsc-nav .sq-nav-back {
  background: #fff;
  border: 1px solid var(--accent, #0f6b5c);
  color: var(--accent, #0f6b5c);
}
.bsc-nav .sq-nav-primary {
  background: var(--accent, #0f6b5c);
  border: 1px solid var(--accent, #0f6b5c);
  color: #fff;
}
.bsc-nav .sq-nav-primary:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

@media (max-width: 420px) {
  .bsc-catalog-item { padding: 12px 14px; }
  .bsc-qty-btn { width: 48px; height: 48px; }
}