/**
 * Arosweb Car API — only the rules that Contact Form 7 used to provide.
 *
 * The site's own look lives in the theme's custom CSS (Arosweb > custom_css),
 * which targets .cf7-two-columns / .cf7-column / .numberplate / #carDetails /
 * .cf7-alert / .telcf7 / .postcf7 / .kmcf7 / .pricecf7 — the plugin emits those
 * same class names, so that CSS keeps applying untouched. What disappears with
 * CF7 is the styling hung off CF7's own `.wpcf7*` classes; those rules are
 * reproduced here against the plugin's markup so nothing shifts visually.
 */

/* was: span.wpcf7-form-control-wrap { width:100% } in the theme's css/be.css.
   Contact Form 7 wrapped every field in that span, which is what stretched the
   inputs to the full column width. Without CF7 there is no wrapper, so the
   inputs fall back to their intrinsic ~20-character size — the fields looked
   noticeably smaller. Applied straight to the controls instead. */
.awcar-form label {
	display: block;
	width: 100%;
}

.awcar-form input[type="text"],
.awcar-form input[type="email"],
.awcar-form textarea {
	width: 100%;
	box-sizing: border-box;
	margin-bottom: 3px;
	padding: 10px;
}

.awcar-form textarea {
	height: auto;
}

/* was: .wpcf7 input[type="submit"] */
.awcar-form input[type="submit"] {
	font-size: 16px !important;
}

/* was: .wpcf7-response-output */
.awcar-response-output {
	color: #fff !important;
	font-weight: bold !important;
	background-color: #e25c27 !important;
	margin: 0 !important;
	padding: 10px !important;
	border-radius: 8px !important;
}

/* ------------------------------------------------------------------ gallery */
/* Replaces the MetaSlider carousel with a continuous marquee — no slider library.
   Tile size is duplicated in the PHP as Arosweb_Car_API::TILE_W, which decides how
   many copies of the image set are emitted; keep the two in sync. */

.awcar-gallery {
	display: block;
	position: relative;
	width: 100%;
	margin-top: 35px;
	height: 340px;
	overflow: hidden;
	font-size: 0;
	line-height: 0;
}

.awcar-gallery-track {
	display: flex;
	height: 340px;
	width: max-content;
	will-change: transform;
	animation: awcar-scroll 60s linear infinite;
}

.awcar-gallery:hover .awcar-gallery-track {
	animation-play-state: running; /* matched the old slideshow: hover did not pause */
}

.awcar-gallery-item {
	flex: 0 0 auto;
	margin: 0;
	padding: 0;
	font-size: 0;
	line-height: 0;
}

.awcar-gallery-item img {
	display: block;
	width: 480px;
	height: 340px;
	margin: 0;
	object-fit: cover;
	object-position: center;
	border-radius: 0;
	vertical-align: top;
}

@keyframes awcar-scroll {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
	.awcar-gallery-track {
		animation: none;
	}
	.awcar-gallery {
		overflow-x: auto;
	}
}

/* Honeypot — must stay in the DOM and focusable-by-bots but invisible to people. */
.awcar-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
}


@media (max-width: 767px) {
	.awcar-gallery,
	.awcar-gallery-track {
		height: 190px;
	}
	.awcar-gallery-item img {
		width: 270px;
		height: 190px;
	}
}

/* The resolved car name must not take part in layout, or it pushes the Fortsæt
   button down as soon as a plate resolves. It is absolutely positioned just under
   the plate input, sitting in the gap the theme already leaves above .cf7-next
   (margin-top:25px), so the button never moves. */
.awcar-form .awcar-plate-wrap {
	position: relative;
	display: block;
}
.awcar-form .awcar-plate-wrap #carDetails {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 2;
	margin: 8px 0 0 !important;
	min-height: 0 !important;
	line-height: 18px !important;
	pointer-events: none;
}

/* awcar step-2 buttons — Tilbage and Modtag Tilbud sat flush against the last
   field row; the theme only ever styled .cf7-next's top margin. */
.awcar-form #step-2 .cf7-prev,
.awcar-form #step-2 input[type="submit"] {
	margin-top: 20px;
}