/*
 * Mini cart (header button and drawer), the cart line items and totals the drawer shares with the cart page,
 * and the store notices. Loaded on every storefront page: the header and the drawer are everywhere.
 *
 * Every rule is scoped to the wrapper of a WooCommerce block. Those classes are built from block names
 * (wp-block-woocommerce-<block>), which WooCommerce keeps across releases; the wc-block-components-* classes
 * inside them are internal and change, so they only ever appear under such a wrapper.
 *
 * Moved here 2026-10-22 from Fluent Snippets 23 "Mini cart", 66 "Mini cart button in header" and 102 "Cart page"
 * (102 was unconditional, so its line-item rules always applied to the drawer as well).
 */

/* ── Header button ───────────────────────────────────────────────────────────── */

.wp-block-woocommerce-mini-cart .wc-block-mini-cart__button {
	cursor: pointer;
	opacity: 1 !important;
}

.wp-block-woocommerce-mini-cart .wc-block-mini-cart__button:hover:not([disabled]) {
	background-color: transparent;
	opacity: 1 !important;
}

/* The icon and the count's circle turn the accent under the pointer together, timed as the other icon buttons
   (global.css). The circle is filled with an inset shadow, not a background: WooCommerce picks the number's colour from
   the circle's background as the page starts, and a transition on the background left it transparent then (the number
   came out light on light); without one, the circle snapped back while the icon still faded (Kirill, 2026-10-22). */
.wp-block-woocommerce-mini-cart .wc-block-mini-cart__button svg {
	transition: color var(--gp-hover-out) ease;
}

.wp-block-woocommerce-mini-cart .wc-block-mini-cart__button .wc-block-mini-cart__badge {
	box-shadow: 0 0 0 2px #121212, inset 0 0 0 1em transparent; /* a ring of the header's colour: header.css */
	transition: box-shadow var(--gp-hover-out) ease;
}

.wp-block-woocommerce-mini-cart .wc-block-mini-cart__button:hover:not([disabled]) svg {
	color: var(--wp--preset--color--accent) !important;
}

.wp-block-woocommerce-mini-cart .wc-block-mini-cart__button:hover:not([disabled]) .wc-block-mini-cart__badge {
	box-shadow: 0 0 0 2px #121212, inset 0 0 0 1em var(--wp--preset--color--accent);
}

/* ── Drawer ──────────────────────────────────────────────────────────────────── */

/* WooCommerce draws a 1px line down the drawer's left edge (::after, border-left) to set it off from the page. On a
   phone the drawer is full width (is-mobile) and the line ran along the screen edge. The drawer is rendered outside
   the block, so no wrapper to scope by. Gone from WooCommerce's own CSS in 11.x; harmless there. */
.wc-block-mini-cart__drawer.is-mobile::after {
	border-left-width: 0;
}

/* On a phone, where the drawer is the screen's width, its sides are the page's 10px (layout.css): WooCommerce's 16px
   left the lines 6px narrower than the cart page's, and at 360px a 5-digit price ran under the quantity selector
   (2026-10-23) */
@media (max-width: 480px) {
	.wc-block-mini-cart__drawer .wp-block-woocommerce-mini-cart-contents :is(.wc-block-mini-cart__items, .wc-block-mini-cart__footer) {
		padding-left: var(--gp-phone-gutter);
		padding-right: var(--gp-phone-gutter);
	}

	.wc-block-mini-cart__drawer .wp-block-woocommerce-mini-cart-contents .wc-block-mini-cart__title {
		margin-left: var(--gp-phone-gutter);
		margin-right: var(--gp-phone-gutter);
	}
}

/* The drawer comes in once. WooCommerce 11 keeps the slide-out class on the overlay in both states, so opening runs
   its slide-in animation and also the slide-out class's 0.3s transition of the same transform (and the overlay's
   fade-in with an opacity transition). Chrome starts no transition under the running animation (checked); on
   Kirill's iPhone the drawer slid in twice, from the header button and on add to cart (2026-10-22), as if Safari
   played both. No transition while it opens; closing still slides it out. */
.wc-block-components-drawer__screen-overlay.wc-block-components-drawer__screen-overlay--with-slide-in,
.wc-block-components-drawer__screen-overlay--with-slide-in .wc-block-mini-cart__drawer.wc-block-components-drawer {
	transition: none;
}

/* Nothing floats over the open drawer: it covers the support chat's button and the catalog's "Фильтры" tab (the
   layers: overlays.css) */

/* WooCommerce 11 focuses the close button as soon as the drawer opens, so the button focus ring below (and
   WooCommerce's own blue one) circled the cross on every opening */
.wc-block-mini-cart__drawer .wc-block-components-drawer__close.wc-block-components-button:not(.is-link):focus {
	box-shadow: none;
}

.wp-block-woocommerce-filled-mini-cart-contents-block {
	background: var(--gp-panel-background); /* the panels' grey, the cards' #232323 (overlays.css) */
	font-family: 'Onest';
}

.wp-block-woocommerce-empty-mini-cart-contents-block {
	background: var(--gp-panel-background);
	font-family: 'Onest';
}

/* WooCommerce fades the title's last 24px (mask-image) over a 32px bottom padding, for the items scrolling under it;
   with that padding gone (ours, from snippet 23) the fade lay on the words themselves. Its size and line: the panels'
   head row (overlays.css), on the cross's line; clear of the cross at its end. */
.wp-block-woocommerce-mini-cart-contents h2.wc-block-mini-cart__title {
	padding-bottom: 0;
	padding-inline-end: 44px;
	-webkit-mask-image: none;
	mask-image: none;
}

/* Nothing over the head row: WooCommerce's empty notices took 16px and the title 40px of top margin, a quarter of a
   phone's screen with the cross alone in a row of its own (Kirill, 2026-10-23). A notice, when there is one, keeps
   its 16px. And the list straight under the head row: its first line's own 16px is the gap. */
.wc-block-mini-cart__drawer .wp-block-woocommerce-mini-cart-contents .wc-block-components-notices:not(:has(*)) {
	margin-top: 0;
}

.wc-block-mini-cart__drawer .wp-block-woocommerce-mini-cart-contents .wc-block-mini-cart__items {
	padding-top: 0;
}

/* No line and no fade over the total and the button: the list goes under them as under the head row at the top, the
   footer a plate of the panel's grey (Kirill, 2026-10-23: "полосу убрать, так мы больше места оставим под контент";
   then the fade went too, "просто плашка"). The button sits as far from the bottom as the drawer's sides (24px and a
   line above, 24px below). Above the home indicator on an iPhone. */
.wc-block-mini-cart__drawer .wp-block-woocommerce-mini-cart-contents .wc-block-mini-cart__footer {
	border-top: 0;
	padding-top: 16px;
	padding-bottom: max(16px, env(safe-area-inset-bottom, 0px));
}

@media (max-width: 480px) {
	.wc-block-mini-cart__drawer .wp-block-woocommerce-mini-cart-contents .wc-block-mini-cart__footer {
		padding-bottom: max(var(--gp-phone-gutter), env(safe-area-inset-bottom, 0px));
	}
}

/* "N шт." next to the title (wording in js/wc-strings.js and storefront.php) */
.wp-block-woocommerce-mini-cart-contents .wp-block-woocommerce-mini-cart-title-items-counter-block {
	color: var(--wp--preset--color--custom-font-gray);
}

.wp-block-woocommerce-mini-cart-contents .wc-block-mini-cart__footer .wc-block-mini-cart__footer-actions {
	gap: 0; /* the right edge of "proceed to checkout" lined up with nothing otherwise */
}

/* An empty <p> WordPress leaves behind in the block markup */
.wp-block-woocommerce-mini-cart-contents .wc-block-mini-cart__footer-actions > p:last-child:empty,
.wp-block-woocommerce-filled-mini-cart-contents-block > p:last-child:empty {
	display: none;
}

.wp-block-woocommerce-mini-cart-contents .wc-block-components-button.wp-block-woocommerce-mini-cart-checkout-button-block {
	border-radius: 30px;
	background-color: #C5FF00;
	color: #121212;
}

.wp-block-woocommerce-mini-cart-contents a.wc-block-components-button.wp-block-woocommerce-mini-cart-shopping-button-block {
	color: #121212;
}

/* ── Buttons, line items and totals: drawer and cart page ────────────────────── */

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-components-button:not(.is-link) {
	border-radius: 30px;
}

/* Not the outlined "view cart" button: WooCommerce keeps it transparent, and it shows up on keyboard focus.
   WooCommerce 11 calls it is-style-outline, 10.x called it outlined. */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-components-button:not(.is-link):not(.outlined):not(.is-style-outline) {
	background: #C5FF00;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-components-button:not(.is-link):hover {
	color: #121212;
	opacity: 0.9;
	border-radius: 30px;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-components-button:not(.is-link):focus {
	box-shadow: inset 0 0 0 1px rgb(197 255 0), 0 0 0 2px #000;
	outline: 3px solid transparent;
}

/* "View my cart": only "proceed to checkout" is offered */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-components-button:not(.is-link):is(.outlined, .is-style-outline):not(:focus) {
	display: none;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-components-totals-item__description {
	display: none !important;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-components-product-badge {
	display: none;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-cart-item__product .wc-block-components-product-metadata {
	display: none;
}

/* 96 x 36 (narrower below 393px: --gp-line-quantity, global.css), as tall as the cards' cart button and the wishlist's
   (the price beside it sits the same in both lists).
   WooCommerce gives the selector only a min-width (107px) and lets the number field grow to its own width, which Safari
   makes wider: 135px on Kirill's iPhone (2026-10-22). A fixed width and a field that only fills it. */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-components-quantity-selector {
	width: var(--gp-line-quantity);
	min-width: 0;
	height: 36px;
	border-radius: 10px;
	background: #333333;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input {
	flex: 1 1 0;
	width: 0;
	min-width: 0;
	padding: 0;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-components-quantity-selector::after {
	border: none;
}

/* The line's prices spaced as the cards' and the wishlist's (.woocommerce-Price-amount, cards.css). They had
   fixed-width figures, so a 1 stood as wide as an 8 and "1 110 ₽" read "1 1 1 0" (Kirill's iPhone, 2026-10-22). */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) :is(.wc-block-components-product-price__value, .wc-block-components-product-price__regular) {
	letter-spacing: -0.02em;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-components-product-price__value.is-discounted {
	margin: 0;
}

/* A sale price as on the cards and the product page: the price paid first, the old one after it, smaller and grey.
   The old one came first at full size, 4px away, and the two ran together (Kirill, 2026-10-22). The empty spans are
   the mini cart's price prefix and suffix, which would take a gap each. */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-cart-item__prices .wc-block-components-product-price > span:empty {
	display: none;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-cart-item__prices .wc-block-components-product-price__regular {
	order: 1;
	font-size: 16px;
	font-weight: 500;
	color: #7A7A7A;
}

.wp-block-woocommerce-cart .wc-block-cart-item__prices .wc-block-components-product-price {
	align-items: baseline;
	column-gap: 10px;
}

/* Narrow layouts: no per-line total. WooCommerce sets is-mobile on the drawer (outside the block) in the mini
   cart. On the cart page it sets a class by the block's width on the sidebar layout inside it: is-mobile up to 400px,
   is-small to 520px, is-medium to 920px, is-large wider. All but is-large take the drawer's narrow lines: WooCommerce's
   own for is-small and is-medium (a grid with an 80px picture column) left 428-430px iPhones with lines unlike the
   drawer's, and on 782-940px screens the wide table's 140px picture cell lay over the name and the price
   (2026-10-23). */
.is-mobile :is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__total .wc-block-components-formatted-money-amount,
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) :is(.is-mobile, .is-small, .is-medium) table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__total .wc-block-components-formatted-money-amount {
	display: none;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-cart-item__quantity {
	display: flex;
	align-items: center; /* the bin level with the quantity selector */
	gap: 12px;
}

/* Narrow lines, the drawer's and the cart page's below is-large: a 96px picture (smaller below 393px:
   --gp-line-picture, global.css) 16px from the text (the drawer's was 64px
   and 32px away: WooCommerce's 80px column holds 16px of padding, plus the 16px column gap) */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart :is(.is-mobile, .is-small, .is-medium)) table.wc-block-cart-items tr.wc-block-cart-items__row {
	grid-template-columns: var(--gp-line-picture) 1fr;
}

/* Without its total, the total's cell goes too, and the name, the price and the bin reach the line's right edge, as in
   the wishlist: WooCommerce spans them over two more columns, empty, and the gaps between them kept 16px clear */
:is(.is-mobile .wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart :is(.is-mobile, .is-small, .is-medium)) table.wc-block-cart-items .wc-block-cart-items__row td.wc-block-cart-item__total {
	display: none;
}

:is(.is-mobile .wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart :is(.is-mobile, .is-small, .is-medium)) table.wc-block-cart-items .wc-block-cart-items__row td.wc-block-cart-item__product {
	grid-column: 2 / -1;
}

/* The picture on the page's 10px, as the wishlist's: the table's default 2px between cells set the lines 2px in */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart :is(.is-mobile, .is-small, .is-medium)) table.wc-block-cart-items {
	border-spacing: 0;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart :is(.is-mobile, .is-small, .is-medium)) table.wc-block-cart-items .wc-block-cart-items__row td.wc-block-cart-item__image {
	padding-right: 0;
}

/* No line under the cart page's narrow lines, as in the drawer and the wishlist: 32px apart they read well (Kirill,
   2026-10-22). The promo code's own line still parts them from the totals; the last item's lay 2px above it.
   WooCommerce draws these up to 919px wide (outweighed here by a tag); wider, the table's header and its own lines
   stay. */
.wp-block-woocommerce-cart .wc-block-cart table.wc-block-cart-items:not(.wc-block-mini-cart-items) tr.wc-block-cart-items__row {
	border-bottom: 0;
}

/* ...and the text beside it in the picture's 96px, as the wishlist's rows (Kirill, 2026-10-22): the name at the top, in
   two lines at most; the price and the quantity (its minus the bin at one, below) on one row along the picture's
   bottom edge, the same place in
   every line; an old price just above the price paid. The price paid is as tall as the selector, so the two read as
   one line. WooCommerce stacks these in a column. The cart page's wide table (is-large) lays its lines out the same,
   larger and with the line's total in a column of its own (cart-page.css, 2026-10-23). */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart :is(.is-mobile, .is-small, .is-medium)) table.wc-block-cart-items .wc-block-cart-items__row td.wc-block-cart-item__product {
	align-self: stretch;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart .wc-block-components-sidebar-layout) table.wc-block-cart-items .wc-block-cart-item__wrap {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	grid-template-rows: auto 1fr auto;
	column-gap: 12px;
	row-gap: 0;
	min-height: var(--gp-line-picture);
	height: 100%;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart .wc-block-components-sidebar-layout) table.wc-block-cart-items .wc-block-cart-item__wrap > .wc-block-components-product-name {
	grid-column: 1 / -1;
	grid-row: 1;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	max-width: none; /* WooCommerce's max-content */
	margin-top: 2px; /* the picture's 12px corners take its top edge lower to the eye: the letters' top 6.7px under it,
	                    not 4.7px (Kirill, 2026-10-23: 4px left a two-line name and an old price too close, 5px apart by
	                    the letters, closer than the old price to its price); the wishlist's names the same */
	font-size: 16px; /* as the wishlist's names: the same spacing in both lists */
	line-height: 21px;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart .wc-block-components-sidebar-layout) table.wc-block-cart-items .wc-block-cart-item__wrap > .wc-block-cart-item__prices {
	grid-column: 1;
	grid-row: 3;
	align-self: end;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart .wc-block-components-sidebar-layout) table.wc-block-cart-items .wc-block-cart-item__wrap > .wc-block-cart-item__quantity {
	grid-column: 2;
	grid-row: 3;
	align-self: end;
	gap: 8px;
	margin: 0;
	padding: 0;
}

/* The picture as a block: in the line of text it left 5px under itself, and the lines grew to 101px, the selector below
   the picture's edge. Not the drawer's second picture, kept [hidden] for a product hidden from the catalog (a
   display: block showed both, 2026-10-22). */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart .wc-block-components-sidebar-layout) table.wc-block-cart-items td.wc-block-cart-item__image :is(a, img):not([hidden]) {
	display: block;
}

/* The old price above the price paid, both from the left, the old one as close to the price as the price's line
   allows (the proximity rule, gp-docs design/interface.md).
   WooCommerce's align-items: center (cart.css, table.wc-block-cart-items … .price) outweighed this and set the old one
   a few pixels in. */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart .wc-block-components-sidebar-layout) table.wc-block-cart-items .wc-block-cart-item__prices .wc-block-components-product-price {
	flex-direction: column-reverse;
	align-items: flex-start;
	gap: 0;
	font-size: var(--gp-line-price);
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart .wc-block-components-sidebar-layout) .wc-block-cart-item__prices .wc-block-components-product-price__value {
	font-size: var(--gp-line-price);
	line-height: 36px;
}

/* Weighed over WooCommerce's margin: 0 on the price's parts (cart.css, table.wc-block-cart-items … .price > *), which
   kept the old price where it was until 2026-10-22 */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart .wc-block-components-sidebar-layout) table.wc-block-cart-items .wc-block-cart-item__prices .wc-block-components-product-price__regular {
	margin-bottom: var(--gp-line-old-price-pull);
	font-size: var(--gp-line-old-price);
	line-height: 1.1;
}

/* Wider than a phone the drawer stays 480px (WooCommerce's --drawer-width; on a phone it is the screen's width), with
   room for a bigger price: 26px, the old one 15px (Kirill, 2026-10-22: 20px looked small there; 2026-10-23: 28px, the
   wide cart table's, left no air between a two-line name and an old price, 9px by the letters at 26px). The gap
   between them grows with the price, 6px between the glyphs (4.5px at 20px). The cart page's narrow lines on a screen
   as wide and the wishlist's rows the same (wishlist.css); the wide table's sizes: cart-page.css. Set as the sizes the
   rules above read (global.css), so each layout states only its numbers. */
@media (min-width: 481px) {
	.wc-block-mini-cart__drawer .wp-block-woocommerce-mini-cart-contents,
	.wp-block-woocommerce-cart :is(.is-small, .is-medium) {
		--gp-line-price: 26px;
		--gp-line-old-price: 15px;
		--gp-line-old-price-pull: -5px;
	}
}

/* A sale price's badge (js/cart-badges.js puts it after the price; its look: cards.css, "A sale price"). Not on a
   phone (Kirill, 2026-10-23): beside the price it needs 51px, and a 4-digit price leaves 33px before the quantity
   selector at 393px. Wider, the lines hold the price and the badge on one row under the old price, as the wishlist's;
   the badge sized by the price, as there. */
table.wc-block-cart-items .wc-block-cart-item__prices .gp-line-badge {
	display: none;
}

@media (min-width: 481px) {
	table.wc-block-cart-items .wc-block-cart-item__prices .gp-line-badge {
		display: inline-flex;
	}

	/* Weighed over cart-page.css's display: flex !important; the drawer's price without a sale is the [hidden] twin */
	:is(.wc-block-mini-cart__drawer .wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart .wc-block-components-sidebar-layout) table.wc-block-cart-items .wc-block-cart-item__prices .wc-block-components-product-price:not([hidden]) {
		display: grid !important;
		grid-template-columns: auto auto;
		justify-content: start;
		align-items: center;
		column-gap: 0.3em;
		font-size: var(--gp-line-price);
	}

	:is(.wc-block-mini-cart__drawer .wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart .wc-block-components-sidebar-layout) table.wc-block-cart-items .wc-block-cart-item__prices .wc-block-components-product-price > .wc-block-components-product-price__regular {
		grid-row: 1;
		grid-column: 1 / -1;
		justify-self: start;
	}

	:is(.wc-block-mini-cart__drawer .wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart .wc-block-components-sidebar-layout) table.wc-block-cart-items .wc-block-cart-item__prices .wc-block-components-product-price > .wc-block-components-product-price__value {
		grid-row: 2;
		grid-column: 1;
		white-space: nowrap;
	}

	:is(.wc-block-mini-cart__drawer .wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart .wc-block-components-sidebar-layout) table.wc-block-cart-items .wc-block-cart-item__prices .wc-block-components-product-price > .gp-line-badge {
		grid-row: 2;
		grid-column: 2;
	}
}

/* The remove link as a bin: lucide's outline one (global.css), lighter than what it stands next to (Kirill, 2026-10-22:
   the filled bin outweighed the cards' cart button); the same bin in the wishlist. 36px to tap, as tall as the quantity
   selector. Grey and bare where a line has no selector (a product sold one at a time); with one, it is the selector's
   minus (below). */
/* Weighed over WooCommerce's (cart.css: color: inherit; display: inline) */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-cart-item__remove-link {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 36px;
	height: 36px;
	padding: 0;
	margin: 0 !important; /* over the theme's margin-left: .5rem !important; the old 4px top margin set it below the selector */
	border: none;
	background: none;
	color: #7A7A7A;
	cursor: pointer;
	overflow: hidden;
	transition: color var(--gp-hover-out) ease;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items .wc-block-cart-item__remove-link::before {
	content: "";
	flex: none;
	width: 20px;
	height: 20px;
	background-color: currentColor;
	-webkit-mask: var(--gp-icon-trash) center / contain no-repeat;
	mask: var(--gp-icon-trash) center / contain no-repeat;
}

/* WooCommerce 11's own bin (an svg in the text colour, unseen while that colour was transparent) and the old text */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-cart-item__remove-link :is(svg, span) {
	display: none;
}

@media (hover: hover) {
	:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity .wc-block-cart-item__remove-link:hover {
		color: var(--wp--preset--color--primary);
	}
}

/* With a selector, the bin takes the minus's place while the quantity is at its least, where WooCommerce disables the
   minus: it stood at the line's edge beside the plus (Kirill, 2026-10-23: "в корзинах использовать удаление на месте
   минуса"; the wishlist keeps a bin of its own, before its cart button). In the selector's colours, as its plus. Above
   the least the minus is back and the bin goes: the line empties one by one. Not a bundle's products, whose selector
   shows only "× N" (their minus hidden, no remove link). The minus is disabled by the quantity alone, not while the cart
   saves a change (checked in the drawer and on the cart page, 2026-10-23), so the bin does not flash mid-request. */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity {
	position: relative;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity:has(.wc-block-components-quantity-selector:not([hidden]) .wc-block-components-quantity-selector__button--minus:not([hidden]):disabled) .wc-block-cart-item__remove-link {
	position: absolute;
	top: 0;
	left: 0;
	width: 32px; /* the minus's 30px and the selector's frame */
	color: inherit;
	opacity: 0.6; /* WooCommerce's, as the plus */
	transition: opacity var(--gp-hover-out) ease;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity:has(.wc-block-components-quantity-selector:not([hidden]) .wc-block-components-quantity-selector__button--minus:not([hidden]):disabled) .wc-block-cart-item__remove-link::before {
	width: 16px; /* beside the selector's 14px figures */
	height: 16px;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity:has(.wc-block-components-quantity-selector:not([hidden]) .wc-block-components-quantity-selector__button--minus:not([hidden]):disabled) .wc-block-components-quantity-selector__button--minus {
	visibility: hidden;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity:has(.wc-block-components-quantity-selector:not([hidden]) .wc-block-components-quantity-selector__button--minus:not([hidden]):not(:disabled)) .wc-block-cart-item__remove-link {
	display: none;
}

@media (hover: hover) {
	:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity:has(.wc-block-components-quantity-selector:not([hidden]) .wc-block-components-quantity-selector__button--minus:not([hidden]):disabled) .wc-block-cart-item__remove-link:hover {
		opacity: 1;
	}
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-cart-items .wc-block-cart-items__row td:first-child,
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-cart-items .wc-block-cart-items__header th:first-child {
	text-align: left;
	padding-left: 0 !important;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-cart-items .wc-block-cart-items__row td:last-child,
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-cart-items .wc-block-cart-items__header th:last-child {
	padding-right: 0 !important;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) .wc-block-cart-items .wc-block-cart-items__row img {
	border-radius: 12px;
}

/* ── Bundles (WPC Product Bundles) ───────────────────────────────────────────── */

/* A bundle is its own line (woosb-bundles) followed by a line per product in it (woosb-bundled). Those came out as
   full lines, each with the bundle's name before its own, an old price, a badge and a quantity box that does nothing
   (Kirill, 2026-10-23: "вложенные товары мельче показывать... и с отступом"). Now they are small lines under the
   bundle's: a smaller picture, the name, the price paid and "× N". Their text starts where the bundle's does, the
   picture beside it ending where the bundle's picture ends: all the text in one column, the bundled lines' smaller
   (Kirill, the same day, after an indent by the whole picture and by half of it: "подстроить левый край текста"). The
   old price and the badge are the bundle's own line's; the wide table's total too (cart-page.css). */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items {
	--gp-line-picture-column: var(--gp-line-picture); /* the bundle's picture, taken here before the bundled lines'
	                                                     smaller one */
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items tr.wc-block-cart-items__row.woosb-bundled {
	--gp-line-picture: 56px;
	--gp-line-price: 16px;
}

@media (max-width: 480px) {
	:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items tr.wc-block-cart-items__row.woosb-bundled {
		--gp-line-picture: 48px;
	}
}

/* Narrow lines: the bundle's picture column, the smaller picture at its end; 12px apart and from the bundle, the
   bundle's group 32px from the next line as any line */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart :is(.is-mobile, .is-small, .is-medium)) table.wc-block-cart-items tr.wc-block-cart-items__row.woosb-bundled {
	grid-template-columns: var(--gp-line-picture-column) 1fr;
	padding: 0 0 12px;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart :is(.is-mobile, .is-small, .is-medium)) table.wc-block-cart-items tr.wc-block-cart-items__row.woosb-bundled td.wc-block-cart-item__image {
	justify-self: end;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart :is(.is-mobile, .is-small, .is-medium)) table.wc-block-cart-items tr.wc-block-cart-items__row.woosb-bundled td.wc-block-cart-item__image img {
	width: var(--gp-line-picture); /* WooCommerce's 100% of a cell now as wide as its picture */
	height: var(--gp-line-picture);
	object-fit: cover;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart :is(.is-mobile, .is-small, .is-medium)) table.wc-block-cart-items tr.wc-block-cart-items__row.woosb-bundles:has(+ .woosb-bundled) {
	padding-bottom: 12px;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart :is(.is-mobile, .is-small, .is-medium)) table.wc-block-cart-items tr.wc-block-cart-items__row.woosb-bundled:not(:has(+ .woosb-bundled)) {
	padding-bottom: 16px;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items tr.wc-block-cart-items__row.woosb-bundled td.wc-block-cart-item__image img {
	border-radius: 8px;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items tr.wc-block-cart-items__row.woosb-bundled .wc-block-cart-item__wrap > .wc-block-components-product-name {
	margin-top: 0;
	font-size: 14px;
	line-height: 18px;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items tr.wc-block-cart-items__row.woosb-bundled .wc-block-cart-item__prices :is(.wc-block-components-product-price__regular, .gp-line-badge) {
	display: none;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items tr.wc-block-cart-items__row.woosb-bundled .wc-block-cart-item__prices .wc-block-components-product-price__value {
	line-height: 20px;
}

/* The quantity, fixed by the bundle, as "× 1": the plugin leaves a box without buttons that takes no input */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items tr.wc-block-cart-items__row.woosb-bundled .wc-block-components-quantity-selector {
	width: auto;
	height: auto;
	border: 0; /* WooCommerce 11's 1px frame */
	border-radius: 0;
	background: none;
	color: #7A7A7A;
	font-size: 14px;
	line-height: 20px;
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items tr.wc-block-cart-items__row.woosb-bundled .wc-block-components-quantity-selector::before {
	content: "×\00a0";
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items tr.wc-block-cart-items__row.woosb-bundled .wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input {
	flex: none;
	width: 2ch;
	height: auto;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	font: inherit;
	text-align: left;
}

/* The bundle's own price: the plugin hides the bundle line's price (its value is 0) and prints the bundle's as the
   price's prefix, which showed only in the wide table's total; the drawer's line had none. The prefix as the price
   paid, the old price above it (the products' prices together), the badge from the two (js/cart-badges.js). A bundle
   of a fixed price keeps the plugin's own. */
:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items tr.wc-block-cart-items__row.woosb-bundles:not(.woosb-fixed-price) .wc-block-cart-item__prices {
	display: flex !important; /* over the plugin's display: none !important (woo-product-bundle/assets/css/blocks.css) */
}

:is(.wp-block-woocommerce-mini-cart-contents, .wp-block-woocommerce-cart) table.wc-block-cart-items tr.wc-block-cart-items__row.woosb-bundles:not(.woosb-fixed-price) .wc-block-cart-item__prices .wc-block-components-product-price {
	line-height: 36px; /* the prefix's line, as the price's value elsewhere */
}

/* ── Store notices ───────────────────────────────────────────────────────────── */

/* "Открыть корзину" in a notice (the words: storefront/strings.php): an underlined link at the right, the same under
   the pointer as without it (Kirill, 2026-10-22: it reads as a button; its underline vanishing on hover was odd).
   Snippet 71 hid it and 102 showed it again with !important; it stays. The theme's .woocommerce a.button capitalised
   it and, under the pointer, framed it in the accent and spaced its letters, so it grew (the spacing: global.css);
   WooCommerce dims it to 70% until hovered and the theme dashes its underline. */
.wc-block-components-notice-banner > .wc-block-components-notice-banner__content .wc-forward,
.wc-block-components-notice-banner > .wc-block-components-notice-banner__content .wc-forward:is(:hover, :focus) {
	display: flex !important;
	padding: 0;
	border: 0;
	opacity: 1;
	text-decoration: underline solid;
	text-transform: none;
}