﻿.booking-wizard {
	max-width: 760px;
	margin: 30px auto;
	padding: 28px;
	background: #ffffff;
	border: 1px solid #d9d9d9;
	border-radius: 14px;
	box-shadow: 0 4px 18px rgba(0, 0, 0, 0.08);
	box-sizing: border-box;
	font-family: Jost, Arial, sans-serif;
}

.bookingwizard h2 { 
	font-weight:500;
}

	.booking-wizard .wizard-heading {
		margin: 0 0 24px 0;
		font-size: 1.6em;
		font-weight: 600;
		color: #222;
	}

	.booking-wizard .row {
		display: flex;
		align-items: center;
		gap: 18px;
		margin-bottom: 14px;
		border: none !important
	}

		.booking-wizard .row.row-actions {
			margin-top: 22px;
		}

	.booking-wizard .title {
		flex: 0 0 180px;
		margin: 0;
		font-weight: 600;
		font-size: 1em;
		color: #222;
		box-sizing: border-box;
	}

	.booking-wizard .value {
		flex: 1 1 auto;
		min-width: 0;
		box-sizing: border-box;
	}

	.booking-wizard .input,
	.booking-wizard .textinput {
		width: 100%;
		max-width: 520px;
		min-height: 46px;
		padding: 10px 14px;
		font-size: 1em;
		line-height: 1.3;
		color: #222;
		background: #fff;
		border: 1px solid #bfc7cf;
		border-radius: 12px;
		box-sizing: border-box;
		transition: border-color 0.2s ease, box-shadow 0.2s ease;
		font-family: Jost, Arial, sans-serif;
	}

		.booking-wizard .input:focus,
		.booking-wizard .textinput:focus {
			outline: none;
			border-color: #0b5cab;
			box-shadow: 0 0 0 3px rgba(11, 92, 171, 0.12);
		}

	.booking-wizard input[readonly] {
		background: #f7f8fa;
		color: #333;
		font-weight: 600;
	}

	.booking-wizard .cost-highlight .textinput,
	.booking-wizard .cost-highlight {
		font-size: 1.1em;
		font-weight: 700;
		color: #0b5cab;
	}

	.booking-wizard .message-box {
		max-width: 520px;
		padding: 12px 14px;
		background: #fff8e6;
		border: 1px solid #ffd27a;
		border-radius: 10px;
		color: #8a5a00;
		font-size: 0.95em;
		line-height: 1.4;
		box-sizing: border-box;
	}

	.booking-wizard .button,
	.booking-wizard input[type="submit"],
	.booking-wizard input[type="button"] {
		min-width: 220px;
		padding: 12px 22px;
		font-size: 1em;
		font-weight: 600;
		color: #fff;
		background: #0b5cab;
		border: none;
		border-radius: 10px;
		cursor: pointer;
		transition: background 0.2s ease, transform 0.1s ease;
		font-family: Jost, Arial, sans-serif;
	}

		.booking-wizard .button:hover,
		.booking-wizard input[type="submit"]:hover,
		.booking-wizard input[type="button"]:hover {
			background: #094a89;
		}

		.booking-wizard .button:active,
		.booking-wizard input[type="submit"]:active,
		.booking-wizard input[type="button"]:active {
			transform: translateY(1px);
		}

		.booking-wizard .button:disabled,
		.booking-wizard input[type="submit"]:disabled,
		.booking-wizard input[type="button"]:disabled {
			background: #9aa7b3;
			cursor: not-allowed;
		}

	.booking-wizard .payment-placeholder {
		margin-top: 28px;
		padding: 18px;
		border: 1px dashed #bfc7cf;
		border-radius: 12px;
		background: #f7f8fa;
	}

		.booking-wizard .payment-placeholder h3 {
			margin: 0 0 10px 0;
			font-size: 1.2em;
			font-weight: 600;
			color: #222;
		}

		.booking-wizard .payment-placeholder p {
			margin: 0 0 16px 0;
			color: #555;
		}

@media (max-width: 768px) {
	.booking-wizard {
		margin: 15px;
		padding: 18px;
	}

		.booking-wizard .row {
			display: block;
			margin-bottom: 16px;
		}

		.booking-wizard .title {
			margin-bottom: 6px;
		}

		.booking-wizard .value {
			width: 100%;
		}

		.booking-wizard .input,
		.booking-wizard .textinput,
		.booking-wizard .message-box {
			max-width: 100%;
		}

		.booking-wizard .button,
		.booking-wizard input[type="submit"],
		.booking-wizard input[type="button"] {
			width: 100%;
			min-width: 0;
		}
}
