/**
 * Correctif : sidebar fiche véhicule (single listing) visible sur mobile.
 * Cible :
 * - template Motors Pro / Nuxy (.single-listing-container)
 * - template WPBakery / thème (.vc_column_container avec vc_hidden-* contenant prix/vendeur)
 */

/* ========== WPBakery (Visual Composer) : colonne sidebar visible sur mobile ========== */
@media (max-width: 1023px) {
	/* Colonne qui contient le bloc prix + vendeur + contact : forcer l'affichage */
	.vc_column_container.vc_hidden-xs:has(.single-car-prices),
	.vc_column_container.vc_hidden-sm:has(.single-car-prices),
	.vc_column_container.vc_hidden-md:has(.single-car-prices),
	.vc_column_container.vc_hidden-xs:has(.stm-listing-car-dealer-info),
	.vc_column_container.vc_hidden-sm:has(.stm-listing-car-dealer-info),
	.vc_column_container.vc_hidden-md:has(.stm-listing-car-dealer-info) {
		display: block !important;
		visibility: visible !important;
		width: 100% !important;
		max-width: 100% !important;
		opacity: 1 !important;
	}

	/*
	 * Dans la colonne SIDEBAR DROITE uniquement : masquer les doublons sur mobile.
	 * La colonne gauche affiche déjà : bandeau prix → photos → tableau → description.
	 * On garde dans la sidebar uniquement : WhatsApp + vendeur (VOITURA) + téléphone.
	 */
	.stm-vc-single-car-sidebar-right .vc_column_container.vc_hidden-xs .single-car-prices,
	.stm-vc-single-car-sidebar-right .vc_column_container.vc_hidden-sm .single-car-prices,
	.stm-vc-single-car-sidebar-right .vc_column_container.vc_hidden-md .single-car-prices,
	.stm-vc-single-car-sidebar-right .vc_column_container.vc_hidden-xs .sale-price-description-single,
	.stm-vc-single-car-sidebar-right .vc_column_container.vc_hidden-sm .sale-price-description-single,
	.stm-vc-single-car-sidebar-right .vc_column_container.vc_hidden-md .sale-price-description-single,
	.stm-vc-single-car-sidebar-right .vc_column_container.vc_hidden-xs .single-car-data,
	.stm-vc-single-car-sidebar-right .vc_column_container.vc_hidden-sm .single-car-data,
	.stm-vc-single-car-sidebar-right .vc_column_container.vc_hidden-md .single-car-data {
		display: none !important;
	}

	/*
	 * Quand la barre sticky JS est injectée : masquer les blocs WhatsApp + vendeur dans la sidebar
	 * pour éviter doublon et débordement.
	 */
	body.voitura-sticky-bar-injected .stm-vc-single-car-sidebar-right .stm_social_buttons_wrap,
	body.voitura-sticky-bar-injected .stm-vc-single-car-sidebar-right .stm-listing-car-dealer-info {
		display: none !important;
	}




	/* Réserve d’espace en bas pour ne pas cacher le contenu derrière la barre sticky */
	body.single-listings .stm-single-car-page,
	body.single-listings-template .stm-single-car-page {
		padding-bottom: max(90px, calc(env(safe-area-inset-bottom, 0px) + 70px)) !important;
	}
}

/* ========== Barre sticky contact (injectée en JS) : un bandeau WhatsApp + Appeler ========== */
@media (max-width: 1023px) {
	.voitura-sticky-contact-bar {
		position: fixed !important;
		bottom: 0 !important;
		left: 0 !important;
		right: 0 !important;
		z-index: 9999 !important;
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: stretch !important;
		justify-content: stretch !important;
		width: 100% !important;
		max-width: 100vw !important;
		box-sizing: border-box !important;
		margin: 0 !important;
		padding: 0 !important;
		padding-bottom: env(safe-area-inset-bottom, 0) !important;
		background: #fff !important;
		box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.12) !important;
		overflow: hidden !important;
	}

	.voitura-sticky-contact-bar__btn {
		flex: 1 1 0 !important;
		min-width: 0 !important;
		max-width: 50% !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 8px !important;
		padding: 14px 12px !important;
		padding-bottom: max(14px, env(safe-area-inset-bottom, 0)) !important;
		text-decoration: none !important;
		font-weight: 600 !important;
		font-size: 15px !important;
		line-height: 1.2 !important;
		border: none !important;
		box-sizing: border-box !important;
		overflow: hidden !important;
		white-space: nowrap !important;
	}
	.voitura-sticky-contact-bar__btn--whatsapp {
		background: #25d366 !important;
		color: #fff !important;
		border-right: 1px solid rgba(0, 0, 0, 0.08) !important;
	}
	.voitura-sticky-contact-bar__btn--whatsapp:hover,
	.voitura-sticky-contact-bar__btn--whatsapp:focus {
		background: #20bd5a !important;
		color: #fff !important;
	}
	.voitura-sticky-contact-bar__btn--phone {
		background: #1a1a1a !important;
		color: #fff !important;
	}
	.voitura-sticky-contact-bar__btn--phone:hover,
	.voitura-sticky-contact-bar__btn--phone:focus {
		background: #333 !important;
		color: #fff !important;
	}
	.voitura-sticky-contact-bar__icon {
		display: inline-block !important;
		width: 22px !important;
		height: 22px !important;
		flex-shrink: 0 !important;
		background-size: contain !important;
		background-repeat: no-repeat !important;
		background-position: center !important;
	}
	.voitura-sticky-contact-bar__btn--whatsapp .voitura-sticky-contact-bar__icon {
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413z'/%3E%3C/svg%3E") !important;
	}
	.voitura-sticky-contact-bar__btn--phone .voitura-sticky-contact-bar__icon {
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z'/%3E%3C/svg%3E") !important;
	}
}

/* ========== Template Motors Pro / Nuxy (.single-listing-container) ========== */
@media (max-width: 1023px) {
	/* Annuler les classes Bootstrap/theme qui cachent le sidebar sur mobile */
	.single-listing-container .hidden-xs,
	.single-listing-container .hidden-sm,
	.single-listing-container .hidden-md,
	.single-listing-container [class*="hidden-"],
	.single-listing-container .d-none,
	.single-listing-container .d-sm-none,
	.single-listing-container .d-md-none,
	.single-listing-container aside.single-listing-sidebar.hidden-xs,
	.single-listing-container aside.single-listing-sidebar.hidden-sm,
	.single-listing-contact-actions .hidden-xs,
	.single-listing-contact-actions .hidden-sm,
	.single-listing-contact-actions .single-listing-sidebar[class*="hidden"] {
		display: block !important;
		visibility: visible !important;
	}

	/* Conteneur principal : empiler main + sidebar en colonne */
	.single-listing-container {
		display: flex !important;
		flex-direction: column !important;
		flex-wrap: nowrap !important;
	}

	/* Sidebar (prix, vendeur, boutons contact) : toujours visible, pleine largeur */
	.single-listing-container .single-listing-sidebar,
	.single-listing-container aside.single-listing-sidebar {
		display: block !important;
		visibility: visible !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		padding: 0 !important;
		margin: 24px 0 0 !important;
		order: 2;
		opacity: 1 !important;
		height: auto !important;
		overflow: visible !important;
	}

	/* Main content au-dessus du sidebar */
	.single-listing-container main.single-listing-main {
		order: 1;
		min-width: 0 !important;
		max-width: 100% !important;
	}
}

/* Bloc "Contact" (carte vendeur + formulaire) : visible sur mobile */
@media (max-width: 1023px) {
	.single-listing-contact-actions .single-listing-container .hidden-xs,
	.single-listing-contact-actions .single-listing-container .hidden-sm,
	.single-listing-contact-actions .single-listing-sidebar[class*="hidden"] {
		display: block !important;
		visibility: visible !important;
	}

	.single-listing-contact-actions {
		display: flex !important;
		flex-direction: column !important;
		flex-wrap: nowrap !important;
	}

	.single-listing-contact-actions .single-listing-container {
		display: flex !important;
		flex-direction: column !important;
	}

	.single-listing-contact-actions .single-listing-sidebar {
		display: block !important;
		visibility: visible !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 0 20px !important;
		order: 1;
		opacity: 1 !important;
	}

	.single-listing-contact-actions .single-listing-main {
		order: 2;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
	}
}

/* Renforcer avec body class si présent (single listing WordPress) */
@media (max-width: 1023px) {
	body.single-listings .single-listing-container aside.single-listing-sidebar,
	body.single-listings .single-listing-contact-actions .single-listing-sidebar,
	body.single-listings-template .single-listing-container aside.single-listing-sidebar,
	body.single-listings-template .single-listing-contact-actions .single-listing-sidebar,
	.stm-single-car-page .single-listing-container aside.single-listing-sidebar,
	.single-listings-template .single-listing-container aside.single-listing-sidebar {
		display: block !important;
		visibility: visible !important;
		width: 100% !important;
		max-width: 100% !important;
	}
}
