/**
 * Shared "state" components used across all phase-1 placeholder pages:
 * Book a Lesson, Group Lessons/Create Group/Group Lesson Details,
 * Cart/Checkout, Payout Methods, Exam Revision, Booking Confirmed.
 *
 * Previously this exact block was duplicated verbatim in six separate
 * CSS files. Consolidated here (2026-07-25) so a single design change
 * only needs to happen once. See inc/enqueue.php for how each page's
 * own stylesheet now depends on this file loading first.
 */

.tbp-dashboard-eyebrow {
	color: var(--tbp-color-gold-500);
	font-weight: 800;
	letter-spacing: .04em;
	margin: 0;
	text-transform: uppercase;
}

.tbp-dashboard-notice {
	background: var(--tbp-color-gold-100);
	border: 1px solid var(--tbp-color-gold-500);
	border-radius: var(--tbp-radius-md);
	color: #704f00;
	font-weight: 700;
	padding: 1rem 1.25rem;
}

.tbp-dashboard-gate {
	align-items: center;
	display: flex;
	flex-direction: column;
	min-height: 480px;
	justify-content: center;
	padding-block: 5rem;
	text-align: center;
}

.tbp-dashboard-gate__icon {
	display: inline-flex;
	color: var(--tbp-color-primary);
}
.tbp-dashboard-gate h1 { font-size: clamp(1.8rem, 5vw, 3rem); margin: 1rem 0; }
.tbp-dashboard-gate p { color: var(--tbp-color-text-muted); margin: 0 0 1.5rem; max-width: 580px; }

.tbp-dashboard-button {
	background: var(--tbp-color-primary);
	border-radius: var(--tbp-radius-md);
	color: #fff !important;
	display: inline-flex;
	font-weight: 800;
	padding: .8rem 1.2rem;
	text-decoration: none;
	transition: transform var(--tbp-transition-fast, .18s ease), background var(--tbp-transition-fast, .18s ease);
}
.tbp-dashboard-button:hover { background: var(--tbp-color-primary-hover); transform: translateY(-1px); }

html[data-theme="dark"] .tbp-dashboard-notice { background: #3c310d; color: #ffe89b; }

@media (max-width: 760px) {
	.tbp-dashboard-gate { min-height: 380px; }
}