/*
 * Site-wide rules: ones that came with a group but reach beyond it (kept exactly as they were until each is checked
 * where it applies; then it moves to its group or goes), and ones that every checkout shares.
 */

/* The storefront's icons: lucide's (lucide.dev), 24px boxes with 2px round strokes, the set of the support chat's
   cross. One set, so the icons beside each other weigh alike (Kirill, 2026-10-22: the cards' cart and the bin were
   from different sets, the bin the heavier). Drawn as masks in the text colour:
   mask: var(--gp-icon-x) center / 20px no-repeat; background-color: currentColor. */
:root {
	--gp-icon-x: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18'/%3E%3Cpath d='m6 6 12 12'/%3E%3C/svg%3E");
	--gp-icon-cart: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='21' r='1'/%3E%3Ccircle cx='19' cy='21' r='1'/%3E%3Cpath d='M2.05 2.05h2l2.66 12.42a2 2 0 0 0 2 1.58h9.78a2 2 0 0 0 1.95-1.57l1.65-7.43H5.12'/%3E%3C/svg%3E");
	--gp-icon-trash: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18'/%3E%3Cpath d='M19 6v14c0 1-1 2-2 2H7c-1 0-2-1-2-2V6'/%3E%3Cpath d='M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2'/%3E%3Cpath d='M10 11v6'/%3E%3Cpath d='M14 11v6'/%3E%3C/svg%3E");
	--gp-icon-copy: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='14' height='14' x='8' y='8' rx='2' ry='2'/%3E%3Cpath d='M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2'/%3E%3C/svg%3E");
	--gp-icon-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
	--gp-icon-arrow-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='m12 5 7 7-7 7'/%3E%3C/svg%3E");
	--gp-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E");
	--gp-icon-user: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='5'/%3E%3Cpath d='M20 21a8 8 0 0 0-16 0'/%3E%3C/svg%3E");
	--gp-icon-menu: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6h16'/%3E%3Cpath d='M4 12h16'/%3E%3Cpath d='M4 18h16'/%3E%3C/svg%3E");
}

/* Hover: in almost at once, out slowly (Kirill, 2026-10-22: quick to answer the pointer, and no jerk as it leaves). The
   storefront's transitions run --gp-hover-out; under the pointer they run --gp-hover-in: on the element itself, and on
   everything inside a card, a link or a button the pointer is over (a card's cart button turns the accent with the
   card). A transition takes the duration of the state it goes to, so the two ends get their own. */
:root {
	--gp-hover-in: 0.12s;
	--gp-hover-out: 0.3s;
}

/* The list lines' sizes (the cart's, the mini cart's, the wishlist's): the picture, the price paid, the old price and
   the quantity selector, as at 393px and wider, and smaller with the screen below it, down to 360px (Kirill,
   2026-10-23). At 360px a 5-digit price broke onto two lines beside the quantity selector; now it keeps 23px before
   it. Wider than a phone the price is 28px (cart-common.css, wishlist.css). */
:root {
	--gp-line-picture: clamp(80px, 24.43vw, 96px);
	--gp-line-quantity: clamp(80px, 24.43vw, 96px);
	--gp-line-price: clamp(18px, 5.09vw, 20px);
	--gp-line-old-price: clamp(13px, 3.56vw, 14px);
	/* the old price's pull towards the price under it: a smaller price in the same 36px line leaves more air above it.
	   4.5px between their glyphs at 360px and 393px, up to 5.7px between them, where the fractional sizes land on
	   the pixel grid; a fixed -8px gave up to 5.9px. */
	--gp-line-old-price-pull: calc(-8px - (20px - var(--gp-line-price)) * 0.65);
}

a {
	transition-duration: var(--gp-hover-out); /* the theme's 0.5s, both ways */
}

@media (hover: hover) {
	:is(a, button, [role="button"], li.wc-block-product, .cross-sells-product, .wc-block-grid__product, .ctpl-card, .woosw-copy-url, .woosw-item--remove span):hover,
	:is(a, button, [role="button"], li.wc-block-product, .cross-sells-product, .wc-block-grid__product, .ctpl-card, .woosw-copy-url, .woosw-item--remove span):hover::before,
	:is(a, button, [role="button"], li.wc-block-product, .cross-sells-product, .wc-block-grid__product, .ctpl-card, .woosw-copy-url, .woosw-item--remove span):hover::after,
	:is(a, button, [role="button"], li.wc-block-product, .cross-sells-product, .wc-block-grid__product, .ctpl-card):hover :is(*, *::before, *::after) {
		transition-duration: var(--gp-hover-in) !important; /* over the components' own durations */
	}
}

/* From snippet 57 "Gallery Adjustments" (2026-10-22). Not in the static HTML of any page checked (5 product pages,
   category, fronts, search, /media/): probably the gallery dialog's full-size image, but wp_get_attachment_image()
   gives this class to any full-size image, blog posts included. */
img.attachment-full {
	width: 100% !important;
	height: auto !important;
	object-fit: cover !important;
}

/* Focus rings for the keyboard only, on every control at once (Kirill, 2026-10-22: one rule, not one per button).
   WooCommerce's blocks, the theme and some of our older rules draw rings on :focus, so a tap or a click left one on
   the drawer's cross, the add-to-cart button, the sorting dropdown. Browsers set :focus-visible for keyboard focus
   only, and outline and box-shadow are what the rings are drawn with; the ring a keyboard user needs stays. Not text
   fields: they match :focus-visible however they got focus, and show it by their border (inline-forms.css). */
:where(a, button, select, summary, [role="button"], [tabindex], input[type="checkbox"], input[type="radio"]):focus:not(:focus-visible) {
	outline: none !important;
	box-shadow: none !important;
}

/* Link underlines one device pixel thick, the thinnest a screen draws: a third of a CSS pixel on a 3x phone, rounded
   up to a whole device pixel on 2x and 1x screens (the theme's are 1px; Kirill, 2026-10-22: lighter, in the product
   tabs and everywhere; 0.5px was still heavy) */
a {
	text-decoration-thickness: 0.34px;
}

/* The theme spaces out the letters of WooCommerce's buttons on hover and focus (letter-spacing: 1px on
   .woocommerce a.button and its kin), so a button grew under the pointer: "Просмотр корзины" in a notice (Kirill,
   2026-10-22: off everywhere). Block buttons (.wp-block-button__link) have that spacing in every state and keep it. */
.woocommerce :is(a, button, input).button:not(.wp-block-button__link):is(:hover, :focus) {
	letter-spacing: normal;
}

/* "Подтвердить заказ" on every checkout (classic, /digital/, card-checkout, retro): the blur theme gives .button.alt
   80px on each side, so on a phone the label broke into two lines inside a 290-300px button. One line, the 50px
   height of the other buttons, and the label as written (the theme upper-cased it on /digital/ only). */
.woocommerce #payment #place_order {
	padding-left: 24px;
	padding-right: 24px;
	min-height: 50px;
	text-transform: none;
}