/* =====================================================================
   ENOVATE PC — single product (README §7 "01 — Single product",
   artboard "01 Product detail"). Loaded on product pages only.
   Values from the artboard's inline styles and reference/component-recipes.js.
   ===================================================================== */

/* Our components keep their own shape when focused (base rule sets 6px). */
.en .en-gallery__btn:focus-visible { border-radius: 50%; }
.en .en-gallery__thumb:focus-visible { border-radius: var(--en-r-lg); }
.en .en-pdp-perf__seg button:focus-visible { border-radius: 9px; }
.en .en-stepper button:focus-visible { border-radius: 9px; }
.en .en-stepper input:focus-visible { border-radius: 6px; }
.en .en-buy__save:focus-visible { border-radius: var(--en-r-lg); }

/* Saved (heart) state for the buttons outside cards. */
.en .js-en-save[aria-pressed="true"] { color: var(--en-blue-150); }
.en .js-en-save[aria-pressed="true"] .en-icon { fill: currentColor; }

/* JS-only controls stay out of the way without JavaScript. */
html:not(.en-js) .en-gallery__nav,
html:not(.en-js) .en-gallery__thumbs,
html:not(.en-js) .js-en-expand,
html:not(.en-js) .js-en-share,
html:not(.en-js) .en-pdp-perf__seg,
html:not(.en-js) .en-stepper .js-en-qty { display: none; }

/* ---------- Notices ---------- */
.en-pdp-notices { padding-top: 24px; }
.en-pdp-notices:has(.woocommerce-notices-wrapper:empty), .en-pdp-notices:empty { display: none; }
.en-pdp-notices .woocommerce-message, .en-pdp-notices .woocommerce-info, .en-pdp-notices .woocommerce-error { margin-bottom: 0; }
.en-pdp-locked { padding-block: 72px; }

/* ---------- Top bar ---------- */
.en-pdp-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 26px; }
.en-pdp-top__actions { flex: none; display: flex; gap: 8px; }

/* ---------- Hero split ---------- */
.en-pdp-hero { padding-bottom: 110px; }

/* ---------- Gallery ---------- */
.en-gallery { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.en-gallery__stage { position: relative; overflow: hidden; border-radius: var(--en-r-2xl); aspect-ratio: 4 / 5; }
.en-gallery__slide { position: absolute; inset: 0; }
.en-gallery__slide[hidden] { display: none; }
.en-gallery__media { position: absolute; inset: 0; border-radius: inherit; }
.en-gallery__overlay { position: absolute; z-index: 2; inset: 20px; display: flex; flex-direction: column; justify-content: space-between; pointer-events: none; }
.en-gallery__overlay > * { pointer-events: auto; }
.en-gallery__row { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.en-gallery__row--bottom { align-items: center; }
.en-gallery__tags, .en-gallery__tools, .en-gallery__nav { display: flex; align-items: center; gap: 8px; }
.en-gallery__tags { flex-wrap: wrap; }
.en-gallery__nav { margin-inline-start: auto; }
.en-gallery__btn { width: 40px; height: 40px; }
.en-gallery__btn[hidden] { display: none; }
.en-gallery__counter { padding: 11px 14px; font-variant-numeric: tabular-nums; }

.en-gallery__thumbs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.en-gallery__thumb { display: flex; flex-direction: column; gap: 8px; min-width: 0; padding: 0; border: 0; background: none; color: inherit; text-align: start; cursor: pointer; }
.en-gallery__thumb-media { display: block; aspect-ratio: 1; border-radius: var(--en-r-lg); opacity: .75; transition: opacity var(--en-dur) var(--en-ease), box-shadow var(--en-dur) var(--en-ease); }
.en-gallery__thumb:hover .en-gallery__thumb-media { opacity: 1; }
.en-gallery__thumb.is-active .en-gallery__thumb-media { opacity: 1; box-shadow: 0 0 0 2px var(--en-blue-400), 0 0 24px -4px rgba(106,136,255,.7); }
.en-gallery__thumb-label { font: 10px/1.3 var(--en-font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--en-text-4); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: color var(--en-dur) var(--en-ease); }
.en-gallery__thumb.is-active .en-gallery__thumb-label, .en-gallery__thumb:hover .en-gallery__thumb-label { color: #fff; }

/* Lightbox */
.en-lightbox { width: min(1200px, calc(100% - 2 * var(--en-gutter))); max-height: calc(100% - 2 * var(--en-gutter)); padding: 0; border-radius: var(--en-r-xl); overflow: hidden; }
.en-lightbox__figure { margin: 0; display: flex; flex-direction: column; }
.en-lightbox__img { display: block; width: 100%; height: auto; max-height: calc(100vh - 2 * var(--en-gutter) - 48px); object-fit: contain; background: var(--en-bg-sunk); }
.en-lightbox__caption { padding: 14px 20px; font: 11px var(--en-font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--en-text-4); }
.en-lightbox__caption:empty { display: none; }
.en-lightbox__close { position: absolute; z-index: 1; top: 14px; inset-inline-end: 14px; background: rgba(10,12,16,.65); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }

/* ---------- Buy box ---------- */
.en-buy { display: flex; flex-direction: column; gap: 30px; min-width: 0; }
@media (min-width: 1024px) {
	.en-buy { position: sticky; top: calc(var(--wp-admin--admin-bar--height, 0px) + 108px); }
}
.en-buy__head { display: flex; flex-direction: column; gap: 18px; }
.en-buy__meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; }
.en-buy__title { font-size: clamp(48px, 5.6vw, 80px); line-height: .92; overflow-wrap: break-word; }
.en-buy__desc { color: var(--en-text-3); }

/* Quick specs 2×2 */
.en-buy__specs { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.en-buy__spec { display: flex; align-items: center; gap: 14px; padding: 14px; border-radius: var(--en-r-lg); background: rgba(255,255,255,.02); box-shadow: inset 0 0 0 1px var(--en-line); min-width: 0; }
.en-buy__spec-text, .en-pdp-part__text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.en-buy__spec-key, .en-pdp-part__key { font: 10px/1.3 var(--en-font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--en-text-4); }
.en-buy__spec-value { font-size: 14px; line-height: 1.4; color: #fff; }
/* LTR spec strings still line up with the start edge of an RTL page. */
.en-buy__spec-value, .en-pdp-part__value, .en-fps__settings, .en-pdp-stat__value, .en-buybar__price { text-align: match-parent; }

/* Option groups */
.en-buy__form { display: flex; flex-direction: column; gap: 30px; margin: 0; }
.en-buy__group { margin: 0; padding: 0; border: 0; min-width: 0; }
.en-buy__legend { float: inline-start; width: 100%; display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 0 10px; padding: 0; }
.en-buy__group--swatches .en-buy__legend { margin-bottom: 12px; }
.en-buy__legend + * { clear: both; }
.en-buy__chosen { font-size: 13px; color: #fff; }
.en-buy__rows { display: flex; flex-direction: column; gap: 10px; }
.en-buy__swatches { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }

/* Real radios, visually replaced by the option card / .en-radio dot. */
.en-option { position: relative; }
.en-option__input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.en-option__text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.en-option__title { font-size: 15px; font-weight: 500; line-height: 1.35; color: #fff; }
.en-option__note { font-size: 13px; line-height: 1.5; color: var(--en-text-4); }
.en-option__price { flex: none; white-space: nowrap; }
/* Checked = active, with or without JS (product.js also sets .is-active). */
.en-option:has(> .en-option__input:checked) { background: var(--en-grad-option-on); box-shadow: var(--en-shadow-option-on); }
.en-option:has(> .en-option__input:checked) > .en-radio { background: radial-gradient(circle, #fff 0 3.5px, transparent 4px), var(--en-grad-btn); box-shadow: 0 0 0 1px rgba(143,164,240,.8), 0 0 14px rgba(91,123,255,.7); }
.en-option:has(> .en-option__input:checked) .en-option__price { color: #fff; }
.en-option:has(> .en-option__input:focus-visible) { outline: 2px solid var(--en-blue-400); outline-offset: 3px; }

/* Finish cards */
.en-option--swatch { gap: 14px; padding: 14px 18px; }
.en-option--swatch .en-option__title { flex: 1; min-width: 0; font-weight: 400; color: var(--en-text-2); }
.en-option--swatch.is-active .en-option__title, .en-option--swatch:has(> .en-option__input:checked) .en-option__title { color: #fff; }
.en-option__end { flex: none; display: flex; align-items: center; }
.en-option__check { display: none; color: var(--en-blue-150); }
.en-option__check .en-icon { width: 16px; height: 16px; stroke-width: 2; }
.en-option__price--sm { margin-inline-start: 0; font-size: 12px; color: var(--en-text-4); }
.en-option--swatch.is-active .en-option__check, .en-option--swatch:has(> .en-option__input:checked) .en-option__check { display: flex; }
.en-option--swatch.is-active .en-option__price--sm, .en-option--swatch:has(> .en-option__input:checked) .en-option__price--sm { display: none; }

/* Price card */
.en-buy__price-card { padding: 24px; display: flex; flex-direction: column; gap: 20px; }
.en-buy__price-row { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px 20px; }
.en-buy__price { display: flex; flex-direction: column; gap: 6px; }
.en-buy__price .en-price--lg { line-height: 1.1; }
/* .en-tabby lives in site.css (product, cart, checkout). */

.en-buy__actions { display: flex; align-items: center; gap: 10px; }
.en-buy__qty { flex: none; }
.en-buy__qty input { min-width: 22px; appearance: textfield; -moz-appearance: textfield; padding: 0; }
.en-buy__qty input::-webkit-outer-spin-button, .en-buy__qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
html:not(.en-js) .en-buy__qty input { width: 48px; }
.en-buy__submit { flex: 1; min-width: 0; }
.en-buy__save { width: 52px; height: 52px; flex: none; margin-inline-start: auto; border-radius: var(--en-r-lg); color: #fff; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 1px var(--en-line-3); }
.en-buy__save .en-icon { width: 18px; height: 18px; }
.en-buy__unavailable { flex: 1; margin: 0; font-size: 14px; line-height: 1.6; color: var(--en-text-3); }

/* Trust 2×2 */
.en-buy__trust { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px; }
.en-buy__trust li { display: flex; align-items: center; gap: 12px; font-size: 14px; line-height: 1.4; color: var(--en-text-2); }

/* ---------- Performance ---------- */
/* .en-sec-head > div stacks its children; the toggle is a direct div child. */
.en .en-sec-head > .en-pdp-perf__seg { display: inline-flex; flex-direction: row; gap: 0; flex: none; }
.en-pdp-perf__seg button { border: 0; background: none; font: inherit; font-size: 13px; line-height: 1.2; transition: color var(--en-dur) var(--en-ease), background var(--en-dur) var(--en-ease); }
.en-pdp-perf__seg button:hover { color: #fff; }
.en-pdp-perf__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 20px; }
.en-pdp-perf__grid.is-stats-only, .en-pdp-perf__grid.is-fps-only { grid-template-columns: minmax(0, 1fr); }
.en-pdp-perf__stats { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 20px; }
.en-pdp-perf__grid.is-stats-only .en-pdp-perf__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.en-pdp-stat { flex: 1; display: flex; align-items: center; gap: 20px; padding: 26px; }
.en-pdp-stat__text { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.en-pdp-stat__value { font: 400 46px/1 var(--en-font-serif); color: #fff; }
.en-pdp-stat__label { font: 11px/1.3 var(--en-font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--en-blue-200); }
.en-pdp-stat__sub { font-size: 13px; line-height: 1.45; color: var(--en-text-4); }

.en-fps { padding: 12px 36px; }
.en-fps__list { margin: 0; padding: 0; list-style: none; }
.en-fps__row { display: grid; grid-template-columns: 260px minmax(0, 1fr) 130px; align-items: center; gap: 32px; padding-block: 26px; border-bottom: 1px solid rgba(255,255,255,.06); }
.en-fps__game { display: flex; align-items: center; gap: 14px; min-width: 0; }
.en-fps__thumb { width: 52px; height: 52px; flex: none; border-radius: var(--en-r-md); }
.en-fps__name { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.en-fps__title { font-size: 16px; font-weight: 500; line-height: 1.3; color: #fff; }
.en-fps__settings { font: 11px/1.4 var(--en-font-mono); color: var(--en-text-4); }
.en-fps__tick { position: absolute; top: -6px; inset-inline-start: calc(var(--tick, 60%) - 1px); width: 1px; height: 20px; background: rgba(255,255,255,.25); transition: inset-inline-start 900ms var(--en-ease); }
.en-fps__value { display: flex; align-items: baseline; justify-content: flex-end; gap: 8px; font: 400 52px/1 var(--en-font-serif); color: #fff; }
.en-fps__unit { font: 11px var(--en-font-mono); letter-spacing: .1em; color: var(--en-text-4); }
html[dir="rtl"] .en-fps__value { justify-content: flex-start; } /* The value is an LTR box: its start is the row's end in RTL. */
.en-fps__note { margin: 0; display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding-block: 18px; font: 10px/1.4 var(--en-font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--en-text-4); }
.en-fps__note-line { width: 12px; height: 1px; flex: none; background: rgba(255,255,255,.35); }

/* ---------- Composition ---------- */
.en-pdp-comp__inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.7fr); gap: 72px; }
.en-pdp-comp__copy { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
.en-pdp-comp__body { max-width: 380px; }
.en-pdp-comp__sheet { margin-top: 8px; }
.en-pdp-comp__grid { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-content: start; }
.en-pdp-part { border-radius: 16px; padding: 20px; display: flex; align-items: center; gap: 16px; min-width: 0; }
.en-pdp-part__text { gap: 6px; }
.en-pdp-part__key { letter-spacing: .18em; }
.en-pdp-part__value { font-size: 16px; line-height: 1.4; color: #fff; }

/* ---------- Archive band ---------- */
.en-pdp-band { padding-bottom: 100px; }
.en-pdp-band__card { border-radius: var(--en-r-3xl); overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.en-pdp-band__media { min-height: 540px; border-radius: 0; }
.en-pdp-band__copy { padding: 72px 64px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 26px; }
.en-pdp-band__quote { font-size: clamp(30px, 3.2vw, 46px); color: #fff; }
.en-pdp-band__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.en a.en-pdp-band__serial { font-size: 12px; color: #D5D9E0; transition: background var(--en-dur) var(--en-ease); }
.en a.en-pdp-band__serial:hover { color: #fff; background: rgba(255,255,255,.08); }
.en .en-pdp-band__serial:focus-visible { border-radius: var(--en-r-sm); }
.en-pdp-band__caption { font-size: 14px; color: var(--en-text-4); }

/* ---------- Also in ---------- */
.en-pdp-also { padding-bottom: 110px; }

/* ---------- Mobile sticky Add to cart bar ---------- */
.en-buybar { display: none; }
@media (max-width: 767px) {
	.en-buybar { position: fixed; z-index: 60; inset-inline: 0; bottom: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px var(--en-gutter) calc(12px + env(safe-area-inset-bottom, 0px)); background: rgba(7,8,10,.86); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); border-top: 1px solid var(--en-line); transform: translateY(100%); visibility: hidden; transition: transform var(--en-dur-slow) var(--en-ease), visibility 0s linear var(--en-dur-slow); }
	.en-buybar.is-visible { transform: none; visibility: visible; transition: transform var(--en-dur-slow) var(--en-ease), visibility 0s; }
	body.en.en-has-buybar { padding-bottom: var(--en-buybar-h, 76px); }
}
.en-buybar__info { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.en-buybar__name { font-size: 14px; line-height: 1.3; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.en-buybar__price { font: 13px var(--en-font-mono); color: var(--en-text-2); }
.en-buybar .en-btn { flex: none; }

/* ---------- Arabic ---------- */
html[lang="ar"] .en-pdp-stat__value, html[lang="ar"] .en-fps__value { font-family: var(--en-font-serif); } /* Latin digits keep the Latin serif. */
html[lang="ar"] .en-buy__title { line-height: 1.2; }

/* ---------- Responsive ---------- */
@media (max-width: 1279px) {
	.en-fps { padding-inline: 28px; }
	.en-fps__row { grid-template-columns: 220px minmax(0, 1fr) 110px; gap: 24px; }
	.en-fps__value { font-size: 44px; }
	.en-pdp-comp__inner { gap: 48px; }
	.en-pdp-band__copy { padding: 56px 48px; }
}
@media (max-width: 1023px) {
	.en-pdp-hero { padding-bottom: 72px; }
	.en-pdp-perf__grid { grid-template-columns: minmax(0, 1fr); }
	.en-pdp-perf__stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
	.en-pdp-stat { flex-direction: column; align-items: flex-start; gap: 16px; padding: 22px; }
	.en-pdp-stat__value { font-size: 40px; }
	.en-pdp-comp__inner { grid-template-columns: minmax(0, 1fr); gap: 40px; }
	.en-pdp-comp__body { max-width: 560px; }
	.en-pdp-band { padding-bottom: 72px; }
	.en-pdp-band__card { grid-template-columns: minmax(0, 1fr); }
	.en-pdp-band__media { min-height: 420px; }
	.en-pdp-also { padding-bottom: 80px; }
}
@media (max-width: 767px) {
	.en-pdp-top { padding-block: 20px; align-items: flex-start; }
	.en-pdp-hero { padding-bottom: 56px; }
	.en-gallery__overlay { inset: 14px; }
	.en-gallery__thumbs { gap: 8px; }
	.en-gallery__thumb-label { font-size: 9px; letter-spacing: .1em; }
	.en-buy { gap: 26px; }
	.en-buy__price-card { padding: 20px; }
	.en-pdp-perf__stats { grid-template-columns: minmax(0, 1fr); }
	.en-pdp-stat { flex-direction: row; align-items: center; }
	.en-fps { padding: 4px 20px; }
	/* Game + number on one line, meter full width below. */
	.en-fps__row { grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "game value" "meter meter"; gap: 16px 12px; padding-block: 20px; }
	.en-fps__game { grid-area: game; }
	.en-fps__meter { grid-area: meter; }
	.en-fps__value { grid-area: value; font-size: 40px; }
	.en-fps__note { justify-content: flex-start; }
	.en-pdp-comp__grid { grid-template-columns: minmax(0, 1fr); }
	.en-pdp-band { padding-bottom: 56px; }
	.en-pdp-band__media { min-height: 320px; }
	.en-pdp-band__copy { padding: 36px 24px; gap: 22px; }
	.en-pdp-also { padding-bottom: 64px; }
}
@media (max-width: 479px) {
	.en-buy__specs, .en-buy__trust { grid-template-columns: minmax(0, 1fr); }
	.en-gallery__thumb-label { display: none; }
	.en-buy__actions { flex-wrap: wrap; }
	.en-buy__submit { flex-basis: 100%; order: -1; }
	.en-buy__save { margin-inline-start: 0; }
	.en-buy__qty { margin-inline-end: auto; }
}
