/*
 * Correzioni di visualizzazione comuni a tutti i siti figli (caricato da functions.php del child).
 * Correggono regole dei CSS per sito (css/global_medrop.css, CSS aggiuntivo del Customizer) che non sono nel
 * repo e cambiano da sito a sito: qui, a parte, valgono per tutti. !important perché gli @import di style.css
 * arrivano in ordine non garantito rispetto a questo file.
 */

/* Scheda prodotto: global_medrop.css la fissa a 82rem (1312px) a ogni larghezza: su mobile usciva dallo schermo
   (prezzo, pulsante e "Categorie" tagliati a destra), su desktop non era allineata al resto. Larga quanto lo
   spazio disponibile; da 768px al massimo 1240px e centrata, come descrizione e correlati (sotto). */
html body .single-product-wrapper.et-clearfix {
	width: 100% !important;
	max-width: 100% !important;
}

/* Card prodotto (shop, categorie, home, correlati, carrello): nome, prezzo e "Prezzo precedente" stavano a 0-1px dal
   bordo della card. Margine interno uniforme; i 5px che il tema dava solo a nome e prezzo non servono più.
   Selettore con .type-product e .et-clearfix per battere il padding: 0 !important del tema da 1280px
   (.medium .loop-products .product .post-body) e valere anche per le card dei caroselli (ul senza classe). */
li.product.type-product div.post-body.et-clearfix {
	padding-left: 10px !important;
	padding-right: 10px !important;
}
li.product.type-product .post-body h4.post-title,
li.product.type-product .post-body .price,
li.product.type-product .post-body .price bdi {
	margin-left: 0 !important;
}
/* nomi lunghi: il tema tiene una riga sola e taglia a metà parola; meglio una riga con "…". min-width: 0 sulla card
   e sul corpo, altrimenti in griglia il nome su una riga allarga la colonna (card accavallate nei caroselli). */
li.product.type-product,
li.product.type-product .post-inner,
li.product.type-product div.post-body.et-clearfix {
	min-width: 0 !important;
	max-width: 100%;
}
li.product.type-product .post-body h4.post-title,
li.product.type-product .post-body h4.post-title a {
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	display: block;
}

/* "Prezzo precedente" del plugin wc-price-history nelle card (correlati e caroselli): global_medrop.css lo mette in
   posizione assoluta e finiva sopra il pulsante o sulle scritte; nelle card torna subito sotto il prezzo. */
li.product.type-product .post-body .wc-price-history.prior-price {
	position: static !important;
	top: auto !important;
	height: auto !important;
	line-height: 1.4 !important;
	padding: 0 !important;
	margin: 4px 0 0 0 !important;
	font-size: 10px !important;
}

/* "Prezzo precedente" (Omnibus) nel riepilogo prodotto: global_medrop.css lo posiziona in assoluto a una distanza
   fissa dal titolo; con titoli su più righe finiva sopra le stelline (mobile) o sopra il prezzo (farmashop24 desktop).
   Ovunque torna al suo posto nel flusso, subito sotto il prezzo. */
.single-product-wrapper .summary .wc-price-history.prior-price {
	position: static !important;
	top: auto !important;
	height: auto !important; /* templatedue.css (farmashop24, pharmaigea) la mette a 0 */
	line-height: 1.4 !important;
	padding: 0 !important;
	margin: 0 0 12px 0 !important;
}

/* Pagina prodotto: descrizione, correlati e upsell non più larghi quanto tutto lo schermo (fino a 1408px su 1440):
   al massimo quanto il contenuto dell'header (e mai oltre lo schermo meno 24px per lato), centrati. Da 768px in giù
   valgono le regole mobile del child (only_single_product.css).
   I correlati stanno fuori da .single-product-description: per loro basta la classe del body. */
@media (min-width: 768px) {
	html body .single-product-wrapper.et-clearfix,
	.single-product-description .woocommerce-tabs,
	body.single-product section.related,
	body.single-product section.upsells {
		max-width: min(1240px, calc(100% - 48px)) !important;
		margin-left: auto !important;
		margin-right: auto !important;
		box-sizing: border-box;
	}
}

/* Pagine (carrello, account…): il contenuto sta in un contenitore flex e senza min-width: 0 si allargava quanto il
   carosello di prodotti in fondo (1076px fissi su farmashop24 anche a 390px: card tagliate ai lati). */
.page-content-wrap .container > .page.type-page {
	min-width: 0 !important;
	max-width: 100%;
}
/* tabella del carrello: non oltre il suo modulo (a 1024px finiva 8px sotto il riquadro dei totali) */
.woocommerce-cart-form table.shop_table {
	max-width: 100% !important;
}

@media (max-width: 767px) {
	/* quantità e "Aggiungi al carrello": il margine negativo pensato per il desktop li portava fuori dallo schermo */
	.single-product-wrapper .summary .single_product_medrop_wrapper {
		margin-left: 0 !important;
	}

	/* descrizione giustificata: su schermo stretto lascia buchi enormi fra le parole */
	.woocommerce-Tabs-panel,
	.woocommerce-Tabs-panel .overflow-x,
	.woocommerce-Tabs-panel p {
		text-align: left !important;
	}
}
