/*
 * Pullassu — botiga (només amb WooCommerce). Mateixa capçalera i peu que la web; el
 * contingut sobre blanc ve de l'estil de secció "Paper" (styles/sections/paper.json).
 * Aquí: capçalera de la botiga, targetes de producte i detalls dels blocs de WooCommerce.
 */

body.pullassu-botiga {
	font-variant-numeric: lining-nums;
	--pullassu-targeta-fons: var(--wp--preset--color--paper-2);
	--pullassu-regle: var(--wp--preset--color--regle);
	/* WooCommerce fa servir aquestes mides a la cistella i al checkout. */
	--wp--preset--font-size--small: 17px;
	--wp--preset--font-size--x-small: 15px;
}
/* El gra només sobre la nit: aquí taparia el blanc. */
body.pullassu-botiga::after { display: none; }
.is-style-paper ::selection { background: var(--wp--preset--color--pissarra); color: var(--wp--preset--color--paper); }
.is-style-paper :focus-visible { outline-color: var(--wp--preset--color--pissarra); }
.wp-site-blocks > main.is-style-paper { min-height: 60vh; }
/* El peu ja no surt de la nit: un pas de transició. */
body.pullassu-botiga .is-style-arbres { margin-top: 0 !important; background-color: var(--wp--preset--color--paper); }
body.pullassu-botiga .wp-site-blocks > * + * { margin-block-start: 0; }

/* ---------- Capçalera: logo + "Botiga", menú i minicistella ---------- */
/* Sense portada fosca a sota: opaca i enganxada a dalt (no fixa), i el contingut comença després. */
.wp-site-blocks > .wp-block-template-part:has(> .pullassu-capcalera-botiga) { position: sticky; top: 0; z-index: 40; }
.admin-bar .wp-site-blocks > .wp-block-template-part:has(> .pullassu-capcalera-botiga) { top: 32px; }
@media (max-width: 782px) { .admin-bar .wp-site-blocks > .wp-block-template-part:has(> .pullassu-capcalera-botiga) { top: 46px; } }
.pullassu-capcalera.pullassu-capcalera-botiga { position: static; background: var(--wp--preset--color--nit); border-color: var(--wp--preset--color--nit); }
body.pullassu-botiga .wp-site-blocks > main { padding-top: var(--wp--preset--spacing--60) !important; }
.pullassu-capcalera .wc-block-mini-cart__button { color: var(--wp--preset--color--fum); padding: 8px 4px; }
.pullassu-capcalera .wc-block-mini-cart__button:hover { color: var(--wp--preset--color--os); }
.pullassu-capcalera .wc-block-mini-cart__badge { background: var(--wp--preset--color--espelma); color: var(--wp--preset--color--nit); font-weight: 600; }
}

/* ---------- Seccions de la portada ---------- */
.pullassu-seccio-botiga {
	margin-top: var(--wp--preset--spacing--60) !important; padding-top: 16px;
	border-top: 1px solid var(--pullassu-regle); scroll-margin-top: calc(var(--pullassu-capcalera) + 24px);
}
main .pullassu-seccio-botiga:first-of-type,
main > .wp-block-woocommerce-store-notices + .pullassu-seccio-botiga { margin-top: 0 !important; padding-top: 0; border-top: 0; }
.wp-block-pullassu-ofertes { margin-top: var(--wp--preset--spacing--60); }

/* ---------- Targetes de producte ---------- */
.wc-block-product-template .wc-block-product {
	position: relative; display: flex; flex-direction: column; gap: 0;
	padding: 14px; background: var(--pullassu-targeta-fons);
}
.wc-block-product .wc-block-components-product-image img { aspect-ratio: 1; object-fit: cover; background: var(--wp--preset--color--paper); }
.wc-block-product .wp-block-post-title {
	margin: .6em 0 .4em; font-family: var(--wp--preset--font-family--garamond); font-weight: 500;
	font-size: 21px; line-height: 1.25; letter-spacing: 0;
}
.wc-block-product .wp-block-post-title a { text-decoration: none; }
.wc-block-product .wp-block-woocommerce-product-price {
	display: flex; flex-wrap: wrap; align-items: center; column-gap: .3em;
	min-height: 40px; margin: auto 0 0 !important; padding-right: 48px; font-size: 1.05em; text-align: left;
	font-variant-numeric: lining-nums tabular-nums;
}
/* El botó: un quadrat amb el carret a baix a la dreta (el text, per als lectors de pantalla). */
.wc-block-product .wp-block-woocommerce-product-button { position: static; margin: 0 !important; }
.wc-block-product .wc-block-components-product-button__button,
.wc-block-product .pullassu-carret {
	position: absolute; right: 14px; bottom: 14px; width: 40px !important; min-width: 0; height: 40px; min-height: 0; margin: 0 !important;
	padding: 0 !important; overflow: hidden; font-size: 0 !important; line-height: 0 !important;
	letter-spacing: 0 !important; color: transparent !important;
}
.wc-block-product .wc-block-components-product-button__button::before {
	content: ""; position: absolute; inset: 0; margin: auto; width: 22px; height: 22px;
	background: var(--wp--preset--color--paper); transition: background .3s;
	mask: var(--pullassu-icona-carret) center / contain no-repeat;
}
.wc-block-product .wc-block-components-product-button__button:hover::before { background: var(--wp--preset--color--nit); }
.wc-block-product .wc-block-components-product-button__button.loading::before { opacity: .35; }
.wc-block-product .wc-block-components-product-button__button.added::before { --pullassu-icona-carret: var(--pullassu-icona-fet); }
.wc-block-product .wc-block-components-product-button__button::after,
.wc-block-product .added_to_cart { display: none !important; }
:root {
	--pullassu-icona-fet: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E");
}

/* Targetes petites (Articles, categories, cerca) i al mòbil, a dues columnes. */
.pullassu-petits .wc-block-product-template { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)) !important; gap: 1.5em 1em !important; }
.pullassu-petits .wc-block-product { padding: 10px; }
.pullassu-petits .wc-block-product .wp-block-post-title { font-size: 17px; }
.pullassu-petits .wc-block-product .wp-block-woocommerce-product-price { min-height: 36px; padding-right: 42px; font-size: 16px; }
.pullassu-petits .wc-block-product .wc-block-components-product-button__button,
.pullassu-petits .wc-block-product .pullassu-carret { right: 10px; bottom: 10px; width: 36px !important; height: 36px; }
@media (max-width: 600px) {
	.wc-block-product-template,
	.pullassu-petits .wc-block-product-template { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 1em .75em !important; }
	.wc-block-product-template .wc-block-product { padding: 10px; }
	.wc-block-product .wp-block-post-title { font-size: 17px; }
	.wc-block-product .wp-block-woocommerce-product-price { min-height: 36px; padding-right: 42px; font-size: 16px; }
	.wc-block-product .wc-block-components-product-button__button,
	.wc-block-product .pullassu-carret { right: 10px; bottom: 10px; width: 36px !important; height: 36px; }
}

/* ---------- Fitxa ---------- */
/* Les imatges verticals, quadrades (la lupa i la vista ampliada, l'original). */
.wp-block-woocommerce-product-image-gallery .woocommerce-product-gallery__image img,
.wp-block-woocommerce-product-gallery img { aspect-ratio: 1; object-fit: cover; width: 100%; height: auto; }
.single-product .wp-block-post-title { margin-top: 0; }
.wp-block-woocommerce-product-price { font-variant-numeric: lining-nums tabular-nums; }
.wp-block-woocommerce-add-to-cart-with-options { margin-top: var(--wp--preset--spacing--40); }
.wp-block-woocommerce-product-details.is-style-minimal .wc-tabs li a { text-decoration: none; }
.wp-block-woocommerce-product-details .woocommerce-Tabs-panel h2 { font-size: var(--wp--preset--font-size--gran); margin-bottom: .6em; }

/* ---------- Botons i camps de WooCommerce sobre paper ---------- */
.is-style-paper .wc-block-components-button:not(.is-link),
.is-style-paper .wc-block-components-product-button__button {
	background: var(--wp--preset--color--pissarra); color: var(--wp--preset--color--paper);
	border: 1px solid var(--wp--preset--color--pissarra); border-radius: 0;
	font-family: var(--wp--preset--font-family--fell-versaletes); letter-spacing: .16em;
}
.is-style-paper .wc-block-components-button:not(.is-link):hover { background: var(--wp--preset--color--espelma); border-color: var(--wp--preset--color--espelma); color: var(--wp--preset--color--nit); }
.is-style-paper :is(input[type=text], input[type=email], input[type=tel], input[type=number], select, textarea):not(.wc-block-components-quantity-selector__input),
.is-style-paper .wc-block-components-text-input input,
.is-style-paper .wc-blocks-components-select select { border-radius: 0; }
.is-style-paper .wc-block-components-quantity-selector { border-radius: 0; }
.is-style-paper .wc-block-components-quantity-selector::after { border-radius: 0; }
.is-style-paper .wc-block-components-totals-item__label,
.is-style-paper .wc-block-components-product-name { color: var(--wp--preset--color--pissarra); }
.is-style-paper :is(.wc-block-components-notice-banner) { border-radius: 0; }