/**
 * TutorHelper Pro student booking branding.
 *
 * Applies shared Pro branding settings to the Core booking form
 * without changing semantic availability, warning, error or
 * Booking Type colours.
 */


/* ==========================================================
 * Main booking container
 * ========================================================== */

.tutorhelper-student-booking {
	background:
		var(
			--tutorhelper-brand-form-background,
			#ffffff
		);

	color:
		var(
			--tutorhelper-brand-text,
			#1d2327
		);

	font-family:
		var(
			--tutorhelper-brand-text-font,
			Arial,
			Helvetica,
			sans-serif
		);

	border-color:
		var(
			--tutorhelper-brand-primary,
			#143f4d
		);
}


/*
 * Existing decorative circle.
 */
.tutorhelper-student-booking::before {
	background:
		color-mix(
			in srgb,
			var(
				--tutorhelper-brand-accent,
				#f46b3b
			)
			28%,
			transparent
		);
}


/* ==========================================================
 * Typography
 * ========================================================== */

.tutorhelper-student-booking__heading,
.tutorhelper-student-booking__panel-heading,
.tutorhelper-student-booking__summary-heading,
.tutorhelper-student-booking__policy h4 {
	color:
		var(
			--tutorhelper-brand-heading,
			#143f4d
		);

	font-family:
		var(
			--tutorhelper-brand-heading-font,
			Arial,
			Helvetica,
			sans-serif
		);
}


.tutorhelper-student-booking__introduction,
.tutorhelper-student-booking__summary,
.tutorhelper-student-booking__policy,
.tutorhelper-student-booking__service {
	font-family:
		var(
			--tutorhelper-brand-text-font,
			Arial,
			Helvetica,
			sans-serif
		);
}


.tutorhelper-student-booking__introduction {
	color:
		var(
			--tutorhelper-brand-text,
			#1d2327
		);
}


/* ==========================================================
 * Panels
 * ========================================================== */

.tutorhelper-student-booking__panel,
.tutorhelper-student-booking__summary {
	background:
		var(
			--tutorhelper-brand-form-box,
			#ffffff
		);

	color:
		var(
			--tutorhelper-brand-text,
			#1d2327
		);
}


/* ==========================================================
 * Required field marker
 * ========================================================== */

.tutorhelper-student-booking__required {
	color:
		var(
			--tutorhelper-brand-accent,
			#f46b3b
		);
}


/* ==========================================================
 * Calendar chrome
 * ========================================================== */

.tutorhelper-student-booking__calendar-header {
	border-color:
		color-mix(
			in srgb,
			var(
				--tutorhelper-brand-primary,
				#143f4d
			)
			20%,
			#ffffff
		);

	background:
		var(
			--tutorhelper-brand-calendar,
			#f8eee8
		);
}


.tutorhelper-student-booking__calendar-header strong {
	color:
		var(
			--tutorhelper-brand-heading,
			#143f4d
		);

	font-family:
		var(
			--tutorhelper-brand-heading-font,
			Arial,
			Helvetica,
			sans-serif
		);
}


.tutorhelper-student-booking__calendar-header button {
	border-color:
		color-mix(
			in srgb,
			var(
				--tutorhelper-brand-primary,
				#143f4d
			)
			28%,
			#ffffff
		);

	color:
		var(
			--tutorhelper-brand-primary,
			#143f4d
		);
}


/* Keep the green available-day state from Core intact. */

.tutorhelper-student-booking__calendar-day {
	background:
		var(
			--tutorhelper-brand-calendar,
			#f8eee8
		);
}

/*
 * Today uses the configured accent colour.
 */
.tutorhelper-student-booking__calendar-day.is-today {
	border-color:
		var(
			--tutorhelper-brand-accent,
			#f46b3b
		);

	box-shadow:
		inset 0 0 0 1px
		var(
			--tutorhelper-brand-accent,
			#f46b3b
		);
}


/*
 * Selected date uses the primary brand colour.
 */
.tutorhelper-student-booking__calendar-day.is-selected {
	border-color:
		var(
			--tutorhelper-brand-primary,
			#143f4d
		);

	background:
		var(
			--tutorhelper-brand-primary,
			#143f4d
		);

	color: #ffffff;
}


/* ==========================================================
 * Time selection
 * ========================================================== */

.tutorhelper-student-booking__time {
	border-color:
		color-mix(
			in srgb,
			var(
				--tutorhelper-brand-accent,
				#f46b3b
			)
			55%,
			#ffffff
		);

	background:
		color-mix(
			in srgb,
			var(
				--tutorhelper-brand-accent,
				#f46b3b
			)
			13%,
			#ffffff
		);

	color:
		var(
			--tutorhelper-brand-text,
			#1d2327
		);
}


.tutorhelper-student-booking__time:hover {
	border-color:
		var(
			--tutorhelper-brand-accent,
			#f46b3b
		);

	background:
		color-mix(
			in srgb,
			var(
				--tutorhelper-brand-accent,
				#f46b3b
			)
			22%,
			#ffffff
		);
}


.tutorhelper-student-booking__time:focus-visible {
	outline:
		3px solid
		color-mix(
			in srgb,
			var(
				--tutorhelper-brand-primary,
				#143f4d
			)
			25%,
			transparent
		);
}


.tutorhelper-student-booking__time.is-selected {
	border-color:
		var(
			--tutorhelper-brand-primary,
			#143f4d
		);

	background:
		var(
			--tutorhelper-brand-primary,
			#143f4d
		);

	color: #ffffff;

	box-shadow:
		0 4px 10px
		color-mix(
			in srgb,
			var(
				--tutorhelper-brand-primary,
				#143f4d
			)
			22%,
			transparent
		);
}


/* ==========================================================
 * Booking Type cards
 * ========================================================== */

/*
 * Do not replace --tutorhelper-service-colour here.
 *
 * Booking Type colours remain controlled by their individual
 * service configuration.
 */

.tutorhelper-student-booking__service {
	color:
		var(
			--tutorhelper-brand-text,
			#1d2327
		);
}


.tutorhelper-student-booking__service:focus-visible {
	outline:
		3px solid
		color-mix(
			in srgb,
			var(
				--tutorhelper-brand-primary,
				#143f4d
			)
			25%,
			transparent
		);
}


/* ==========================================================
 * Summary and policy
 * ========================================================== */

.tutorhelper-student-booking__summary-label {
	color:
		color-mix(
			in srgb,
			var(
				--tutorhelper-brand-text,
				#1d2327
			)
			68%,
			#ffffff
		);
}


.tutorhelper-student-booking__policy {
	border-color:
		color-mix(
			in srgb,
			var(
				--tutorhelper-brand-primary,
				#143f4d
			)
			16%,
			#ffffff
		);

	background:
		color-mix(
			in srgb,
			var(
				--tutorhelper-brand-background,
				#ffffff
			)
			94%,
			var(
				--tutorhelper-brand-primary,
					#143f4d
			)
		);
}


/* ==========================================================
 * Submit button
 * ========================================================== */

.tutorhelper-student-booking__submit {
	background:
		var(
			--tutorhelper-brand-primary,
			#143f4d
		);

	color:
	var(
		--tutorhelper-brand-button-text,
		#ffffff
	);

	font-family:
		var(
			--tutorhelper-brand-text-font,
			Arial,
			Helvetica,
			sans-serif
		);
}


.tutorhelper-student-booking__submit:not(:disabled):hover,
.tutorhelper-student-booking__submit:not(:disabled):focus-visible {
	box-shadow:
		0 5px 12px
		color-mix(
			in srgb,
			var(
				--tutorhelper-brand-primary,
				#143f4d
			)
			25%,
			transparent
		);

	filter: brightness(1.08);
}


.tutorhelper-student-booking__submit:not(:disabled):active {
	transform: translateY(1px);
}


/* ==========================================================
 * Footer
 * ========================================================== */

.tutorhelper-student-booking__footer {
	color:
		var(
			--tutorhelper-brand-text,
			#1d2327
		);
}