/* ============================================
   Fluent Booking override — match theme styles
   ============================================ */

/* 1. CSS variables — remap FB colors to theme */
:root {
	--fcal_primary_color: var(--wv3-primary) !important;
	--fcal_primaryColor: var(--wv3-primary) !important;
}

/* 2. Typography */
.fcal_wrap,
.fcal_teams,
.fcal_calendar_wrapper {
	font-family: var(--wv3-font-body) !important;
}

.fcal_author_header h1,
.fcal_person_name,
.fcal_slot h2,
.fcal_wrap .fcal_host_name,
.fcal_wrap .fcal_event_title {
	font-family: var(--wv3-font-heading) !important;
	font-weight: var(--wv3-font-weight-heading, 600) !important;
}

/* 3. Active date in calendar */
.fcal_wrap .fcal_date.fcal_date_active,
.fcal_wrap .fcal_date:hover {
	background: var(--wv3-primary) !important;
	color: #fff !important;
}

/* 4. Time slot selection */
.fcal_wrap .fcal_time.fcal_time_active,
.fcal_wrap .fcal_time:hover {
	border-color: var(--wv3-primary) !important;
	color: var(--wv3-primary) !important;
}

/* 5. Submit / confirm buttons */
.fcal_wrap .fcal_submit_btn,
.fcal_wrap .fcal_confirm_btn {
	background: var(--wv3-primary) !important;
	color: #fff !important;
	border: none !important;
	border-radius: var(--wv3-radius-md) !important;
	font-family: var(--wv3-font-body) !important;
	font-weight: 600 !important;
}

.fcal_wrap .fcal_submit_btn:hover,
.fcal_wrap .fcal_confirm_btn:hover {
	opacity: 0.9 !important;
}

/* 6. Slot buttons — disable hover animations */
.fcal_slot button {
	transition: none !important;
}

.fcal_slot button:hover {
	border-color: var(--wv3-primary) !important;
	color: var(--wv3-primary) !important;
	padding-right: 16px !important;
}

.fcal_slot button svg {
	display: none !important;
}

.fcal_slot:hover {
	background: var(--fcal_cal_bg) !important;
}

.fcal_slot {
	transition: none !important;
}

/* 7. Team member cards — no hover animation */
.fcal_each_member {
	transition: none !important;
}

.fcal_each_member:hover {
	background: var(--fcal_cal_bg) !important;
}

/* 8. Back button */
.fcal_back_btn_team {
	color: var(--wv3-primary) !important;
}

.fcal_back_btn_team:hover {
	opacity: 0.8 !important;
}

/* 9. Spinner */
.fcal-inline-spinner {
	border-color: rgba(0, 0, 0, 0.1) !important;
	border-top-color: var(--wv3-primary) !important;
}

/* 10. Form fields */
.fcal_wrap .fcal_input input,
.fcal_wrap .fcal_input textarea,
.fcal_wrap .fcal_input select {
	border: 2px solid var(--wv3-border, #e2e8f0);
	border-radius: var(--wv3-radius-md);
	font-family: var(--wv3-font-body);
}

.fcal_wrap .fcal_input input:focus,
.fcal_wrap .fcal_input textarea:focus,
.fcal_wrap .fcal_input select:focus {
	border-color: var(--wv3-primary);
	box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.08);
	outline: none;
}

/* 11. Avatars */
.fcal_author_header img {
	border-radius: var(--wv3-radius-md);
	width: 96px;
	height: 96px;
	object-fit: cover;
}

.fcal_each_member .fcal_person_avatar img {
	border-radius: 50%;
	width: 44px;
	height: 44px;
	object-fit: cover;
}

/* ============================================
   Template-specific overrides
   ============================================ */

/* FLOW — pill buttons */
.template-flow .fcal_wrap .fcal_submit_btn,
.template-flow .fcal_wrap .fcal_confirm_btn {
	border-radius: 9999px !important;
}

/* STARTER — pill buttons */
.template-starter .fcal_wrap .fcal_submit_btn,
.template-starter .fcal_wrap .fcal_confirm_btn {
	border-radius: 9999px !important;
}

/* MINIMAL — rounded buttons */
.template-minimal .fcal_wrap .fcal_submit_btn,
.template-minimal .fcal_wrap .fcal_confirm_btn {
	border-radius: 10px !important;
}

/* CLASSIC — sharp buttons */
.template-classic .fcal_wrap .fcal_submit_btn,
.template-classic .fcal_wrap .fcal_confirm_btn {
	border-radius: 0 !important;
}

.template-classic .fcal_author_header img {
	border-radius: 0;
}

.template-classic .fcal_wrap .fcal_input input,
.template-classic .fcal_wrap .fcal_input textarea,
.template-classic .fcal_wrap .fcal_input select {
	border-radius: 0;
}