.rbe-app {
	--rbe-primary: #0f172a;
	--rbe-accent: #b8860b;
	--rbe-bg: #fafafa;
	--rbe-border: #e5e7eb;
	--rbe-radius: 12px;
	--rbe-shadow: 0 4px 20px rgba(15, 23, 42, 0.08);
	font-family: -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	color: var(--rbe-primary);
	max-width: 960px;
	margin: 0 auto;
}

.rbe-app * { box-sizing: border-box; }

.rbe-progress {
	display: flex;
	justify-content: space-between;
	margin-bottom: 32px;
	gap: 4px;
}

.rbe-progress__step {
	flex: 1;
	text-align: center;
	font-size: 12px;
	color: #9ca3af;
	padding-bottom: 10px;
	border-bottom: 3px solid var(--rbe-border);
	transition: all 0.2s ease;
}

.rbe-progress__step.is-active,
.rbe-progress__step.is-complete {
	color: var(--rbe-primary);
	border-bottom-color: var(--rbe-accent);
	font-weight: 600;
}

.rbe-card {
	background: #fff;
	border: 1px solid var(--rbe-border);
	border-radius: var(--rbe-radius);
	box-shadow: var(--rbe-shadow);
	padding: 28px;
	margin-bottom: 20px;
}

.rbe-grid {
	display: grid;
	gap: 16px;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.rbe-option {
	border: 1px solid var(--rbe-border);
	border-radius: var(--rbe-radius);
	padding: 20px;
	cursor: pointer;
	transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
	background: #fff;
}

.rbe-option:hover {
	transform: translateY(-2px);
	box-shadow: var(--rbe-shadow);
}

.rbe-option.is-selected {
	border-color: var(--rbe-accent);
	box-shadow: 0 0 0 2px rgba(184, 134, 11, 0.25);
}

.rbe-option__title {
	font-weight: 600;
	font-size: 16px;
	margin: 8px 0 4px;
}

.rbe-option__desc {
	font-size: 13px;
	color: #6b7280;
	line-height: 1.5;
}

.rbe-option__price {
	margin-top: 12px;
	font-weight: 700;
	color: var(--rbe-accent);
}

.rbe-field {
	margin-bottom: 16px;
}

.rbe-field label {
	display: block;
	font-size: 13px;
	font-weight: 600;
	margin-bottom: 6px;
	color: #374151;
}

.rbe-field input,
.rbe-field select,
.rbe-field textarea {
	width: 100%;
	padding: 11px 14px;
	border: 1px solid var(--rbe-border);
	border-radius: 8px;
	font-size: 14px;
	background: var(--rbe-bg);
}

.rbe-field input:focus,
.rbe-field select:focus,
.rbe-field textarea:focus {
	outline: none;
	border-color: var(--rbe-accent);
	background: #fff;
}

.rbe-row {
	display: grid;
	gap: 16px;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

.rbe-stop {
	display: flex;
	gap: 8px;
	margin-bottom: 8px;
}

.rbe-stop input { flex: 1; }
.rbe-stop > div { flex: 1; }

.rbe-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 22px;
	border-radius: 999px;
	font-weight: 600;
	font-size: 14px;
	border: none;
	cursor: pointer;
	transition: opacity 0.15s ease;
}

.rbe-btn:hover { opacity: 0.9; }
.rbe-btn:disabled { opacity: 0.5; cursor: not-allowed; }

.rbe-btn--primary { background: var(--rbe-primary); color: #fff; }
.rbe-btn--accent { background: var(--rbe-accent); color: #fff; }
.rbe-btn--ghost { background: transparent; color: var(--rbe-primary); border: 1px solid var(--rbe-border); }
.rbe-btn--danger { background: #fff; color: #b91c1c; border: 1px solid #fecaca; }

a.rbe-btn { text-decoration: none; }

.rbe-actions {
	display: flex;
	justify-content: space-between;
	margin-top: 24px;
}

.rbe-summary-line {
	display: flex;
	justify-content: space-between;
	padding: 8px 0;
	border-bottom: 1px solid var(--rbe-border);
	font-size: 14px;
}

.rbe-summary-line--total {
	font-weight: 700;
	font-size: 18px;
	border-bottom: none;
	margin-top: 8px;
}

.rbe-alert {
	padding: 14px 16px;
	border-radius: 8px;
	font-size: 13px;
	margin-bottom: 16px;
}

.rbe-alert--error { background: #fef2f2; color: #b91c1c; border: 1px solid #fecaca; }
.rbe-alert--success { background: #f0fdf4; color: #166534; border: 1px solid #bbf7d0; }
.rbe-alert--info { background: #f8fafc; color: #334155; border: 1px solid var(--rbe-border); }
.rbe-alert--warning { background: #fffbeb; color: #92400e; border: 1px solid #fde68a; }

.rbe-skeleton {
	height: 16px;
	border-radius: 6px;
	background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 37%, #f1f5f9 63%);
	background-size: 400% 100%;
	animation: rbe-shimmer 1.4s ease infinite;
}

@keyframes rbe-shimmer {
	0% { background-position: 100% 50%; }
	100% { background-position: 0 50%; }
}

@media (max-width: 640px) {
	.rbe-progress__step span { display: none; }
	.rbe-card { padding: 18px; }
}

/* Quick Quote: mobile-first single-page form. Always one column, larger
   tap targets, and a full-width sticky submit button - this form has no
   wizard steps to fall back on, so the layout must work on a phone first. */
.rbe-app--quick {
	max-width: 480px;
}

.rbe-quick-quote__mode {
	display: flex;
	gap: 8px;
	margin-bottom: 20px;
	background: var(--rbe-bg);
	border-radius: 999px;
	padding: 4px;
}

.rbe-quick-quote__mode-btn {
	flex: 1;
	padding: 12px 10px;
	border: none;
	border-radius: 999px;
	background: transparent;
	font-weight: 600;
	font-size: 14px;
	cursor: pointer;
	color: #6b7280;
	transition: all 0.15s ease;
}

.rbe-quick-quote__mode-btn.is-active {
	background: var(--rbe-primary);
	color: #fff;
}

.rbe-quick-quote__sub {
	color: #6b7280;
	font-size: 14px;
	margin: -8px 0 20px;
}

.rbe-quick-quote .rbe-field input,
.rbe-quick-quote .rbe-field select,
.rbe-quick-quote .rbe-field textarea {
	font-size: 16px;
	padding: 14px 16px;
	min-height: 48px;
}

.rbe-quick-quote__submit {
	width: 100%;
	min-height: 52px;
	font-size: 16px;
	margin-top: 8px;
}

@media (max-width: 480px) {
	.rbe-app--quick {
		max-width: 100%;
	}

	.rbe-quick-quote {
		padding: 20px 16px;
		border-radius: 0;
		box-shadow: none;
		border-left: none;
		border-right: none;
	}

	.rbe-quick-quote__submit {
		position: sticky;
		bottom: 12px;
		box-shadow: 0 6px 20px rgba(15, 23, 42, 0.25);
	}
}

.rbe-autocomplete-list {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 20;
	background: #fff;
	border: 1px solid var(--rbe-border);
	border-radius: 0 0 8px 8px;
	box-shadow: var(--rbe-shadow);
	max-height: 220px;
	overflow-y: auto;
}

.rbe-autocomplete-item {
	padding: 10px 12px;
	font-size: 14px;
	cursor: pointer;
	border-bottom: 1px solid var(--rbe-border);
}

.rbe-autocomplete-item:last-child {
	border-bottom: none;
}

.rbe-autocomplete-item:hover {
	background: var(--rbe-bg);
}

.rbe-auth-tabs,
.rbe-account-nav {
	display: flex;
	gap: 8px;
	margin-bottom: 20px;
	flex-wrap: wrap;
}

.rbe-auth-tabs button,
.rbe-account-nav button {
	padding: 10px 18px;
	border-radius: 999px;
	border: 1px solid var(--rbe-border);
	background: #fff;
	font-weight: 600;
	font-size: 13px;
	cursor: pointer;
	color: #6b7280;
}

.rbe-auth-tabs button.is-active,
.rbe-account-nav button.is-active {
	background: var(--rbe-primary);
	color: #fff;
	border-color: var(--rbe-primary);
}

.rbe-badge {
	display: inline-block;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	background: #f1f5f9;
	color: #475569;
	text-transform: capitalize;
}

.rbe-badge--confirmed,
.rbe-badge--completed { background: #f0fdf4; color: #166534; }
.rbe-badge--pending,
.rbe-badge--quote_requested { background: #fffbeb; color: #92400e; }
.rbe-badge--cancelled,
.rbe-badge--no_show { background: #fef2f2; color: #b91c1c; }

.rbe-cancellation-policy {
	max-width: 720px;
	line-height: 1.7;
	color: var(--rbe-primary);
}

.rbe-receipt-toolbar {
	display: flex;
	justify-content: flex-end;
	margin-bottom: 16px;
}

.rbe-receipt {
	max-width: 640px;
	margin: 0 auto;
}

.rbe-receipt__header {
	border-bottom: 2px solid var(--rbe-primary);
	padding-bottom: 14px;
	margin-bottom: 18px;
}

.rbe-receipt__section p {
	margin: 4px 0;
	font-size: 14px;
}

.rbe-receipt__table {
	width: 100%;
	border-collapse: collapse;
	margin-top: 18px;
}

.rbe-receipt__table td {
	padding: 8px 0;
	border-bottom: 1px solid var(--rbe-border);
	font-size: 14px;
}

.rbe-receipt__table td:last-child {
	text-align: right;
}

.rbe-receipt__total td {
	font-weight: 700;
	font-size: 17px;
	border-bottom: none;
	border-top: 2px solid var(--rbe-primary);
}

@media print {
	.rbe-receipt-toolbar {
		display: none;
	}

	.rbe-card.rbe-receipt {
		box-shadow: none;
		border: none;
	}
}
