/*
 * Scheda prodotto (template #58 IT, #2614 EN, stessi ID):
 *   659ec102  sezione principale a due colonne
 *   34ac9909  colonna sinistra: percorso (2eacc3b) e galleria (41e9992f)
 *   187a8ba7  colonna destra: titolo+cuore (5fdac4c), prezzo (490ba46),
 *             valutazioni (7dc7da88), descrizione (98a8188), carrello
 *             (754437fb), in negozio (5660a6a), meta (ab0d1aa),
 *             «Informazioni aggiuntive» (bde98d4)
 * Il resto della pagina (prodotti alternativi, potrebbe piacerti,
 * artigianalità, storia) non si tocca.
 */

body.fr-scheda {
	--fr-s-fondo: #efefef;
	--fr-s-riga: #e6e6e6;
	--fr-s-spento: #767676;
	--fr-s-alto: calc(100vh - var(--frasette-barra, 70px));
}

/* La sezione principale attaccata all'header: le foto partono dalla barra. */
body.fr-scheda [data-elementor-type="product"] {
	padding-top: 0 !important;
}

body.fr-scheda .elementor-element-659ec102 {
	margin: 0 !important;
	padding: 0 !important;
}

body.fr-scheda .elementor-element-659ec102 > .elementor-container {
	max-width: none !important;
	align-items: flex-start !important;
}

body.fr-scheda .elementor-element-34ac9909 > .elementor-widget-wrap,
body.fr-scheda .elementor-element-187a8ba7 > .elementor-widget-wrap {
	padding: 0 !important;
}

/* ---------------------------------------------------------------------------
 * La galleria
 * ------------------------------------------------------------------------ */

/* L'originale resta nella pagina (schermo intero, varianti) ma non si vede. */
body.fr-scheda .fr-galleria-originale {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

.fr-galleria {
	position: relative;
	width: 100%;
}

.fr-galleria__elenco {
	display: flex;
	flex-direction: column;
	gap: 2px;
	background: #fff;
}

.fr-galleria__foto {
	margin: 0;
	background: var(--fr-s-fondo);
}

.fr-galleria__apri {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: none !important;
	cursor: zoom-in;
}

.fr-galleria__apri img {
	display: block;
	width: 100%;
	height: var(--fr-s-alto);
	min-height: 520px;
	max-height: 1100px;
	object-fit: cover;
	object-position: center;
}

.fr-galleria__apri:focus-visible {
	outline: 1px solid #000;
	outline-offset: -4px;
}

/*
 * I pallini: fermi in basso a sinistra finché si scorre la galleria. Il
 * contenitore è alto zero e appiccicato al fondo dello schermo, così non
 * occupa spazio e sparisce con la galleria.
 */
.fr-galleria__punti {
	position: sticky;
	bottom: 32px;
	z-index: 2;
	height: 0;
}

.fr-galleria__punti-dentro {
	position: absolute;
	left: var(--fr-lato, 40px);
	bottom: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.fr-galleria__punto {
	position: relative;
	width: 16px;
	height: 16px;
	margin: 0;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: none !important;
	cursor: pointer;
}

.fr-galleria__punto::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 7px;
	height: 7px;
	border: 1px solid #000;
	border-radius: 50%;
	background: transparent;
	transform: translate(-50%, -50%);
	transition: background-color 0.2s ease;
}

.fr-galleria__punto.is-attivo::before {
	background: #000;
}

.fr-galleria__punto:focus-visible {
	outline: 1px solid #000;
	outline-offset: 1px;
}

/* ---------------------------------------------------------------------------
 * Le informazioni: ferme a destra mentre le foto scorrono
 * ------------------------------------------------------------------------ */

@media (min-width: 1025px) {
	body.fr-scheda .elementor-element-34ac9909,
	body.fr-scheda .elementor-element-187a8ba7 {
		width: 50% !important;
	}

	body.fr-scheda .elementor-element-187a8ba7 {
		position: sticky !important;
		top: var(--frasette-barra, 70px);
		align-self: flex-start !important;
		max-height: var(--fr-s-alto);
		overflow-y: auto;
		scrollbar-width: thin;
	}

	body.admin-bar.fr-scheda .elementor-element-187a8ba7 {
		top: calc(var(--frasette-barra, 70px) + 32px);
		max-height: calc(var(--fr-s-alto) - 32px);
	}

	body.fr-scheda .elementor-element-187a8ba7 > .elementor-widget-wrap {
		display: flex !important;
		flex-direction: column;
		justify-content: center;
		min-height: var(--fr-s-alto);
		padding: 48px var(--fr-lato, 40px) 48px 64px !important;
	}
}

/* Ogni elemento della colonna a tutta larghezza, senza i rientri di prima. */
body.fr-scheda .elementor-element-187a8ba7 > .elementor-widget-wrap > .elementor-element {
	width: 100% !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/* Il percorso, ora in cima alla colonna. */
body.fr-scheda .elementor-element-187a8ba7 .elementor-element-2eacc3b {
	margin-bottom: 28px !important;
}

body.fr-scheda .elementor-element-187a8ba7 .elementor-element-2eacc3b .woocommerce-breadcrumb {
	width: auto !important;
	margin: 0 !important;
	font-size: 12px !important;
}

/* Titolo e cuore: una riga, senza la linea grigia sotto. */
body.fr-scheda .elementor-element-5fdac4c {
	align-items: flex-start !important;
	justify-content: space-between !important;
	gap: 24px;
	margin: 0 0 10px !important;
	padding: 0 !important;
	border: 0 !important;
}

body.fr-scheda .elementor-element-a295979 {
	flex: 1 1 auto !important;
	width: auto !important;
}

body.fr-scheda .elementor-element-a295979 .product_title {
	margin: 0 !important;
	color: #000 !important;
	font-size: 24px !important;
	font-weight: 400 !important;
	line-height: 1.3 !important;
	letter-spacing: 0 !important;
}

body.fr-scheda .elementor-element-490ba46 .price {
	margin: 0 0 24px !important;
	color: #000 !important;
	font-size: 17px !important;
	font-weight: 400 !important;
}

/* Il carrello e «Acquista con un click»: a tutta larghezza, come nel modello. */
body.fr-scheda .elementor-element-754437fb form.cart {
	margin: 0 !important;
}

body.fr-scheda .elementor-element-754437fb .single_add_to_cart_button,
body.fr-scheda .elementor-element-754437fb .button {
	width: 100% !important;
	min-height: 52px;
	border-radius: 0 !important;
	letter-spacing: 0.06em;
}

body.fr-scheda .elementor-element-5660a6a {
	margin-top: 8px !important;
}

/* Le voci a scomparsa: «Descrizione» (nuova) e «Informazioni aggiuntive». */
.fr-scheda-voce {
	margin: 28px 0 0;
	border-top: 1px solid var(--fr-s-riga);
}

.fr-scheda-voce > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 0;
	color: #000;
	font-size: 14px;
	list-style: none;
	cursor: pointer;
}

.fr-scheda-voce > summary::-webkit-details-marker {
	display: none;
}

.fr-scheda-voce > summary::after {
	content: "";
	width: 10px;
	height: 10px;
	border-right: 1px solid #000;
	border-bottom: 1px solid #000;
	transform: translateY(-3px) rotate(45deg);
	transition: transform 0.2s ease;
}

.fr-scheda-voce[open] > summary::after {
	transform: translateY(2px) rotate(-135deg);
}

.fr-scheda-voce > summary:focus-visible {
	outline: 1px solid #000;
	outline-offset: 2px;
}

.fr-scheda-voce__corpo {
	padding: 0 0 16px;
}

body.fr-scheda .fr-scheda-voce .elementor-element-98a8188 {
	margin: 0 !important;
}

body.fr-scheda .elementor-element-bde98d4 {
	border-top: 1px solid var(--fr-s-riga);
	border-bottom: 1px solid var(--fr-s-riga);
}

/* SKU e categoria: piccoli e grigi, dopo le voci. */
body.fr-scheda .elementor-element-ab0d1aa {
	order: 99;
	margin-top: 20px !important;
	color: var(--fr-s-spento);
	font-size: 12px !important;
}

/* ---------------------------------------------------------------------------
 * Tablet e telefono: foto scorrevoli di lato, informazioni sotto
 * ------------------------------------------------------------------------ */

@media (max-width: 1024px) {
	body.fr-scheda .elementor-element-34ac9909,
	body.fr-scheda .elementor-element-187a8ba7 {
		width: 100% !important;
	}

	.fr-galleria__elenco {
		flex-direction: row;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
		overscroll-behavior-x: contain;
	}

	.fr-galleria__elenco::-webkit-scrollbar {
		display: none;
	}

	.fr-galleria__foto {
		flex: 0 0 100%;
		scroll-snap-align: start;
	}

	.fr-galleria__apri img {
		height: auto;
		min-height: 0;
		aspect-ratio: 1 / 1;
	}

	/* I pallini in riga, sotto le foto, al centro. */
	.fr-galleria__punti {
		position: static;
		height: auto;
		padding: 14px 0 0;
	}

	.fr-galleria__punti-dentro {
		position: static;
		flex-direction: row;
		justify-content: center;
	}

	body.fr-scheda .elementor-element-187a8ba7 > .elementor-widget-wrap {
		display: flex !important;
		flex-direction: column;
		padding: 24px var(--fr-lato, 16px) 40px !important;
	}

	body.fr-scheda .elementor-element-a295979 .product_title {
		font-size: 20px !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.fr-galleria__punto::before,
	.fr-scheda-voce > summary::after {
		transition: none;
	}
}

/* ---------------------------------------------------------------------------
 * Ritocchi dopo la prima prova (29/09)
 * ------------------------------------------------------------------------ */

/* Nessun rientro ereditato dentro la colonna: sul telefono il titolo stava in
   un blocco alto 125px e il prezzo aveva un margine negativo. */
body.fr-scheda .elementor-element-187a8ba7 .elementor-widget-container,
body.fr-scheda .elementor-element-5fdac4c > .elementor-element {
	margin: 0 !important;
	padding: 0 !important;
}

body.fr-scheda .elementor-element-490ba46 .price {
	margin-bottom: 16px !important;
}

/* L'ordine delle voci, uguale a tutte le larghezze: Elementor sul telefono
   mandava «Informazioni aggiuntive» in fondo (order 99999), dopo lo SKU. */
body.fr-scheda .fr-scheda-voce {
	order: 10;
}

body.fr-scheda .elementor-element-bde98d4 {
	order: 11 !important;
}

body.fr-scheda .elementor-element-ab0d1aa {
	order: 12 !important;
}

/* «Disponibile in negozio» allineato come il resto. */
body.fr-scheda .elementor-element-5660a6a,
body.fr-scheda .elementor-element-5660a6a .disponibile-in-negozio {
	justify-content: flex-start !important;
	text-align: left !important;
}

/* Le due voci a scomparsa uguali: stesso testo, stessa freccia, stesse righe. */
.fr-scheda-voce > summary {
	font-weight: 400;
}

body.fr-scheda .elementor-element-bde98d4 .e-n-accordion-item-title {
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	padding: 16px 0 !important;
	border: 0 !important;
	background: none !important;
}

body.fr-scheda .elementor-element-bde98d4 .e-n-accordion-item-title-text {
	color: #000 !important;
	font-size: 14px !important;
	font-weight: 400 !important;
	letter-spacing: 0 !important;
}

body.fr-scheda .elementor-element-bde98d4 .e-n-accordion-item-title-icon {
	display: none !important;
}

body.fr-scheda .elementor-element-bde98d4 .e-n-accordion-item-title::after {
	content: "";
	width: 10px;
	height: 10px;
	border-right: 1px solid #000;
	border-bottom: 1px solid #000;
	transform: translateY(-3px) rotate(45deg);
	transition: transform 0.2s ease;
}

body.fr-scheda .elementor-element-bde98d4 .e-n-accordion-item[open] > .e-n-accordion-item-title::after {
	transform: translateY(2px) rotate(-135deg);
}

body.fr-scheda .elementor-element-bde98d4 .e-n-accordion-item > [role="region"],
body.fr-scheda .elementor-element-bde98d4 .e-n-accordion-item > .e-con {
	padding: 0 0 16px !important;
	border: 0 !important;
}

body.fr-scheda .elementor-element-bde98d4 {
	border-top: 1px solid var(--fr-s-riga);
	border-bottom: 1px solid var(--fr-s-riga);
}

.fr-scheda-voce {
	margin-top: 24px;
}

@media (max-width: 1024px) {
	body.fr-scheda .elementor-element-187a8ba7 .elementor-element-2eacc3b {
		margin-bottom: 16px !important;
	}
}

body.fr-scheda .elementor-element-bde98d4 .e-n-accordion-item,
body.fr-scheda .elementor-element-bde98d4 .e-n-accordion-item-title,
body.fr-scheda .elementor-element-bde98d4 .e-n-accordion-item-title-header,
body.fr-scheda .elementor-element-bde98d4 .e-n-accordion-item-title-text {
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

body.fr-scheda .elementor-element-5660a6a .elementor-shortcode {
	display: block !important;
	text-align: left !important;
}

body.fr-scheda .elementor-element-5660a6a .disponibile-in-negozio {
	margin: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

body.fr-scheda .elementor-element-754437fb .stock {
	margin: 0 0 12px !important;
	font-size: 13px !important;
}

/*
 * Voce aperta (29/09, segnalato da Stefano): aprendo «Descrizione» la colonna
 * diventava più alta dello schermo e le voci andavano a capo in una seconda
 * colonna, fuori a destra — il contenitore di Elementor ha `flex-wrap: wrap`.
 * Qui: mai a capo, e la centratura verticale fatta con due spaziatori che si
 * annullano quando il contenuto supera l'altezza (con `justify-content:
 * center` l'inizio sarebbe finito tagliato sopra, irraggiungibile). La colonna
 * allora scorre al suo interno.
 */
body.fr-scheda .elementor-element-187a8ba7 > .elementor-widget-wrap {
	flex-wrap: nowrap !important;
	align-content: stretch !important;
	align-items: stretch !important;
	justify-content: flex-start !important;
}

@media (min-width: 1025px) {
	body.fr-scheda .elementor-element-187a8ba7 > .elementor-widget-wrap::before,
	body.fr-scheda .elementor-element-187a8ba7 > .elementor-widget-wrap::after {
		content: "";
		flex: 1 1 0;
		order: -1;
	}

	body.fr-scheda .elementor-element-187a8ba7 > .elementor-widget-wrap::after {
		order: 100;
	}
}

body.fr-scheda .elementor-element-187a8ba7 > .elementor-widget-wrap > * {
	flex-shrink: 0 !important;
}

/* L'elenco di «Informazioni aggiuntive» allineato e della stessa misura della descrizione. */
body.fr-scheda .elementor-element-bde98d4 .product-attributes-slugs,
body.fr-scheda .elementor-element-bde98d4 ul {
	margin: 0 !important;
	padding: 0 !important;
}

body.fr-scheda .elementor-element-bde98d4 .product-attributes-slugs li,
body.fr-scheda .elementor-element-bde98d4 li {
	margin: 0 0 4px !important;
	padding: 0 !important;
	font-size: 13px !important;
	line-height: 1.6 !important;
}

/*
 * Titoli sotto la scheda (Stefano 29/09): 20px d'aria in più sopra e sotto
 * «Prodotti Alternativi» (0e60979, era a 9px dalla galleria) e «Potrebbe
 * Piacerti Anche» (839cfd8). Con l'imbottitura e non col margine, che si
 * fonderebbe con quelli vicini.
 */
body.fr-scheda .elementor-element-0e60979,
body.fr-scheda .elementor-element-839cfd8 {
	padding-top: 20px !important;
	padding-bottom: 20px !important;
}

/* Sul telefono i due titoli erano a 35px come sul computer. */
@media (max-width: 767px) {
	body.fr-scheda .elementor-element-0e60979 .elementor-heading-title,
	body.fr-scheda .elementor-element-839cfd8 .elementor-heading-title {
		font-size: 24px !important;
		line-height: 1.25 !important;
	}
}

/*
 * «Potrebbe Piacerti Anche» compariva DUE volte: il titolo di Elementor
 * (839cfd8, tradotto) e quello scritto dentro lo shortcode
 * [potrebbe_piacerti_anche] (shortcodes.php, fisso in italiano anche sulle
 * pagine inglesi). Resta quello di Elementor; via anche i 30px che lo
 * shortcode metteva sopra le foto, così sotto il titolo c'è lo stesso spazio
 * di «Prodotti Alternativi».
 */
body.fr-scheda .potrebbe-piacerti-anche-container > .potrebbe-piacerti-title {
	display: none !important;
}

body.fr-scheda .potrebbe-piacerti-anche-container {
	margin-top: 0 !important;
}

@media (max-width: 767px) {
	/* Stesso spazio sotto il titolo di «Prodotti Alternativi» (56px). */
	body.fr-scheda .potrebbe-piacerti-anche-container {
		padding-top: 16px !important;
	}
}

/* Sopra «Prodotti Alternativi» lo stesso spazio che c'è sotto, fino alle foto
   (55px sul computer, 56 sul telefono): erano 29 e 22. */
body.fr-scheda .elementor-element-0e60979 {
	padding-top: 46px !important;
}

@media (max-width: 767px) {
	body.fr-scheda .elementor-element-0e60979 {
		padding-top: 54px !important;
	}
}
