/**
 * Formulaire d'annonce (3.110) : adresse avec suggestions, photos.
 *
 * @package HauntedLodgesCore
 */

/* ------------------------------------------------------------ Adresse */

/* Région, adresse affichée et identifiant Google : déduits ou inutiles,
   l'hôte ne les saisit plus. Les champs restent dans le formulaire. */
html body .listing-manager-form.hl-adresse-auto .form-field-region-container,
html body .listing-manager-form.hl-adresse-auto .form-field-_friendly_address-container,
html body .listing-manager-form .form-field-_place_id-container {
	display: none !important;
}

html body .listing-manager-form .form-field-_address-container.hl-adresse {
	position: relative;
	width: 100% !important;
	max-width: 100% !important;
	flex: 0 0 100% !important;
}

/* La liste déborde du cadre de la section. */
html body .listing-manager-form .add-listing-section:has( .hl-adresse ),
html body .listing-manager-form .add-listing-section:has( .hl-adresse ) .row {
	overflow: visible !important;
}

html body .listing-manager-form .add-listing-section:has( .hl-adresse ) {
	position: relative !important;
	z-index: 6 !important;
}

/* « Taper et appuyer sur Entrée » : plus vrai, les suggestions arrivent seules. */
html body .listing-manager-form .hl-adresse .type-and-hit-enter {
	display: none !important;
}

html body .listing-manager-form .hl-adresse__liste {
	position: absolute;
	z-index: 30;
	left: 15px;
	right: 15px;
	max-height: 340px;
	margin: 6px 0 0;
	padding: 6px;
	overflow-y: auto;
	list-style: none;
	border: 1px solid #ddd7cc;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 18px 40px -18px rgba( 21, 14, 16, 0.35 );
	animation: hl-adresse-ouvre 0.18s cubic-bezier( 0.22, 1, 0.36, 1 );
}

html body .listing-manager-form .hl-adresse__liste[hidden] {
	display: none;
}

@keyframes hl-adresse-ouvre {
	from {
		opacity: 0;
		transform: translateY( -4px );
	}
}

html body .listing-manager-form .hl-adresse__choix {
	display: grid;
	grid-template-columns: 20px minmax( 0, 1fr );
	column-gap: 12px;
	align-items: center;
	margin: 0;
	padding: 10px 12px;
	border-radius: 12px;
	color: #150e10;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

html body .listing-manager-form .hl-adresse__choix svg {
	grid-row: span 2;
	width: 20px;
	height: 20px;
	color: #961b1b;
}

html body .listing-manager-form .hl-adresse__choix.is-actif {
	background: #f5e9e5;
}

html body .listing-manager-form .hl-adresse__nom {
	overflow: hidden;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
	white-space: nowrap;
	text-overflow: ellipsis;
}

html body .listing-manager-form .hl-adresse__lieu {
	overflow: hidden;
	color: #6b6151;
	font-size: 13px;
	line-height: 1.35;
	white-space: nowrap;
	text-overflow: ellipsis;
}

html body .listing-manager-form .hl-adresse__choix.is-vague svg,
html body .listing-manager-form .hl-adresse__choix.is-vague .hl-adresse__nom {
	color: #8a8073;
}

html body .listing-manager-form .hl-adresse__vide {
	margin: 0;
	padding: 12px;
	color: #6b6151;
	font-size: 14px;
	line-height: 1.5;
}

/* Petite roue pendant la recherche, à la place de l'icône Listeo. */
html body .listing-manager-form .hl-adresse.is-recherche::after {
	content: "";
	position: absolute;
	top: 46px;
	right: 30px;
	width: 16px;
	height: 16px;
	border: 2px solid #ddd7cc;
	border-top-color: #961b1b;
	border-radius: 50%;
	animation: hl-adresse-tourne 0.7s linear infinite;
}

@keyframes hl-adresse-tourne {
	to {
		transform: rotate( 360deg );
	}
}

html body .listing-manager-form .hl-adresse__apercu {
	margin: 10px 0 0;
	color: #6b6151;
	font-size: 14px;
	line-height: 1.5;
}

html body .listing-manager-form .hl-adresse__apercu strong {
	color: #150e10;
	font-weight: 600;
}

html body .listing-manager-form .hl-adresse__apercu[hidden] {
	display: none;
}

/* ------------------------------------------------------------- Photos */

html body .listing-manager-form .dropzone.hl-photos {
	display: flex !important;
	flex-wrap: wrap;
	gap: 14px;
	padding: 18px !important;
	border: 1.5px dashed #ddd7cc !important;
	border-radius: 20px !important;
	background: #fbfaf8 !important;
}

html body .listing-manager-form .dropzone.hl-photos .dz-message {
	flex: 1 1 100%;
	margin: 0 !important;
}

/* Tuile « Ajouter des photos » au bout de la liste : un clic sur la zone
   ouvre le choix des fichiers, comme avant. */
html body .listing-manager-form .dropzone.hl-photos.dz-started::after {
	content: "+  Ajouter des photos";
	display: flex;
	align-items: center;
	justify-content: center;
	width: 168px;
	aspect-ratio: 4 / 3;
	border: 1.5px dashed #c9c0b2;
	border-radius: 16px;
	color: #6b6151;
	font-size: 14px;
	font-weight: 600;
	white-space: pre;
	cursor: pointer;
	transition: border-color 0.2s ease, color 0.2s ease;
}

html body .listing-manager-form .dropzone.hl-photos.dz-started:hover::after {
	border-color: #961b1b;
	color: #961b1b;
}

html body .listing-manager-form .hl-photos .dz-preview {
	position: relative;
	width: 168px !important;
	height: auto !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	border-radius: 16px !important;
	background: transparent !important;
	cursor: pointer;
	transition: transform 0.25s cubic-bezier( 0.22, 1, 0.36, 1 );
}

html body .listing-manager-form .hl-photos .dz-preview:hover {
	transform: translateY( -2px );
}

html body .listing-manager-form .hl-photos .dz-preview::before,
html body .listing-manager-form .hl-photos .dz-preview .dz-image::before,
html body .listing-manager-form .hl-photos .dz-preview .dz-details,
html body .listing-manager-form .hl-photos .dz-preview .dz-success-mark,
html body .listing-manager-form .hl-photos .dz-preview .dz-error-mark {
	display: none !important;
}

html body .listing-manager-form .hl-photos .dz-preview .dz-image {
	width: 168px !important;
	height: auto !important;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	z-index: 1 !important;
	border-radius: 16px !important;
	background: #eeebe5;
}

html body .listing-manager-form .hl-photos .dz-preview .dz-image img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	transition: transform 0.4s cubic-bezier( 0.22, 1, 0.36, 1 ), filter 0.2s ease;
}

html body .listing-manager-form .hl-photos .dz-preview:hover .dz-image img {
	transform: scale( 1.04 );
}

html body .listing-manager-form .hl-photos .dz-preview.active-thumb .dz-image {
	box-shadow: 0 0 0 2px #fbfaf8, 0 0 0 4px #961b1b;
}

/* Corbeille : bouton rond, en haut à droite. */
html body .listing-manager-form .hl-photos .dz-preview a.dz-remove {
	position: absolute;
	z-index: 12 !important;
	top: 8px;
	right: 8px;
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 50%;
	background: rgba( 255, 255, 255, 0.92 ) !important;
	box-shadow: 0 4px 12px -4px rgba( 21, 14, 16, 0.4 );
	color: #150e10 !important;
	font-size: 0 !important;
	text-decoration: none !important;
	transition: background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

/* Icône dessinée en CSS : Dropzone ajoute le lien après la vignette, le
   script peut passer avant lui. */
html body .listing-manager-form .hl-photos .dz-preview a.dz-remove svg {
	display: none;
}

html body .listing-manager-form .hl-photos .dz-preview a.dz-remove::before {
	content: "";
	display: block;
	width: 17px;
	height: 17px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16M10 11v6M14 11v6M6 7l1 12a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2l1-12M9 7V5a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 7h16M10 11v6M14 11v6M6 7l1 12a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2l1-12M9 7V5a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2'/%3E%3C/svg%3E") center / contain no-repeat;
}

html body .listing-manager-form .hl-photos .dz-preview a.dz-remove:hover,
html body .listing-manager-form .hl-photos .dz-preview a.dz-remove:focus-visible {
	background: #961b1b !important;
	color: #fff !important;
	transform: scale( 1.06 );
}

html body .listing-manager-form .hl-photos .dz-preview a.dz-remove:focus-visible {
	outline: 2px solid #150e10;
	outline-offset: 2px;
}

/* Badge de la photo de couverture. */
html body .listing-manager-form .hl-photos .hl-photo__badge {
	position: absolute;
	z-index: 11;
	top: 8px;
	left: 8px;
	display: none;
	align-items: center;
	gap: 5px;
	padding: 5px 10px 5px 8px;
	border-radius: 999px;
	background: #961b1b;
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.2;
	box-shadow: 0 4px 12px -4px rgba( 150, 27, 27, 0.6 );
}

html body .listing-manager-form .hl-photos .hl-photo__badge svg {
	width: 13px;
	height: 13px;
	fill: currentColor;
}

html body .listing-manager-form .hl-photos .dz-preview.active-thumb .hl-photo__badge {
	display: inline-flex;
	animation: hl-photo-badge 0.3s cubic-bezier( 0.22, 1, 0.36, 1 );
}

@keyframes hl-photo-badge {
	from {
		opacity: 0;
		transform: scale( 0.8 );
	}
}

/* « Mettre en couverture » sur les autres photos, au survol. */
html body .listing-manager-form .hl-photos .hl-photo__choix {
	position: absolute;
	z-index: 11;
	left: 8px;
	right: 8px;
	bottom: 8px;
	padding: 6px 8px;
	border-radius: 999px;
	background: rgba( 21, 14, 16, 0.78 );
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.2;
	text-align: center;
	pointer-events: none;
	opacity: 0;
	transform: translateY( 4px );
	transition: opacity 0.2s ease, transform 0.2s ease;
}

html body .listing-manager-form .hl-photos .dz-preview:hover .hl-photo__choix {
	opacity: 1;
	transform: none;
}

html body .listing-manager-form .hl-photos .dz-preview.active-thumb .hl-photo__choix {
	display: none;
}

/* Écran tactile : pas de survol, le libellé reste visible. */
@media ( hover: none ) {
	html body .listing-manager-form .hl-photos .hl-photo__choix {
		opacity: 1;
		transform: none;
	}
}

@media ( max-width: 600px ) {
	html body .listing-manager-form .hl-photos .dz-preview,
	html body .listing-manager-form .hl-photos .dz-preview .dz-image,
	html body .listing-manager-form .dropzone.hl-photos.dz-started::after {
		width: calc( 50% - 7px ) !important;
	}

	html body .listing-manager-form .hl-photos .dz-preview .dz-image {
		width: 100% !important;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	html body .listing-manager-form .hl-adresse__liste,
	html body .listing-manager-form .hl-photos .hl-photo__badge,
	html body .listing-manager-form .hl-photos .dz-preview,
	html body .listing-manager-form .hl-photos .dz-preview .dz-image img {
		animation: none;
		transition: none;
	}
}
