/**
 * Adarok Accommodate - Booking Form Styles
 *
 * Design philosophy: Warm, Scandinavian-inspired aesthetics
 * that match the Bergstrand brand — clean, approachable,
 * with muted earth tones and generous spacing.
 */

/* ==========================================================================
   Variables (via custom properties for consistency)
   ========================================================================== */
:root {
	--adarok-accent: #969572;        /* Bergstrand brand olive */
	--adarok-accent-hover: #7d7c5e;  /* Darker olive on hover */
	--adarok-accent-text: #fff;
	--adarok-text: #333;
	--adarok-text-muted: #555;
	--adarok-border: #ddd;
	--adarok-bg-subtle: #fafaf8;     /* Warm off-white */
	--adarok-bg-white: #fff;
	--adarok-available: #e8f5e3;     /* Softer green */
	--adarok-booked: #f5e0dd;        /* Softer red/rose */
	--adarok-booked-text: #a04030;
	--adarok-selected: #5a7a6a;      /* Muted sage green for selection */
	--adarok-selected-dark: #4a6659; /* Darker sage */
	--adarok-in-range: #d4ebe0;      /* Light sage tint */
	--adarok-total-color: #5a7a6a;
	--adarok-radius: 0;
	--adarok-radius-sm: 0;
	--adarok-transition: 0.15s ease;
}

/* ==========================================================================
   Booking Form Container
   ========================================================================== */
.adarok-booking-form {
	margin: 1.5em 0;
	padding: 24px;
	background: var(--adarok-bg-subtle);
	border: 1px solid var(--adarok-border);
	border-radius: var(--adarok-radius);
	position: relative;
}

.adarok-booking-form .form-row {
	margin-bottom: 16px;
}

.adarok-booking-form label {
	display: block;
	margin-bottom: 8px;
	font-weight: 600;
	font-size: 0.9em;
	letter-spacing: 0.01em;
	color: var(--adarok-text);
}

.adarok-booking-form label abbr {
	color: var(--adarok-booked-text);
	text-decoration: none;
}

.adarok-booking-form input[type="text"],
.adarok-booking-form input[type="number"],
.adarok-booking-form select {
	width: 100%;
	padding: 12px 16px;
	border: 1px solid var(--adarok-border);
	border-radius: var(--adarok-radius-sm);
	font-size: 1em;
	background: var(--adarok-bg-white);
	color: var(--adarok-text);
	transition: border-color var(--adarok-transition), box-shadow var(--adarok-transition);
}

.adarok-booking-form input:focus,
.adarok-booking-form select:focus {
	border-color: var(--adarok-selected);
	outline: none;
	box-shadow: 0 0 0 3px rgba(90, 122, 106, 0.15);
}

/* Date picker fields */
.adarok-datepicker {
	cursor: pointer;
	background: var(--adarok-bg-white) url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23888"><path d="M19 4h-1V2h-2v2H8V2H6v2H5c-1.11 0-1.99.9-1.99 2L3 20c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 16H5V9h14v11zM9 11H7v2h2v-2zm4 0h-2v2h2v-2zm4 0h-2v2h2v-2z"/></svg>') no-repeat calc(100% - 12px) center;
	background-size: 18px;
	padding-right: 44px !important;
}

/* Form Row Layout */
.adarok-booking-form .form-row-first,
.adarok-booking-form .form-row-last {
	display: inline-block;
	width: calc(50% - 8px);
	vertical-align: top;
	box-sizing: border-box;
}

.adarok-booking-form .form-row-first {
	margin-right: 12px;
}

.adarok-booking-form .form-row-last {
	margin-right: 0;
}

.adarok-booking-form .form-row-wide {
	width: 100%;
	clear: both;
}

/* ==========================================================================
   Clear Dates Link
   ========================================================================== */
.adarok-clear-dates-row {
	margin-top: 8px !important;
	margin-bottom: 0 !important;
	text-align: right;
}

.adarok-clear-dates {
	font-size: 0.85em;
	color: var(--adarok-text-muted);
	text-decoration: none;
	border-bottom: 1px dotted var(--adarok-text-muted);
	transition: color var(--adarok-transition);
}

.adarok-clear-dates:hover {
	color: var(--adarok-booked-text);
	border-bottom-color: var(--adarok-booked-text);
}

/* ==========================================================================
   Booking Summary
   ========================================================================== */
.adarok-booking-summary {
	clear: both;
	margin: 16px 0;
	padding: 20px;
	background: var(--adarok-bg-white);
	border: 1px solid var(--adarok-border);
	border-radius: var(--adarok-radius);
	width: 100%;
	box-sizing: border-box;
}

.adarok-booking-summary h4 {
	margin: 0 0 16px;
	padding: 0 0 12px;
	font-size: 1em;
	font-weight: 600;
	letter-spacing: 0.02em;
	border-bottom: 1px solid #eee;
	color: var(--adarok-text);
}

.adarok-summary-details {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 8px;
	margin: 0;
}

.adarok-summary-details dt {
	font-weight: 600;
	font-size: 0.9em;
	color: var(--adarok-text-muted);
}

.adarok-summary-details dd {
	margin: 0;
	text-align: right;
	font-size: 0.95em;
	color: var(--adarok-text);
}

.adarok-summary-details .adarok-summary-total {
	font-weight: 700;
	font-size: 1.2em;
	color: var(--adarok-total-color);
}

/* ==========================================================================
   Calendar
   ========================================================================== */
.adarok-calendar-container {
	margin-top: 20px;
	clear: both;
}

.adarok-calendar {
	font-family: inherit;
	max-width: 100%;
	overflow: hidden;
}

.adarok-calendar-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 12px;
	padding: 0 4px;
}

.adarok-calendar-header h5 {
	margin: 0;
	font-size: 1.05em;
	font-weight: 600;
	color: var(--adarok-text);
}

.adarok-calendar-nav {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	background: var(--adarok-bg-white);
	border: 1px solid var(--adarok-border);
	border-radius: var(--adarok-radius-sm);
	cursor: pointer;
	font-size: 1em;
	color: var(--adarok-text-muted);
	transition: all var(--adarok-transition);
	padding: 0;
	line-height: 1;
}

.adarok-calendar-nav:hover {
	background: #f0f0f0;
	color: var(--adarok-text);
	border-color: #ccc;
}

.adarok-calendar-grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 1px;
	background: #e0e0e0;
	border: 1px solid #e0e0e0;
	border-radius: var(--adarok-radius-sm);
	overflow: hidden;
}

.adarok-calendar-day-header {
	text-align: center;
	font-weight: 600;
	padding: 10px 4px;
	background: #f5f3f0;
	font-size: 0.8em;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--adarok-text-muted);
}

.adarok-calendar-day {
	aspect-ratio: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--adarok-available);
	cursor: pointer;
	transition: all var(--adarok-transition);
	font-size: 0.9em;
	position: relative;
	z-index: 1;
}

/* Hover uses ::after overlay to preserve diagonal backgrounds */
.adarok-calendar-day::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	transition: background var(--adarok-transition);
	pointer-events: none;
}

.adarok-calendar-day:hover:not(.unavailable):not(.past):not(.empty):not(.disabled-end):not(.booked):not(.transition)::after {
	background: rgba(0, 0, 0, 0.08);
}

/* No hover effect on check-in days when no start selected */
.adarok-booking-form:not(.has-start) .adarok-calendar-day.check-in:hover::after {
	background: transparent;
}

/* No hover on disabled-end */
.adarok-calendar-day.disabled-end:hover::after {
	background: transparent !important;
}

.adarok-calendar-day.empty {
	background: var(--adarok-bg-subtle);
	cursor: default;
}

.adarok-calendar-day.adjacent-month {
	opacity: 0.88;
}

.adarok-calendar-day.past {
	color: #c0bdb5;
	cursor: not-allowed;
	background: #f5f4f2;
}

.adarok-calendar-day.unavailable {
	background: #f0efed;
	color: #aaa;
	cursor: not-allowed;
}

.adarok-calendar-day.booked {
	background: var(--adarok-booked);
	color: var(--adarok-booked-text);
	cursor: not-allowed;
}

.adarok-calendar-day.disabled-end {
	background: #f0efed;
	color: #bbb;
	cursor: not-allowed;
}

/* Invalid selection flash */
@keyframes shake-invalid {
	0%, 100% { transform: translateX(0); }
	20%, 60% { transform: translateX(-3px); }
	40%, 80% { transform: translateX(3px); }
}

.adarok-calendar-day.invalid-selection {
	animation: shake-invalid 0.4s ease;
	box-shadow: 0 0 0 2px var(--adarok-booked-text) inset;
}

/* Check-out day: diagonal split */
.adarok-calendar-day.check-out {
	background: linear-gradient(
		135deg,
		var(--adarok-booked) 50%,
		var(--adarok-available) 50%
	);
	color: var(--adarok-text);
	cursor: pointer;
}

/* Check-in day: diagonal split */
.adarok-calendar-day.check-in {
	background: linear-gradient(
		135deg,
		var(--adarok-available) 50%,
		var(--adarok-booked) 50%
	);
	color: var(--adarok-text);
	cursor: not-allowed;
}

.adarok-booking-form.has-start .adarok-calendar-day.check-in {
	cursor: pointer;
}

/* Transition day */
.adarok-calendar-day.transition {
	background: linear-gradient(
		135deg,
		var(--adarok-booked) 50%,
		var(--adarok-booked) 50%
	);
	color: var(--adarok-booked-text);
	cursor: not-allowed;
}

/* Cursor override */
.adarok-calendar-day.adarok-calendar-day.disabled-end {
	cursor: not-allowed !important;
}

/* Selection states */
.adarok-calendar-day.selected {
	background: var(--adarok-selected);
	color: #fff;
}

.adarok-calendar-day.in-range {
	background: var(--adarok-in-range);
	color: var(--adarok-text);
}

.adarok-calendar-day.start-date {
	background: var(--adarok-selected-dark);
	color: #fff;
	font-weight: 700;
}

.adarok-calendar-day.end-date {
	background: var(--adarok-selected-dark);
	color: #fff;
	font-weight: 700;
}

/* ==========================================================================
   CTA Button (Book Now)
   ========================================================================== */
.adarok-booking-form .single_add_to_cart_button,
.woocommerce .product .adarok-booking-form .single_add_to_cart_button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 14px 32px !important;
	background: var(--adarok-accent) !important;
	color: var(--adarok-accent-text) !important;
	border: none !important;
	border-radius: var(--adarok-radius) !important;
	font-size: 1em !important;
	font-weight: 600 !important;
	letter-spacing: 0.02em;
	cursor: pointer;
	transition: all var(--adarok-transition) !important;
	text-transform: none;
	min-width: 160px;
}

.adarok-booking-form .single_add_to_cart_button:hover,
.woocommerce .product .adarok-booking-form .single_add_to_cart_button:hover {
	background: var(--adarok-accent-hover) !important;
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.adarok-booking-form .single_add_to_cart_button:active,
.woocommerce .product .adarok-booking-form .single_add_to_cart_button:active {
	transform: translateY(0);
	box-shadow: none;
}

/* ==========================================================================
   Loading State
   ========================================================================== */
.adarok-booking-form.loading {
	opacity: 0.6;
	pointer-events: none;
}

.adarok-booking-form.loading::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 28px;
	height: 28px;
	margin: -14px 0 0 -14px;
	border: 3px solid var(--adarok-selected);
	border-top-color: transparent;
	border-radius: 50%;
	animation: adarok-spin 0.8s linear infinite;
}

@keyframes adarok-spin {
	to { transform: rotate(360deg); }
}

/* ==========================================================================
   Utility Styles
   ========================================================================== */
.adarok-noscript-message {
	padding: 16px;
	background: #fff8e1;
	border: 1px solid #ffe082;
	border-radius: var(--adarok-radius-sm);
	color: #6d5e00;
}

/* Order booking details */
.adarok-order-booking-details {
	margin: 1em 0;
	padding: 16px;
	background: var(--adarok-bg-subtle);
	border-radius: var(--adarok-radius-sm);
}

.adarok-order-booking-details p {
	margin: 0.5em 0;
}

.adarok-booking-status {
	display: inline-block;
	padding: 4px 8px;
	border-radius: var(--adarok-radius-sm);
	font-size: 0.85em;
	font-weight: 600;
}

.adarok-booking-status--pending {
	background: #fff3cd;
	color: #856404;
}

.adarok-booking-status--confirmed {
	background: #d4edda;
	color: #155724;
}

.adarok-booking-status--complete {
	background: #cce5ff;
	color: #004085;
}

.adarok-booking-status--cancelled {
	background: #f8d7da;
	color: #721c24;
}

/* Person types fieldset */
.adarok-person-types-field {
	border: 1px solid var(--adarok-border);
	border-radius: var(--adarok-radius-sm);
	padding: 16px;
	margin: 16px 0;
}

.adarok-person-types-field legend {
	font-weight: 600;
	font-size: 0.9em;
	padding: 0 8px;
	color: var(--adarok-text);
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 600px) {
	.adarok-booking-form {
		padding: 16px;
	}

	.adarok-booking-form .form-row-first,
	.adarok-booking-form .form-row-last {
		display: block;
		width: 100%;
		margin-right: 0;
	}

	.adarok-calendar-day {
		font-size: 0.8em;
		aspect-ratio: auto;
		min-height: 40px;
	}

	.adarok-calendar-day-header {
		font-size: 0.72em;
		padding: 8px 2px;
	}

	.adarok-calendar-nav {
		width: 32px;
		height: 32px;
	}

	.adarok-booking-form .single_add_to_cart_button,
	.woocommerce .product .adarok-booking-form .single_add_to_cart_button {
		width: 100% !important;
		min-width: 0;
	}
}