/*
 * The product page: gallery, title block, price, add-to-cart form, "compare prices" and editions buttons, wishlist
 * heart, tabs and attributes, similar products, the fixed add-to-cart bar on phones.
 *
 * Loaded on product pages, product categories/tags and product search: snippet 209 used to load wherever the URL
 * contained "product", and some of its rules (card titles, prices, the footer gap) reach the product lists of those
 * pages. Those are marked "also lists" and stay here: those pages' lists are the only ones they ever reached.
 * The cards themselves are cards.css, printed after this file as the card snippets were printed after 209.
 *
 * Moved here 2026-10-22, verbatim and in the order Fluent Snippets printed them, from snippets 57 "Gallery
 * Adjustments", 209 "product page mobile redesign", 65 "Add to cart button styles" (product page part),
 * 20 "Product Card" (product page part), 202 "wishlist product page" and 39 "Description in the product card";
 * with the catalog-cards group, the product page parts of 140 "bundles style" and 26 "Custom sale badge".
 * Checked with tools/style-fingerprint.js on five product pages (PS TR game, bundle, Xbox TR, /digital/, PS IN),
 * a category and product search, at 1024 and 390 px.
 */

/* ── Gallery (57) ───────────────────────────────────────────────────────────── */

.wc-block-next-previous-buttons {
	display: none !important;
}

.wc-block-woocommerce-product-gallery-large-image__image,
.wc-block-woocommerce-product-gallery-large-image__image--hoverZoom {
	transform: none !important;  /* no zoom on hover */
	transition: none !important;
	cursor: default !important;
}

.wc-block-product-gallery dialog .wc-block-product-gallery-large-image img {
	max-width: 90% !important;
}

.wc-block-product-gallery dialog.wc-block-product-gallery--dialog-open {
	background-color: rgba(0, 0, 0, 0.2);
	backdrop-filter: blur(10px);
}

div.wc-block-product-gallery-large-image-next-previous-container button > svg {
	height: 50px;
	width: 50px;
}

div.wc-block-product-gallery-large-image-next-previous-container button > svg > path {
	stroke: var(--wp--preset--color--primary);
}

div.wc-block-product-gallery-large-image-next-previous-container button:hover > svg > path {
	stroke: var(--wp--preset--color--white);
}

.wc-block-product-gallery dialog .wc-block-product-gallery-dialog__header {
	padding-top: 50px !important;
}

div.wc-block-product-galler-dialog__header-right button.wc-block-product-gallery-dialog__close > svg > path {
	fill: var(--wp--preset--color--primary);
}

div.wc-block-product-galler-dialog__header-right button.wc-block-product-gallery-dialog__close:hover > svg > path {
	fill: var(--wp--preset--color--white);
}

.wc-block-product-gallery dialog {
	width: 100% !important;
}

.wc-block-product-gallery > div:first-child > div,
div[data-block-name="woocommerce/product-gallery-thumbnails"] {
	width: 100%;
}

.wc-block-product-gallery dialog .wc-block-product-gallery-large-image img {
	object-fit: contain !important;
}

@media only screen and (min-width: 320px) and (max-width: 760px) {
	.wp-block-woocommerce-product-gallery-large-image {
		pointer-events: none;
	}
}

/* ── Product page layout, phones first (209) ────────────────────────────────── */

.wc-block-components-product-price { /* also lists */
	justify-content: flex-start !important;
}

.similar-products-productblock {
	margin-block-start: 24px !important;
}

@media (min-width: 390px) and (max-width: 480px) {
	.compare-prices-button a.external-catalog-link,
	button#toggleEditionsList {
		width: clamp(120px, 165px, 170px) !important;
	}
}

@media (max-width: 390px) {
	.compare-prices-button a.external-catalog-link,
	button#toggleEditionsList {
		width: clamp(120px, 140px, 170px) !important;
	}

	.woocommerce div.product form.cart .button {
		left: 15%;
		width: auto;
	}
}

@media (max-width: 480px) {
	footer .footer-copyright { /* also lists: room for the fixed add-to-cart bar */
		margin-bottom: 70px !important;
	}

	p.stock.in-stock {
		color: #e7e7e7 !important;
		margin-left: 4px;
	}

	.woocommerce .wp-block-group.product-card-info {
		background-color: transparent !important;
		border: none;
		margin: 0;
		color: #e7e7e7;
		padding: 0 !important;
	}

	.product .wp-block-columns {
		gap: 10px;
	}

	.wp-block-woocommerce-product-gallery.wc-block-product-gallery .wp-block-group {
		gap: 10px;
	}

	.product-card-info .wp-block-spacer {
		height: 8px !important;
	}

	.product .wc-block-store-notices.wp-block-woocommerce-store-notices {
		margin-top: 10px;
	}

	.wc-block-components-product-price.productcardprice {
		display: flex !important;
		font-variant-numeric: tabular-nums;
		flex-wrap: nowrap;
		margin-bottom: 16px !important;
		color: #e7e7e7 !important;
		flex-direction: row-reverse;
		justify-content: flex-end;
	}

	.productcardprice .wc-block-components-product-price ins.discounted-price {
		color: #e7e7e7 !important;
		order: 1;
	}

	.productcardprice .wp-block-woocommerce-product-price del.base-price {
		text-decoration: line-through !important;
		font-size: 16px;
		order: 2;
	}

	del.base-price span { /* also lists */
		text-decoration: none;
		font-size: 16px;
	}

	.wc-block-components-product-price.productcardprice del {
		text-decoration: none;
	}

	/* Fixed add-to-cart button over a bar at the bottom of the screen */
	.woocommerce div.product form.cart .button {
		position: fixed;
		bottom: 12px;
		z-index: 999;
		background-color: #c5ff00 !important;
		color: #121212 !important;
	}

	.addtocart-baseline-product {
		position: fixed;
		background-color: #232323;
		width: 100%;
		height: 74px;
		bottom: 0;
		z-index: 998;
	}

	.product .wp-block-post-title { /* also lists: product cards carry the class "product" */
		display: flex;
		font-size: 18px !important;
		font-weight: 400;
		flex-direction: row !important;
		flex-wrap: nowrap;
		align-items: center !important;
	}

	.psplusextra-button {
		display: none !important;
	}

	.add-tocartbtn-product-card {
		display: flex;
		flex-wrap: nowrap;
		justify-content: flex-start;
	}

	.compare-prices-button a.external-catalog-link img {
		display: none;
	}

	.compare-prices-button a.external-catalog-link {
		height: 42px !important;
		border: 1px solid #e7e7e7 !important;
		color: #e7e7e7;
		font-size: 12px !important;
		padding-left: 8px;
		padding-right: 8px;
	}

	.line-productpage {
		display: none;
	}

	.compare-prices-button::before {
		display: none;
	}

	button#toggleEditionsList {
		height: 42px !important;
		font-size: 12px !important;
		cursor: pointer;
		position: relative;
		border-radius: 50px;
		border: 1px solid #fff !important;
		background-color: #f6f6f600 !important;
		color: #efefef !important;
	}

	button#toggleEditionsList::before {
		content: '';
		position: absolute;
		top: 52%;
		left: 14% !important;
		width: 9px;
		height: 2px;
		background-color: var(--wp--preset--color--primary) !important;
	}

	button#toggleEditionsList::after {
		content: '';
		position: absolute;
		top: 52%;
		left: 10% !important;
		width: 9px;
		height: 2px;
		background-color: var(--wp--preset--color--primary) !important;
	}

	.wp-block-woocommerce-product-meta {
		display: none;
	}

	#sale-timer-shortcode { /* discount countdown bar */
		display: flex;
		align-items: center;
		justify-content: center;
		margin-inline: 0 !important;
		margin-top: -6px;
		position: relative;
		height: 25px;
		border: 2px solid transparent;
		border-radius: 20px;
		background-color: #232323;
		margin-bottom: 16px;
	}

	.xbox-product-page-spacer,
	.services-product-page-spacer {
		display: none;
	}
}

/* ── Add-to-cart button (65) ─────────────────────────────────────────────────── */

form.cart button.single_add_to_cart_button {
	color: var(--wp--preset--color--primary) !important;
	display: inline-flex !important;
	align-items: center;
	background-color: var(--wp--preset--color--background) !important;
	border: 2px solid transparent !important;
	box-shadow: 0 0 0 transparent !important;
	width: 220px;
	height: 50px;
	font-weight: 500 !important;
	font-size: var(--wp--preset--font-size--medium) !important;
	text-transform: lowercase !important;
	transition: all .5s ease !important;
	margin-bottom: 0 !important;
}

div.wc-block-add-to-cart-form form.cart {
	display: flex;
}

@media (max-width: 1008px) {
	div.wc-block-add-to-cart-form form.cart {
		flex-direction: column;
	}
}

form.cart button.single_add_to_cart_button:hover {
	color: var(--wp--preset--color--primary) !important;
	font-weight: 500 !important;
	opacity: 1 !important;
	background-color: var(--wp--preset--color--background) !important;
	box-shadow: 0 0 10px 0px var(--wp--preset--color--custom-accent-purple) !important;
	border: 2px solid var(--wp--preset--color--custom-accent-purple) !important;
}

/* ── Product page (20) ───────────────────────────────────────────────────────── */

.add-tocartbtn-product-card {
	display: flex;
	align-items: flex-end;
}

.compare-prices-button {
	position: relative;
}

.compare-prices-button a.external-catalog-link {
	height: 50px;
	width: 220px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 500;
	border: 2px solid var(--wp--preset--color--secondary);
	border-radius: 50px;
}

.compare-prices-button a.external-catalog-link:hover {
	box-shadow: 0 0 10px 0px var(--wp--preset--color--custom-accent-purple);
	border: 2px solid var(--wp--preset--color--custom-accent-purple);
}

.compare-prices-button a.external-catalog-link img {
	width: 20px;
	height: auto;
	vertical-align: middle;
	margin-right: 5px;
}

/* Divider between "add to cart" and "compare prices": vertical, horizontal on narrow screens */
.compare-prices-button::before {
	content: "";
	position: absolute;
	left: -12px;
	top: 25px;
	transform: translateY(-50%);
	width: 2px;
	border-radius: 50px;
	height: 35px;
	background: var(--wp--preset--color--secondary);
}

@media (max-width: 1260px) {
	.compare-prices-button::before {
		background: var(--wp--preset--color--secondary);
		width: 180px;
		height: 1.4px;
		border-radius: 50px;
		top: -12px;
		left: 50%;
		transform: translateX(-50%);
	}
}

p.stock.in-stock {
	color: #121212;
}

@media only screen and (min-width: 320px) and (max-width: 760px) {
	.wp-block-woocommerce-product-gallery-large-image {
		pointer-events: none;
	}

	.wp-block-group.has-secbackground-background-color.has-background.is-layout-constrained.wp-block-group-is-layout-constrained {
		padding-top: 25px;
		padding-right: 15px;
		padding-left: 15px;
		padding-bottom: 0;
	}
}

.woocommerce div.product form.cart .button {
	border-radius: 50px;
}

.wc-block-product-gallery-large-image img {
	border-radius: 20px;
}

.wc-block-product-gallery-thumbnails img {
	border-radius: 20px;
}

.woocommerce-product-details__short-description,
.woocommerce-Tabs-panel p {
	font-size: 16px;
}

.woocommerce-Tabs-panel h2,
.related.products > h2,
.up-sells.upsells.products h2 {
	display: none;
}

.woocommerce button.button.alt {
	color: white;
	background: #000000;
	padding-left: 30px;
	padding-right: 30px;
}

.woocommerce button.button.alt :hover {
	background: #232323;
}

.wp-block-post-terms__prefix {
	color: #A4A4A4;
}

.wp-block-woocommerce-product-meta {
	margin-top: 0 !important;
}

/* Arrow after the "similar games" and cross-sell headings */
h2.similar-games-header a,
h2.cross-sell-slider-header a {
	position: relative;
	padding-right: 0.3%;
}

h2.similar-games-header a::after,
h2.similar-games-header a::before,
h2.cross-sell-slider-header a::after,
h2.cross-sell-slider-header a::before {
	content: '';
	position: absolute;
	top: 46%;
	left: 100%;
	width: 14px;
	height: 4px;
	background-color: var(--wp--preset--color--primary);
	transition: all 0.5s ease;
}

h2.similar-games-header a::after,
h2.cross-sell-slider-header a::after {
	transform-origin: top right;
	transform: rotate(-45deg);
}

h2.similar-games-header a::before,
h2.cross-sell-slider-header a::before {
	top: 50%;
	transform-origin: bottom right;
	transform: rotate(45deg);
}

h2.similar-games-header a:hover::after,
h2.similar-games-header a:hover::before,
h2.cross-sell-slider-header a:hover::after,
h2.cross-sell-slider-header a:hover::before {
	background-color: var(--wp--preset--color--accent);
}

.woocommerce div.product form.cart div.quantity {
	display: none;
}

.woocommerce div.product form.cart {
	margin-bottom: 0;
}

div[data-block-name="woocommerce/product-price"][data-is-descendent-of-single-product-template="true"] {
	margin-bottom: 12px !important;
}

.woocommerce div.product .woocommerce-tabs .panel {
	border-top: 1px solid #7A7A7A;
}


.woocommerce table.shop_attributes th,
.woocommerce table.shop_attributes td {
	text-transform: none !important;
}

/* The flag next to the activation region */
img.product-info-region-flag {
	position: absolute;
	top: 2px;
	right: -22px;
}

span.product-info-region-text {
	position: relative;
}

/* Attributes table ("Детали") */
.woocommerce table.shop_attributes th {
	width: 105px;
	font-size: 16px;
	color: #A4A4A4;
	font-family: var(--wp--preset--font-family--onest);
}

.woocommerce table.shop_attributes td {
	font-style: normal;
	border: none;
	border-color: transparent;
}

.woocommerce table.shop_attributes th,
.woocommerce table.shop_attributes td {
	padding: 5px 0;
}



/* ── Wishlist heart next to the title (202) ──────────────────────────────────── */

/* Selectors carry .wishlist-button twice over on purpose: snippet 195 "Wishlist" styles .wishlist-button
   span.woosw-btn-icon (white, 22px) at the same specificity and is printed after this file, so the
   product page's rules have to outweigh it rather than come later. */

.product-page-title.wp-block-post-title {
	display: block !important;
	position: relative;   /* anchor for the button */
	padding-right: 48px;  /* room for it */
}

.wishlist-button.wishlist-button--desktop {
	background: none !important;
	position: absolute !important;
	top: 0 !important;
	right: 0 !important;
	margin-left: 0;
}

.product .wishlist-button--source:not(.wishlist-button--desktop):not(.wishlist-button--mobile) {
	display: none;
}

.wishlist-button.wishlist-button--desktop a.woosw-btn {
	position: static !important;
	top: auto !important;
	right: auto !important;
	background: none !important;
	padding: 0 !important;
	margin: 0 !important;
	border-radius: 0 !important;
	display: inline-flex !important;
	align-items: center;
	line-height: 1;
}

.wishlist-button.wishlist-button--desktop span.woosw-btn-icon {
	font-size: 28px;
	padding: 0;
	border: 0;
	border-radius: 0;
	color: #000;
}

.wishlist-button.wishlist-button--desktop a.woosw-added span.woosw-btn-icon.woosw-icon-8 {
	color: #9100FF !important;
}

/* On phones the heart sits on the cover image */
.wishlist-button.wishlist-button--mobile {
	position: absolute !important;
	top: 12px !important;
	right: 12px !important;
	z-index: 2;
	border-radius: 8px;
	background: rgba(0, 0, 0, 0.3);
	padding: 8px;
	display: inline-flex !important;
	align-items: center;
	height: auto;
}

.wishlist-button.wishlist-button--mobile a.woosw-btn {
	position: static !important;
	top: auto !important;
	right: auto !important;
	background: none !important;
	padding: 0 !important;
	margin: 0 !important;
	border-radius: 0 !important;
	display: inline-flex !important;
	align-items: center;
	line-height: 1;
}

.wishlist-button.wishlist-button--mobile span.woosw-btn-icon {
	font-size: 22px;
	padding: 0;
	border: 0;
	border-radius: 0;
	color: #fff;
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
}

.wishlist-button.wishlist-button--mobile a.woosw-added span.woosw-btn-icon.woosw-icon-8 {
	color: #9100FF !important;
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

/* ── Tabs (39) ───────────────────────────────────────────────────────────────── */

.woocommerce.woocommerce-tabs,
.woocommerce-page div.product .woocommerce-tabs {
	font-family: 'Onest';
}

/* ── Bundle contents (140) ─────────────────────────────────────────────────── */

.woosb-products .woosb-product .woosb-title .woosb-name a {
	color: var(--wp--preset--color--background) !important;
}

/* ── No sale badge over the gallery image (26) ──────────────────────────────── */

.wc-block-product-gallery-large-image__inner-blocks {
	display: none !important;
}
