/**
 * Habillage des sorties du plugin Builder (formulaires + coordonnées) pour les
 * fondre dans le thème sombre/or de Lux Auto. Chargé sur le front après les
 * feuilles du plugin. Ne modifie pas la logique du plugin — uniquement le style.
 */

/* ================================================================== */
/* Formulaire de contact (module Builder Forms)                        */
/* ================================================================== */
.la-contact-form {
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 20px;
	background: var(--color-surface-2, #111116);
	padding: clamp(1.6rem, 3vw, 2.5rem);
}

/* Espacements de la maquette (18px vertical / 16px horizontal), sans la
   marge basse du plugin qui creuse la carte. */
.la-contact-form .builder-form {
	gap: 1.125rem 1rem;
	max-width: none;
	margin: 0;
}
.la-contact-form .builder-form__page {
	gap: 1.125rem 1rem;
}

.la-contact-form .builder-field__label {
	color: var(--color-muted-2, #8f897b);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.la-contact-form .builder-field__input,
.la-contact-form .builder-field__select,
.la-contact-form .builder-field__textarea {
	background: var(--color-field, #0c0c0f);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 10px;
	color: var(--color-ink, #f4f1ea);
	padding: 0.8rem 0.9rem;
	font-family: "Manrope", system-ui, sans-serif;
	font-size: 0.95rem;
}
.la-contact-form .builder-field__input::placeholder,
.la-contact-form .builder-field__textarea::placeholder {
	color: var(--color-muted-2, #8f897b);
	opacity: 0.7;
}
.la-contact-form .builder-field__input:focus,
.la-contact-form .builder-field__select:focus,
.la-contact-form .builder-field__textarea:focus {
	outline: none;
	border-color: var(--color-gold, #c6a15b);
	box-shadow: 0 0 0 1px rgba(198, 161, 91, 0.35);
}
.la-contact-form .builder-field__select {
	color: var(--color-ink, #f4f1ea);
}
.la-contact-form select.builder-field__select option {
	color: #111;
}

.la-contact-form .builder-form__btn--submit {
	flex: 1;
	font-family: "Sora", sans-serif;
	font-weight: 700;
	font-size: 0.9rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--color-bg, #0b0b0d);
	padding: 1rem 1.6rem;
	border: none;
	border-radius: 12px;
	background: linear-gradient(135deg, #e6cd8f, #c6a15b 60%, #a67f36);
	box-shadow: 0 12px 34px -12px rgba(198, 161, 91, 0.7);
	cursor: pointer;
	transition: filter 0.2s ease;
}
.la-contact-form .builder-form__btn--submit:hover {
	filter: brightness(1.07);
}

/* Erreurs de champ : rouge lisible sur fond sombre (le plugin vise un fond clair). */
.la-contact-form .builder-field__error {
	color: #ff8085;
}
.la-contact-form .builder-field.has-error .builder-field__input,
.la-contact-form .builder-field.has-error .builder-field__textarea,
.la-contact-form .builder-field.has-error .builder-field__select {
	border-color: #ff8085;
	box-shadow: 0 0 0 1px rgba(255, 128, 133, 0.3);
}

/* Messages de soumission : variantes sombres (le plugin sert des boîtes claires). */
.la-contact-form .builder-form__message {
	color: var(--color-gold-light, #e6cd8f);
	font-size: 0.9rem;
	margin-top: 0.75rem;
}
.la-contact-form .builder-form__message--success {
	background: rgba(198, 161, 91, 0.08);
	border: 1px solid rgba(198, 161, 91, 0.35);
	color: var(--color-gold-light, #e6cd8f);
}
.la-contact-form .builder-form__message--error {
	background: rgba(255, 128, 133, 0.08);
	border: 1px solid rgba(255, 128, 133, 0.35);
	color: #ff8085;
}

/* ----- Mobile ----- */
@media (max-width: 640px) {
	/* Tous les champs sur une colonne, comme la maquette. */
	.la-contact-form .builder-field--w-half,
	.la-contact-form .builder-field--w-third {
		flex: 1 1 100%;
	}
	/* 16px minimum : en dessous, iOS Safari zoome sur la page au focus. */
	.la-contact-form .builder-field__input,
	.la-contact-form .builder-field__select,
	.la-contact-form .builder-field__textarea {
		font-size: 1rem;
	}
	/* Carte moins épaisse pour laisser de la largeur aux champs. */
	.la-contact-form {
		padding: 1.4rem 1.15rem;
		border-radius: 16px;
	}
}

/* ================================================================== */
/* Coordonnées (module Builder Contact) — cartes sombres               */
/* ================================================================== */
.la-contact-aside .builder-contact {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.la-contact-aside .builder-contact__link {
	text-decoration: none;
	color: inherit;
}
.la-contact-aside .builder-contact__card {
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 16px;
	background: var(--color-surface-2, #111116);
	padding: 1.4rem;
	display: flex;
	gap: 1rem;
	align-items: flex-start;
	transition: border-color 0.2s ease;
}
.la-contact-aside .builder-contact__link:hover .builder-contact__card {
	border-color: rgba(198, 161, 91, 0.4);
}
.la-contact-aside .builder-contact__icon {
	flex: none;
	width: 44px;
	height: 44px;
	border-radius: 11px;
	background: rgba(198, 161, 91, 0.1);
	border: 1px solid rgba(198, 161, 91, 0.25);
	color: var(--color-gold-light, #e6cd8f);
	display: flex;
	align-items: center;
	justify-content: center;
}
.la-contact-aside .builder-contact__label {
	display: block;
	font-family: "Sora", sans-serif;
	font-weight: 600;
	font-size: 0.75rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--color-muted-2, #8f897b);
	margin-bottom: 0.3rem;
}
.la-contact-aside .builder-contact__value {
	color: var(--color-ink-soft, #c8c3b8);
	font-size: 0.95rem;
	line-height: 1.5;
}
.la-contact-aside .builder-contact__hours-row {
	display: block;
}
.la-contact-aside .builder-contact__map {
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 16px;
	overflow: hidden;
	min-height: 220px;
}
.la-contact-aside .builder-contact__map iframe {
	display: block;
	width: 100%;
	min-height: 220px;
	border: 0;
	filter: grayscale(0.35) invert(0.92) hue-rotate(180deg) contrast(0.9);
}
