/* IC Car Hire — front-end styles. Bootstrap-inspired, driven by --ic-carhire-accent. */

:root {
	--ic-carhire-accent: #0d6efd;
	--ic-carhire-border: #dee2e6;
	--ic-carhire-border-strong: #ced4da;
	--ic-carhire-bg-soft: #f8f9fa;
	--ic-carhire-bg-softer: #fbfcfd;
	--ic-carhire-muted: #6c757d;
	--ic-carhire-text: #212529;
	--ic-carhire-radius: 0.5rem;
	--ic-carhire-radius-sm: 0.375rem;
	--ic-carhire-shadow: 0 0.125rem 0.25rem rgba(0,0,0,.06);
	--ic-carhire-shadow-hover: 0 0.5rem 1.25rem rgba(0,0,0,.10);
}

/* Auto-scroll target offsets — leave breathing room above each section. */
#ic-carhire-results,
#ic-carhire-booking {
	scroll-margin-top: 2rem;
}

/* ===============================================================
 *  SEARCH FORM
 * ============================================================ */
.ic-carhire-search {
	background: var(--ic-carhire-bg-soft);
	border: 1px solid var(--ic-carhire-border);
	border-radius: var(--ic-carhire-radius);
	padding: 1.5rem;
}

.ic-carhire-search .ic-carhire-field {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}
.ic-carhire-search .ic-carhire-label {
	font-weight: 500;
	color: var(--ic-carhire-text);
	line-height: 1.3;
}

/* ===============================================================
 *  RESULTS
 * ============================================================ */
.ic-carhire-results {
	margin-top: 1.5rem;
}

.ic-carhire-results-summary {
	margin: 0 0 1.5rem;
	padding: 0.85rem 1.1rem;
	background: var(--ic-carhire-bg-soft);
	border-left: 4px solid var(--ic-carhire-accent);
	border-radius: 0 var(--ic-carhire-radius-sm) var(--ic-carhire-radius-sm) 0;
	font-weight: 500;
	color: var(--ic-carhire-text);
	line-height: 1.5;
}

.ic-carhire-card {
	background: #fff;
	border: 1px solid var(--ic-carhire-border);
	border-radius: var(--ic-carhire-radius);
	box-shadow: var(--ic-carhire-shadow);
	transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
	overflow: hidden;
	padding: 1.25rem;
}
.ic-carhire-card:hover {
	box-shadow: var(--ic-carhire-shadow-hover);
	transform: translateY(-3px);
	border-color: color-mix(in srgb, var(--ic-carhire-accent) 30%, var(--ic-carhire-border));
}

.ic-carhire-card img {
	display: block;
	border-radius: var(--ic-carhire-radius-sm);
	margin: -0.25rem 0 0.25rem;
}

.ic-carhire-card-title {
	margin: 0;
	font-weight: 600;
	color: var(--ic-carhire-text);
	line-height: 1.3;
}

.ic-carhire-specs {
	color: var(--ic-carhire-muted);
	line-height: 1.4;
}
.ic-carhire-specs li {
	background: var(--ic-carhire-bg-soft);
	border: 1px solid var(--ic-carhire-border);
	padding: 0.2rem 0.65rem;
	border-radius: 999px;
}

/* Custom features (operator-defined) — subtly tinted with the accent. */
.ic-carhire-specs li.ic-carhire-feature {
	background: color-mix(in srgb, var(--ic-carhire-accent) 8%, #fff);
	border-color: color-mix(in srgb, var(--ic-carhire-accent) 35%, var(--ic-carhire-border));
	color: color-mix(in srgb, var(--ic-carhire-accent) 60%, var(--ic-carhire-text));
}

.ic-carhire-price {
	margin: 0;
	padding-top: 0.25rem;
	border-top: 1px solid var(--ic-carhire-border);
	line-height: 1.5;
}
.ic-carhire-price strong {
	color: var(--ic-carhire-accent);
	font-weight: 700;
}
.ic-carhire-price small {
	color: var(--ic-carhire-muted);
	margin-left: 0.35rem;
}

.ic-carhire-card .ic-carhire-book {
	margin-top: 0.25rem;
	width: 100%;
}

/* ===============================================================
 *  FORM CONTROLS  (inputs / selects / textareas)
 * ============================================================ */
.ic-carhire-search input,
.ic-carhire-search select,
.ic-carhire-booking-form input,
.ic-carhire-booking-form select,
.ic-carhire-booking-form textarea {
	padding: 0.55rem 0.8rem;
	border: 1px solid var(--ic-carhire-border-strong);
	border-radius: var(--ic-carhire-radius-sm);
	background: #fff;
	width: 100%;
	box-sizing: border-box;
	transition: border-color .15s ease, box-shadow .15s ease;
	color: var(--ic-carhire-text);
	line-height: 1.4;
}
.ic-carhire-search input:focus,
.ic-carhire-search select:focus,
.ic-carhire-booking-form input:focus,
.ic-carhire-booking-form select:focus,
.ic-carhire-booking-form textarea:focus {
	border-color: var(--ic-carhire-accent);
	box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--ic-carhire-accent) 25%, transparent);
	outline: 0;
}

/* ===============================================================
 *  BUTTONS
 * ============================================================ */
.ic-carhire-btn {
	display: inline-block;
	padding: 0.6rem 1.25rem;
	background: var(--ic-carhire-accent);
	color: #fff;
	border: 1px solid var(--ic-carhire-accent);
	border-radius: var(--ic-carhire-radius-sm);
	font-weight: 500;
	text-decoration: none;
	cursor: pointer;
	text-align: center;
	transition: background-color .15s ease, border-color .15s ease, transform .1s ease;
	line-height: 1.4;
}
.ic-carhire-btn:hover,
.ic-carhire-btn:focus {
	background: color-mix(in srgb, var(--ic-carhire-accent) 85%, black);
	border-color: color-mix(in srgb, var(--ic-carhire-accent) 80%, black);
	color: #fff;
	text-decoration: none;
}
.ic-carhire-btn:active {
	transform: translateY(1px);
}
.ic-carhire-btn-lg {
	padding: 0.8rem 1.6rem;
	font-weight: 600;
}

/* ===============================================================
 *  BOOKING
 * ============================================================ */
.ic-carhire-booking {
	margin-top: 1.5rem;
}

.ic-carhire-booking-title {
	margin: 0 0 1.5rem;
	padding-bottom: 0.65rem;
	border-bottom: 2px solid var(--ic-carhire-accent);
	font-weight: 600;
	line-height: 1.25;
}

/* Summary box (pickup/return/duration/base rental) */
.ic-carhire-booking-summary {
	background: var(--ic-carhire-bg-soft);
	border: 1px solid var(--ic-carhire-border);
	border-radius: var(--ic-carhire-radius);
	padding: 1.25rem;
}
.ic-carhire-booking-summary > div {
	line-height: 1.6;
	color: var(--ic-carhire-text);
}
.ic-carhire-booking-summary > div strong {
	display: block;
	margin-bottom: 0.4rem;
	color: var(--ic-carhire-muted);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
}

/* Card-style panels around each form section (Optional extras / Driver details). */
.ic-carhire-section {
	background: #fff;
	border: 1px solid var(--ic-carhire-border);
	border-radius: var(--ic-carhire-radius);
	box-shadow: var(--ic-carhire-shadow);
	padding: 1.5rem;
}

.ic-carhire-section-title {
	margin: 0 0 0.4rem;
	padding-bottom: 0.6rem;
	border-bottom: 1px solid var(--ic-carhire-border);
	font-weight: 600;
	color: var(--ic-carhire-text);
	line-height: 1.3;
}

.ic-carhire-section-hint {
	margin: 0 0 1.25rem;
	color: var(--ic-carhire-muted);
	line-height: 1.45;
}

/* Driver details — stacked label/input pairs */
.ic-carhire-driver label {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}
.ic-carhire-driver label > span {
	font-weight: 500;
	color: var(--ic-carhire-text);
	line-height: 1.3;
}

/* ===============================================================
 *  EXTRAS
 * ============================================================ */
.ic-carhire-extra {
	background: #fff;
	border: 1px solid var(--ic-carhire-border);
	border-radius: var(--ic-carhire-radius);
	padding: 0.95rem 1.1rem;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.ic-carhire-extra:hover {
	border-color: var(--ic-carhire-accent);
	box-shadow: 0 0 0 1px var(--ic-carhire-accent);
}
.ic-carhire-extra > span {
	line-height: 1.55;
}
.ic-carhire-extra strong {
	color: var(--ic-carhire-text);
}
.ic-carhire-extra small {
	color: var(--ic-carhire-muted);
}
.ic-carhire-extra input[type="number"] {
	padding: 0.4rem 0.55rem;
	border: 1px solid var(--ic-carhire-border-strong);
	border-radius: var(--ic-carhire-radius-sm);
	text-align: right;
	width: 4.5rem;
	box-sizing: border-box;
}

/* ===============================================================
 *  TERMS CHECKBOX
 * ============================================================ */
.ic-carhire-terms {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	padding: 0.85rem 1rem;
	background: var(--ic-carhire-bg-softer);
	border: 1px solid var(--ic-carhire-border);
	border-radius: var(--ic-carhire-radius-sm);
	line-height: 1.5;
	color: var(--ic-carhire-text);
	cursor: pointer;
}
.ic-carhire-terms input[type="checkbox"] {
	margin-top: 0.2rem;
	width: auto;
	flex: 0 0 auto;
}
.ic-carhire-terms span {
	flex: 1 1 auto;
}

/* ===============================================================
 *  NOTICE (no results / errors / info)
 * ============================================================ */
.ic-carhire-notice {
	margin: 1rem 0;
	padding: 0.95rem 1.2rem;
	background: #fff3cd;
	border-left: 4px solid #ffc107;
	border-radius: 0 var(--ic-carhire-radius-sm) var(--ic-carhire-radius-sm) 0;
	color: #664d03;
	line-height: 1.5;
}

/* ===============================================================
 *  RESPONSIVE
 * ============================================================ */
@media (max-width: 600px) {
	.ic-carhire-search {
		padding: 1.25rem;
	}
	.ic-carhire-card {
		padding: 1rem;
	}
	.ic-carhire-booking-summary,
	.ic-carhire-section,
	.ic-carhire-extra {
		padding: 1.1rem;
	}
	.ic-carhire-booking-form .ic-carhire-btn-lg {
		width: 100%;
	}
}
