/* Product button: full width, 44 px target, plus icon (the product page's buy bar). In product cards it is a round cart
   icon instead, see the end of this file. */
/* Doubled class: WooCommerce centres the button with a two-class selector. */
.wp-block-woocommerce-product-button.wc-block-components-product-button { margin: 0; width: 100%; align-items: stretch; }
.wp-block-woocommerce-product-button.wc-block-components-product-button .wp-block-button__link {
	position: relative; z-index: 1; /* above the card-wide title link */
	display: inline-flex; align-items: center; justify-content: center; gap: .375rem;
	width: 100%; min-height: 44px; padding: .5rem .75rem;
	font-size: var(--wp--preset--font-size--sm);
}
.wp-block-woocommerce-product-button .add_to_cart_button::before {
	content: ''; width: 1.125rem; height: 1.125rem; flex: none; background: currentColor;
	-webkit-mask: url("../../img/icons/plus.svg") center / contain no-repeat;
	mask: url("../../img/icons/plus.svg") center / contain no-repeat;
}
.wp-block-woocommerce-product-button .add_to_cart_button.loading::before {
	-webkit-mask-image: url("../../img/mark.svg"); mask-image: url("../../img/mark.svg");
	transform-origin: 50% 100%; animation: bm-loader-hop .9s var(--wp--custom--ease) infinite; /* keyframes in base.css */
}
@media (prefers-reduced-motion: reduce) {
	.wp-block-woocommerce-product-button .add_to_cart_button.loading::before { animation: bm-loader-fade 1.6s ease-in-out infinite !important; }
}
.wp-block-woocommerce-product-button .added_to_cart { display: block; margin-top: .375rem; font-size: var(--wp--preset--font-size--xs); font-weight: 600; text-align: center; }

/* Product cards: a 44 px round cart icon beside the price (references: Silpo, Novus, Fora). The label stays for screen
   readers (the button's aria-label names the product); the number already in the cart shows as a badge on the icon
   (bm-card__qty, added in inc/woocommerce.php). "Zobacz koszyk" goes: the header cart and the tab bar lead there. */
.bm-card__add.wp-block-woocommerce-product-button.wc-block-components-product-button { width: auto; }
.bm-card__add.wp-block-woocommerce-product-button .wp-block-button__link {
	width: 44px; height: 44px; min-height: 0; padding: 0; border-radius: 50%;
	overflow: visible; /* WooCommerce clips the button for its label animation; the label is hidden here, the badge is not */
}
/* Doubled class: on the cart page WooCommerce's cart.css repeats the product button rules (width: auto, overflow: hidden)
   after this file at the same specificity; they shrank the icon to a 20 x 44 oval and clipped the quantity badge. */
.bm-card__add.bm-card__add.wp-block-woocommerce-product-button .wp-block-button__link { width: 44px; overflow: visible; }
.bm-card__add .wp-block-button__link:hover { background: color-mix(in srgb, var(--wp--preset--color--accent) 80%, #000); }
.bm-card__add .wp-block-button__link:focus-visible { outline: 3px solid var(--wp--preset--color--ink); outline-offset: 2px; }
.wp-block-woocommerce-product-button.bm-card__add .add_to_cart_button::before {
	width: 1.375rem; height: 1.375rem; margin-left: -2px; /* the cart's handle makes it look off centre */
	-webkit-mask-image: url("../../img/icons/cart.svg"); mask-image: url("../../img/icons/cart.svg");
}
.bm-card__add .wp-block-button__link > span:not(.bm-card__qty) {
	position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}
.bm-card__qty {
	position: absolute; top: -5px; right: -5px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px;
	background: #fff; color: #C10230; box-shadow: 0 0 0 2px #C10230; /* the button's crimson in both themes */
	font-size: .6875rem; font-weight: 800; line-height: 20px; text-align: center; font-variant-numeric: tabular-nums;
}
.bm-card__qty[hidden] { display: none; }
/* The whole wrapper of the link: once shown, its empty box plus the flex gap pushed the notes under the price down. */
.wp-block-woocommerce-product-button.bm-card__add > span { display: none; }
/* A product that cannot be added ("Szczegóły"): the whole card already links to its page. */
.bm-card__add:not(:has(.add_to_cart_button)) { display: none; }
