.cb-booking-app {
	max-width: 880px;
	margin: 0 auto;
	background: #fff;
	border-radius: 14px;
	box-shadow: 0 4px 24px rgba(0,0,0,.08);
	padding: 28px 32px;
	font-family: inherit;
	color: #1c1c28;
}
.cb-heading { margin: 0 0 12px; font-size: 18px; font-weight:700; text-align:center; }
.cb-sub { color:#777; margin-top:-8px; margin-bottom:16px; text-align:center; }

/* Two-column calendar + time-slot layout */
.cb-calendar-columns {
	display: grid;
	grid-template-columns: 1.3fr 1fr;
	gap: 32px;
	align-items: start;
}
@media (max-width: 640px) {
	.cb-calendar-columns { grid-template-columns: 1fr; }
}
.cb-calendar-columns.cb-layout-vertical {
	grid-template-columns: 1fr;
}
.cb-calendar-columns.cb-layout-vertical .cb-slots-wrap {
	margin-top: 24px;
}

/* Calendar */
.cb-calendar-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.cb-calendar-head button {
	width: 32px; height: 32px; border-radius: 50%;
	background: #4c1d95; color: #fff; border: none; cursor: pointer;
	font-size: 16px; line-height: 1; display:flex; align-items:center; justify-content:center;
}
.cb-calendar-title { font-weight:700; }
.cb-calendar-grid { display:grid; grid-template-columns: repeat(7, 1fr); gap:6px; text-align:center; }
.cb-calendar-grid .cb-dow { font-size:12px; color:#888; padding-bottom:6px; font-weight:600; }
.cb-day {
	position: relative;
	padding:10px 0 14px; border-radius:8px; cursor:default; color:#c9c9d3; font-size:14px;
	border: 1px solid transparent;
}
.cb-day.cb-available { color:#1c1c28; cursor:pointer; border-color:#e2e2e8; font-weight:600; }
.cb-day.cb-available:hover { border-color:#4c1d95; }
.cb-day.cb-selected { background:#f5a623; color:#fff; border-color:#f5a623; }
.cb-day.cb-selected .cb-avail-dot { background:#fff; }
.cb-avail-dot {
	position:absolute; bottom:5px; left:50%; transform:translateX(-50%);
	width:5px; height:5px; border-radius:50%; background:#22c55e;
}

/* Slots */
.cb-slots-wrap { display:flex; flex-direction:column; }
.cb-slot-placeholder { color:#888; font-size:18px; line-height:1.5; margin:0; text-align:left; grid-column: 1 / -1; }
.cb-slots {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
	gap: 10px;
}
.cb-slot {
	display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
	border:1px solid #d8d8e0; border-radius:10px; padding:16px 10px; cursor:pointer;
	text-align:center; background:#fff;
}
.cb-slot:hover { border-color:#f5a623; }
.cb-slot.cb-slot-selected { border-color:#f5a623; background:#fff8ec; }
.cb-slot.cb-slot-full { opacity:.5; cursor:not-allowed; }
.cb-slot.cb-slot-closed .cb-slot-seats { color:#a3221c; }
.cb-slot-time { font-weight:700; font-size:16px; }
.cb-slot-seats { font-size:13px; }

/* Details / agenda panel — sits under the time-slot column once a slot is picked */
.cb-agenda-panel {
	margin-top: 16px;
	border: 1px solid #e2e2e8;
	border-radius: 12px;
	padding: 16px 18px;
	text-align: left;
}
.cb-agenda-heading { margin: 0 0 10px; font-size: 16px; font-weight: 700; text-align: left; }
.cb-agenda-body p { display: block !important; margin: 0 0 8px !important; line-height: 1.5 !important; white-space: pre-wrap; }
.cb-agenda-body p:last-child { margin-bottom: 0 !important; color: #666; }
.cb-agenda-body br { display: block !important; content: ""; margin-top: 8px; }
.cb-agenda-body strong { font-weight: 700; margin-right: 4px; }

/* Bottom bar (course name + primary action) */
.cb-bottom-bar {
	display:flex; align-items:center; justify-content:space-between;
	margin-top:24px; padding-top:20px; border-top:1px solid #f0f0f0;
}
.cb-course-label { font-size:18px; color:#555; display:flex; align-items:center; gap:8px; }
.cb-course-label strong { color:#1c1c28; }
.cb-course-dot { width:8px; height:8px; border-radius:50%; background:#4c6ef5; flex-shrink:0; }

/* Form */
.cb-form-field { margin-bottom: 14px; }
.cb-form-field label { display:block; font-weight:600; font-size:13px; margin-bottom:4px; }
.cb-form-field .required { color:#e0433b; }
.cb-form-field input[type=text],
.cb-form-field input[type=email],
.cb-form-field input[type=tel],
.cb-form-field input[type=date],
.cb-form-field select,
.cb-form-field textarea {
	width:100%; padding:9px 10px; border:1px solid #ddd; border-radius:6px; font-size:14px; box-sizing:border-box;
}
.cb-form-field .cb-radio-group label, .cb-form-field .cb-checkbox-row label { font-weight:400; display:inline-flex; align-items:center; gap:6px; margin-right:14px; }
.cb-field-error { color:#e0433b; font-size:12px; margin-top:4px; }

/* Summary */
.cb-summary-box { border:1px solid #eee; border-radius:8px; padding:14px; margin-bottom:16px; }
.cb-summary-row { display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px solid #f2f2f2; }
.cb-summary-row:last-child { border-bottom:none; }
.cb-summary-total strong { color:#f5a623; font-size:18px; }

.cb-payment-methods { display:flex; flex-direction:column; gap:8px; margin-bottom: 16px; }
.cb-payment-method-option { border:1px solid #ddd; border-radius:8px; padding:12px; cursor:pointer; }
.cb-payment-method-option.cb-selected { border-color:#f5a623; background:#fff8ec; }

/* Buttons */
.cb-actions { display:flex; justify-content:space-between; align-items:center; margin-top:18px; }
.cb-btn { padding:11px 22px; border-radius:24px; border:none; cursor:pointer; font-weight:700; font-size:14px; }
.cb-btn-primary { background:#f5a623; color:#1c1c28; }
.cb-btn-primary:disabled { opacity:.5; cursor:not-allowed; }
.cb-btn-link { background:none; color:#555; padding-left:0; }

.cb-loading { text-align:center; padding:40px 0; font-weight:600; color:#888; }

.cb-loader {
	display:flex; align-items:center; justify-content:center; gap:10px;
	padding:32px 0; color:#888; font-size:14px; font-weight:500;
}
.cb-card-loader {
	display:flex; align-items:center; justify-content:center; gap:10px;
	padding:90px 0; color:#888; font-size:14px; font-weight:500;
}
.cb-spinner {
	width:18px; height:18px; border-radius:50%;
	border:2px solid #eee; border-top-color:#f5a623;
	animation: cb-spin 0.7s linear infinite;
	display:inline-block; flex-shrink:0;
}
@keyframes cb-spin { to { transform: rotate(360deg); } }

.cb-message { padding: 24px; text-align:center; }
.cb-message h3 { margin-top:0; }
.cb-message.cb-success { color:#0a7a35; }
.cb-message.cb-error { color:#a3221c; }
.cb-message .cb-btn { margin-top:12px; display:inline-block; text-decoration:none; }

.cb-inline-error { color:#e0433b; padding:10px; border:1px solid #f5c2c0; background:#fdf1f0; border-radius:6px; margin-bottom:12px; }
