/**
 * Theme Name:     SwiftCart Child
 * Author:         SolverWp
 * Template:       swiftcart
 * Text Domain:	   swiftcart-child
 * Description:    SwiftCart is a premium WordPress theme designed specifically for modern e-commerce websites and online stores. This meticulously crafted theme offers a perfect blend of aesthetics and functionality, featuring a clean, responsive design that showcases your products beautifully across all devices. With seamless WooCommerce integration, customizable product layouts, and optimized checkout process, SwiftCart helps you create a professional and user-friendly shopping experience that converts visitors into customers. The theme includes multiple homepage layouts, product display options, and header/footer styles to match your brand identity.
 */

/* Hero slider (Home Two): between 992px and 1399px the parent makes .sw-header-two-banner a flex row,
   and the owl carousel inside grows to its full stage width, pushing the image and the page off-screen. */
.sw-header-two-banner > .sw-main-slider {
	min-width: 0;
	width: 100%;
}

/* Hero slide on desktop widths: the parent lets text and image wrap onto separate rows when they don't fit,
   which clipped the image on laptops and stacked it under the text (a 771px-tall slide) on wide screens.
   Keep them side by side: the text column is capped and the image shrinks if needed. */
@media (min-width: 992px) {
	.sw-main-slider-two .sw-main-slider__item {
		flex-wrap: nowrap;
		gap: 24px;
	}
	.sw-main-slider-two .sw-main-slider__left {
		flex: 1 1 auto;
		min-width: 0;
		max-width: 420px;
		position: relative;
		z-index: 1;
	}
}

/* Hero slides use a full-bleed background photo (the Pokémon TCG card collage) instead of a cut-out product
   image: the slide's image column is lifted out of the flow and stretched behind the text, with a dark
   gradient so the copy stays readable. The price badge stays pinned top-right. */
.sw-main-slider-two .sw-main-slider__item {
	position: relative;
	overflow: hidden;
	min-height: 420px;
}
.sw-main-slider-two .sw-main-slider__right {
	position: absolute;
	inset: 0;
	z-index: 0;
	margin: 0;
}
body .sw-main-slider-two .owl-item .sw-main-slider__img {
	position: absolute;
	inset: 0;
	margin: 0;
	transform: none;
	transition-property: opacity;
}
body .sw-main-slider-two .owl-carousel .owl-item .sw-main-slider__img img {
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center;
}
.sw-main-slider-two .sw-main-slider__img::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(10, 10, 14, 0.92) 0%, rgba(10, 10, 14, 0.75) 38%, rgba(10, 10, 14, 0.15) 75%, rgba(10, 10, 14, 0) 100%);
}
.sw-main-slider-two .sw-main-slider__price {
	z-index: 2;
	top: 24px;
	right: 24px;
}
.sw-main-slider-two .sw-main-slider__left {
	position: relative;
	z-index: 1;
}
/* Framing for the current hero image (Pikachu, Mew and Mewtwo, centred in the artwork): widen the image on
   desktop so the characters land in the right half, clear of the copy. Revisit these if the image changes. */
@media (min-width: 992px) {
	body .sw-main-slider-two .owl-carousel .owl-item .sw-main-slider__img img {
		position: absolute;
		top: 0;
		left: 0;
		width: 147%;
		object-position: center 42%;
	}
}
@media (min-width: 992px) and (max-width: 1199px) {
	body .sw-main-slider-two .owl-carousel .owl-item .sw-main-slider__img img {
		width: 118%;
		object-position: center 38%;
	}
}
@media (max-width: 991px) {
	/* Phones/tablets: the image fills the top part of the slide, the copy sits underneath. */
	body .sw-main-slider-two .owl-carousel .owl-item .sw-main-slider__img img {
		position: absolute;
		top: 0;
		left: 0;
		height: 62%;
		object-position: center 45%;
	}
}

@media (max-width: 991px) {
	/* Stacked layout (column-reverse): keep the copy at the bottom, below the price badge, and shade upward. */
	body .sw-main-slider-two .sw-main-slider__item {
		justify-content: flex-start;
		min-height: 600px;
	}
	.sw-main-slider-two .sw-main-slider__img::after {
		background: linear-gradient(0deg, rgba(10, 10, 14, 0.95) 0%, rgba(10, 10, 14, 0.8) 45%, rgba(10, 10, 14, 0.1) 85%);
	}
}
@media (min-width: 992px) and (max-width: 1399px) {
	.sw-main-slider-two .sw-main-slider__item {
		padding: 40px;
	}
	.sw-main-slider-two .owl-dots {
		left: 40px;
		bottom: 40px;
	}
}

/* Hero row: stretch the slider to the full height of the two side banners so both columns end level
   (it was ~170px shorter, leaving a gap under the slider). 1025px+ is where Elementor puts them side by side. */
@media (min-width: 1025px) {
	.elementor-element-9618acf > .elementor-widget-swiftcart-slider-widget {
		flex: 1 1 auto;
	}
	.elementor-widget-swiftcart-slider-widget > .elementor-widget-container,
	.elementor-widget-swiftcart-slider-widget .sw-header-two-banner,
	.elementor-widget-swiftcart-slider-widget .sw-main-slider-two,
	.sw-main-slider-two .owl-carousel,
	.sw-main-slider-two .owl-stage-outer,
	.sw-main-slider-two .owl-stage,
	.sw-main-slider-two .owl-item,
	.sw-main-slider-two .sw-main-slider__item {
		height: 100%;
	}
}

/* FlipBuds side banner: title ran to three lines and the button's arrow wrapped under its label. */
.sw-header-two-banner-two__item {
	gap: 24px;
}
.sw-header-two-banner-two .swiftcart-btn {
	white-space: nowrap;
}
@media (min-width: 768px) and (max-width: 1399px) {
	.sw-header-two-banner-two__right {
		flex: 0 0 38%;
		min-width: 0;
	}
	.sw-header-two-banner-two__right img {
		max-width: 100%;
		height: auto;
	}
	.sw-header-two-banner-two__left {
		flex: 1 1 auto;
		min-width: 0;
	}
	.sw-header-two-banner-one__title {
		font-size: 22px;
	}
}

/* Hero slide change: the parent hides each slide's text/image and only fades them in after a 1.1-1.3s delay
   plus a 1.2s transition, while owl keeps the outgoing black slide on top fading out. For ~2.5s of every
   7s cycle the hero looked dim and washed out. Reveal the content quickly and shorten the crossfade. */
.sw-main-slider__carousel .owl-item.animated {
	animation-duration: 0.5s;
}
body .sw-main-slider__carousel .owl-item .sw-main-slider__subtitle,
body .sw-main-slider__carousel .owl-item .sw-main-slider__title,
body .sw-main-slider__carousel .owl-item .sw-main-slider__info,
body .sw-main-slider__carousel .owl-item .sw-main-slider__btn,
body .sw-main-slider__carousel .owl-item .sw-main-slider__img {
	transition-duration: 0.6s;
}
body .sw-main-slider__carousel .active .sw-main-slider__subtitle,
body .sw-main-slider__carousel .active .sw-main-slider__img {
	transition-delay: 0.15s;
}
body .sw-main-slider__carousel .active .sw-main-slider__title {
	transition-delay: 0.25s;
}
body .sw-main-slider__carousel .active .sw-main-slider__info {
	transition-delay: 0.35s;
}
body .sw-main-slider__carousel .active .sw-main-slider__btn {
	transition-delay: 0.45s;
}
/* Inactive slides drop their content at once instead of fading it over the incoming slide. */
.sw-main-slider__carousel .owl-item:not(.active) .sw-main-slider__subtitle,
.sw-main-slider__carousel .owl-item:not(.active) .sw-main-slider__title,
.sw-main-slider__carousel .owl-item:not(.active) .sw-main-slider__info,
.sw-main-slider__carousel .owl-item:not(.active) .sw-main-slider__btn,
.sw-main-slider__carousel .owl-item:not(.active) .sw-main-slider__img {
	transition-duration: 0s;
	transition-delay: 0s;
}
/* Keep "Xbox Consoles" on one line in the narrower laptop-width slide. */
@media (min-width: 992px) and (max-width: 1399px) {
	.sw-main-slider-two .sw-main-slider__title {
		font-size: 34px;
	}
}

/* Side promo banner (Pixel): its image is absolutely positioned and covered the heading on narrower columns.
   Put it back in the flex flow as its own column, anchored to the banner's bottom edge. */
@media (min-width: 768px) and (max-width: 1399px) {
	.sw-header-two-banner-one__item {
		align-items: flex-end;
		gap: 16px;
	}
	.sw-header-two-banner-one__left {
		flex: 1 1 auto;
		min-width: 0;
		align-self: center;
	}
	.sw-header-two-banner-one__right {
		flex: 0 0 38%;
		min-width: 0;
		margin-bottom: -40px;
	}
	.sw-header-two-banner-one__right img {
		position: relative;
		right: auto;
		bottom: auto;
		max-width: 100%;
		height: auto;
	}
}

/* Home Two: the two promo banners stack on phones (side by side they were ~170px wide and the titles broke badly). */
@media (max-width: 767px) {
	.elementor-element-c4e4181 {
		flex-direction: column;
	}
	body .elementor-element-c4e4181 > .elementor-widget {
		flex: none;
		width: 100%;
	}
}

/* Home Two: the two promo banners under the slider share the row evenly on tablet/laptop widths. */
@media (max-width: 1399px) {
	.elementor-element-c4e4181 > .elementor-widget {
		flex: 1 1 0;
		min-width: 0;
	}
	.elementor-element-c4e4181 .sw-header-two-banner-one,
	.elementor-element-c4e4181 .sw-header-two-banner-two {
		height: 100%;
	}
}

/* Hero side banner a14d833 (was "New Google Pixel 6 Pro"): its image (Pokémon TCG Paldean Fates art) covers the
   whole box, with a dark fade behind the copy on the left. The copy column is capped so it never runs under the
   "29% OFF" badge; on phones the badge sits top-right and the copy is left-aligned below it. The box keeps its
   250px height so the hero slider beside it still lines up. */
body .elementor-element-a14d833 .sw-header-two-banner-one__item {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	min-height: 250px;
}
body .elementor-element-a14d833 .sw-header-two-banner-one__right {
	position: absolute;
	inset: 0;
	z-index: -1;
	flex: none;
	width: auto;
	max-width: none;
	margin: 0;
}
body .elementor-element-a14d833 .sw-header-two-banner-one__right img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center 35%;
}
body .elementor-element-a14d833 .sw-header-two-banner-one__right::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(0, 0, 0, 0.88) 0%, rgba(0, 0, 0, 0.7) 50%, rgba(0, 0, 0, 0.25) 80%, rgba(0, 0, 0, 0.1) 100%);
}
body .elementor-element-a14d833 .sw-header-two-banner-one__left {
	position: relative;
	z-index: 1;
	flex: 0 1 auto;
	max-width: 62%;
	align-self: center;
}
body .elementor-element-a14d833 .sw-header-two-banner-one__offer {
	z-index: 2;
}
@media (max-width: 767px) {
	body .elementor-element-a14d833 .sw-header-two-banner-one__offer {
		top: 24px;
		bottom: auto;
	}
}
@media (max-width: 575px) {
	body .elementor-element-a14d833 .sw-header-two-banner-one__item {
		justify-content: center;
	}
	body .elementor-element-a14d833 .sw-header-two-banner-one__left {
		align-self: flex-start;
	}
}
@media (max-width: 359px) {
	body .elementor-element-a14d833 .sw-header-two-banner-one__left {
		margin-top: 44px;
	}
}
/* Hero side banner f0524cf (was "Xiaomi FlipBuds Pro"): its image (Pokémon TCG Journey Together art) covers the
   whole box. The copy sits on the LEFT (user's request), with a dark fade behind it from the left
   (stronger on phones, where the copy takes more of the width). Height kept at 250px for the hero row. */
body .elementor-element-f0524cf .sw-header-two-banner-two__item {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	min-height: 250px;
	justify-content: flex-start;
}
body .elementor-element-f0524cf .sw-header-two-banner-two__right {
	position: absolute;
	inset: 0;
	z-index: -1;
	flex: none;
	width: auto;
	max-width: none;
	margin: 0;
}
body .elementor-element-f0524cf .sw-header-two-banner-two__right img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center 30%;
}
body .elementor-element-f0524cf .sw-header-two-banner-two__right::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(0, 0, 0, 0.88) 0%, rgba(0, 0, 0, 0.7) 45%, rgba(0, 0, 0, 0.2) 75%, rgba(0, 0, 0, 0.05) 100%);
}
body .elementor-element-f0524cf .sw-header-two-banner-two__left {
	position: relative;
	z-index: 1;
	flex: 0 1 auto;
	max-width: 62%;
}
@media (max-width: 575px) {
	body .elementor-element-f0524cf .sw-header-two-banner-two__item {
		justify-content: center;
		align-items: flex-start;
	}
	body .elementor-element-f0524cf .sw-header-two-banner-two__left {
		max-width: 70%;
		align-self: flex-start;
	}
	body .elementor-element-f0524cf .sw-header-two-banner-two__right::after {
		background: linear-gradient(90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.78) 62%, rgba(0, 0, 0, 0.4) 85%, rgba(0, 0, 0, 0.2) 100%);
	}
}
/* Popular Categories ad slot (product-category widget e0325f8, was the "Cyber Monday" graphic): the Pokémon TCG
   Temporal Forces image is wider than the old ad, so on desktop, where the slot matches the 299px-tall category
   tiles beside it, make it fill the whole slot instead of leaving a gap underneath. */
@media (min-width: 992px) {
	body .elementor-element-e0325f8 .sw-cats-two__ads {
		height: 100%;
		overflow: hidden;
	}
	body .elementor-element-e0325f8 .sw-cats-two__ads img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center 40%;
	}
}
/* Wide "iphone Pro / SAVE UP TO $200.00" banner (banner widget 9730bed, .sw-banner-seven): its image (Pokémon
   Halloween party art) covers the whole box, with no fade over it. Stacking inside the box: picture 0,
   the theme's blue corner triangle 1, copy 2 (the theme's dark circle stays behind the picture). */
body .elementor-element-9730bed .sw-banner-three__item {
	min-height: 368px;
}
body .elementor-element-9730bed .sw-banner-three__right {
	position: absolute;
	inset: 0;
	z-index: 0;
	margin: 0;
}
body .elementor-element-9730bed .sw-banner-three__img {
	position: absolute;
	inset: 0;
	width: auto;
	max-width: none;
	margin: 0;
	transform: none;
	display: block;
}
body .elementor-element-9730bed .sw-banner-three__img img {
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center 45%;
}
body .elementor-element-9730bed .sw-banner-three__item::before {
	z-index: 1;
}
body .elementor-element-9730bed .sw-banner-three__left {
	position: relative;
	z-index: 2;
}
/* No fade over the art (user's choice), so the copy gets a tight dark shadow to stay readable. */
body .elementor-element-9730bed .sw-banner-three__title,
body .elementor-element-9730bed .sw-banner-three__info {
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9), 0 2px 8px rgba(0, 0, 0, 0.75);
}
@media (max-width: 991px) {
	body .elementor-element-9730bed .sw-banner-three__item {
		min-height: 440px;
		justify-content: flex-start;
	}
}
/* Home Two promo banners 454649b (Pokémon Generations) and ac78ab2 (Pokémon Sleep): the picture covers the WHOLE
   box as a background, cropped to fit. Both get a black fade behind the copy on the left (Sleep: the user removed a light "glow" earlier,
   then asked for this black fade); Sleep's copy is also white with a tight shadow. */
body .elementor-element-454649b .sw-banner-three__item,
body .elementor-element-ac78ab2 .sw-banner-three__item {
	position: relative;
	overflow: hidden;
	min-height: 368px;
}
body .elementor-element-454649b .sw-banner-three__right,
body .elementor-element-ac78ab2 .sw-banner-three__right {
	position: absolute;
	inset: 0;
	z-index: 0;
}
body .elementor-element-454649b .sw-banner-three__img,
body .elementor-element-ac78ab2 .sw-banner-three__img {
	position: absolute;
	inset: 0;
	width: auto;
	max-width: none;
	margin: 0;
	transform: none;
	display: block;
}
body .elementor-element-454649b .sw-banner-three__img img,
body .elementor-element-ac78ab2 .sw-banner-three__img img {
	width: 100%;
	height: 100%;
	max-width: none;
	max-height: none;
	object-fit: cover;
	border-radius: 0;
}
body .elementor-element-454649b .sw-banner-three__img img {
	object-position: center 30%;
}
body .elementor-element-ac78ab2 .sw-banner-three__img img {
	object-position: center 25%; /* square art in a wide box: keep the logo, Darkrai's head and Snorlax in view */
}
body .elementor-element-454649b .sw-banner-three__left,
body .elementor-element-ac78ab2 .sw-banner-three__left {
	position: relative;
	z-index: 1;
}
body .elementor-element-454649b .sw-banner-three__price {
	z-index: 2;
	top: 20px;
	right: 20px;
}
body .elementor-element-454649b .sw-banner-three__img::after,
body .elementor-element-ac78ab2 .sw-banner-three__img::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.7) 45%, rgba(0, 0, 0, 0.1) 80%, rgba(0, 0, 0, 0) 100%);
}
/* Sleep's black fade is about a quarter lighter than Generations' (user asked to reduce it). The shared base rule
   above supplies content/position; these override only the gradient. */
body .elementor-element-ac78ab2 .sw-banner-three__img::after {
	background: linear-gradient(90deg, rgba(0, 0, 0, 0.68) 0%, rgba(0, 0, 0, 0.5) 45%, rgba(0, 0, 0, 0.06) 80%, rgba(0, 0, 0, 0) 100%);
}
@media (min-width: 992px) and (max-width: 1199px) {
	body .elementor-element-ac78ab2 .sw-banner-three__img::after {
		background: linear-gradient(90deg, rgba(0, 0, 0, 0.68) 0%, rgba(0, 0, 0, 0.55) 55%, rgba(0, 0, 0, 0.38) 100%);
	}
}
@media (max-width: 991px) {
	body .elementor-element-ac78ab2 .sw-banner-three__img::after {
		background: linear-gradient(0deg, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.55) 45%, rgba(0, 0, 0, 0.03) 85%);
	}
}/* Beats the widget's own Elementor colour rule (.elementor-532 .elementor-element.elementor-element-ac78ab2 .el-banner-*). */
body .elementor-532 .elementor-element-ac78ab2 .sw-banner-three__item .sw-banner-three__title,
body .elementor-532 .elementor-element-ac78ab2 .sw-banner-three__item .sw-banner-three__info {
	color: #fff;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9), 0 2px 8px rgba(0, 0, 0, 0.75);
}
@media (min-width: 992px) and (max-width: 1199px) {
	/* Narrow boxes: the Generations title runs to ~90% of the width, so extend its fade across the box. */
	body .elementor-element-454649b .sw-banner-three__img::after {
		background: linear-gradient(90deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.75) 55%, rgba(0, 0, 0, 0.55) 100%);
	}
}
@media (max-width: 991px) {
	body .elementor-element-454649b .sw-banner-three__item,
	body .elementor-element-ac78ab2 .sw-banner-three__item {
		min-height: 440px;
		justify-content: flex-start;
	}
	body .elementor-element-454649b .sw-banner-three__img::after {
		background: linear-gradient(0deg, rgba(0, 0, 0, 0.92) 0%, rgba(0, 0, 0, 0.75) 45%, rgba(0, 0, 0, 0.05) 85%);
	}
}
/* Home Two "Best deals" side banner (product-list widget 2f5f0b7, the old CC Camera promo): its image
   (Pokémon FireRed/LeafGreen cover) fills the whole tall box. The image is out of the flow, so the box keeps a
   min height; title stays top, button bottom. A dark fade sits only behind the title and the button, since
   the art is bright orange/green and the copy is white/yellow. */
body .elementor-element-2f5f0b7 .sw-best-deal__banner {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	min-height: 520px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
}
@media (min-width: 992px) {
	body .elementor-element-2f5f0b7 .sw-best-deal__banner {
		min-height: 590px;
	}
}
body .elementor-element-2f5f0b7 .sw-best-deal__banner > img {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: 100%;
	height: 100%;
	max-width: none;
	margin: 0;
	object-fit: cover;
	object-position: center 30%;
}
body .elementor-element-2f5f0b7 .sw-best-deal__banner::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.45) 22%, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0) 72%, rgba(0, 0, 0, 0.55) 100%);
}
body .elementor-element-2f5f0b7 .sw-best-deal__banner-title,
body .elementor-element-2f5f0b7 .sw-best-deal__banner .swiftcart-btn {
	position: relative;
}

/* Home Two "Modern Furniture / 30% Discount" countdown banner (product-list widget e73e29d, .sw-banner-five):
   its image (Pokémon Masters EX art) fills the whole box. The box keeps its original height (624px at
   ≥1200px), the copy and countdown stay at the top, the button at the bottom. Dark fade only behind the copy
   (top) and the button (bottom). */
body .elementor-element-e73e29d .sw-banner-five {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	min-height: 520px;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	text-align: center;
}
@media (min-width: 1200px) {
	body .elementor-element-e73e29d .sw-banner-five {
		min-height: 624px;
	}
}
body .elementor-element-e73e29d .sw-banner-five > .swiftcart-btn {
	margin-top: auto;
}
body .elementor-element-e73e29d .sw-banner-five__img {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: auto;
	max-width: none;
	margin: 0;
}
body .elementor-element-e73e29d .sw-banner-five__img img {
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	object-position: center 30%;
}
body .elementor-element-e73e29d .sw-banner-five::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.6) 40%, rgba(0, 0, 0, 0) 56%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0.55) 100%);
}

/* Blog cards: remove the grey vertical date strip the theme overlays on the left of each post image
   (user's request). The image underneath is full width, so nothing else needs to move. */
.sw-blog-list__meta-2,
.sw-blog-one__meta-2 {
	display: none !important;
}
/* Blog cards: the image box is inline-block, and WordPress caps the post-thumbnail tag at 450px tall, so an image
   that isn't exactly 856x450 shrank. All blog featured images now use the whole picture (user's request), so they vary in height. Make the
   image always span the card and keep its own proportions; exact 856x450 images look the same as before. */
.sw-blog-list__thumb.sw-blog-list__thumb-size,
.sw-blog-list__thumb.w-img,
.sw-blog-one__thumb.w-img {
	display: block; /* list cards, the single-post header image and Blog Grid cards */
}
.sw-blog-list__thumb img,
.sw-blog-one__thumb img {
	width: 100%;
	height: auto;
}
/* About page collage (widget 9c91267): the three TCG images replaced demo photos of a fixed shape. The theme sizes
   the two columns from each image's natural width (and shows images at natural size from 1400px), so the much larger
   new files broke the layout. Keep every spot at its original shape and the columns at the original 392:350 split;
   images are fitted with cover. Arrangement: Genesys big left (its round logo suits the tall spot), Supreme Darkness
   top right (full title shows), Pokémon TCG logo bottom right. */
.elementor-element-9c91267 .sw-about-one__img img,
.elementor-element-9c91267 .sw-about-one__img-2 img {
	width: 100%;
	height: auto;
	object-fit: cover;
}
.elementor-element-9c91267 img[src*="about-yugioh-supreme-darkness"] {
	aspect-ratio: 350 / 236;
	object-position: 50% 50%;
}
.elementor-element-9c91267 img[src*="about-pokemon-tcg-logo"] {
	aspect-ratio: 350 / 281;
	object-position: 50% 50%;
}
.elementor-element-9c91267 img[src*="blog-yugioh-genesys"] {
	aspect-ratio: 392 / 536;
	object-position: 49% 50%;
}
@media (min-width: 768px) {
	.elementor-element-9c91267 .sw-about-one__img {
		flex: 392 1 0;
		min-width: 0;
	}
	.elementor-element-9c91267 .sw-about-one__img-2 {
		flex: 350 1 0;
		min-width: 0;
	}
}
@media (min-width: 1400px) {
	.elementor-element-9c91267 .sw-about-one__img {
		flex: 0 0 392px;
	}
	.elementor-element-9c91267 .sw-about-one__img-2 {
		flex: 0 0 350px;
	}
	.elementor-element-9c91267 .sw-about-one__left img {
		width: 100%;
	}
}
/* The banner offer/price badges print even when their field is empty, leaving a blank coloured pill. */
.sw-header-two-banner-one__offer:empty,
.sw-header-two-banner-two__offer:empty,
.sw-banner-three__price:empty,
.sw-main-slider__price:empty {
	display: none;
}
/* Countdown timers removed at the user's request: the templates print the countdown markup (and a
   "Deals ends in" line) even with no date set, so hide the blocks. */
.sw-best-deal__countdown,
.sw-banner-five__countdown,
.sw-ads-countdown__count,
.sw-offer-one__countdown {
	display: none !important;
}

/* Newsletter form: the email field kept a fixed width and pushed "Send Now" past the viewport. */
.sw-newsletter-form__main .wpcf7-form-control-wrap {
	flex: 1 1 auto;
	min-width: 0;
}
.sw-newsletter-form__main input {
	width: 100%;
	max-width: 100%;
}

/* Popular Categories tiles (product-category widget e0325f8): each tile image is now a game logo card,
   so the picture fills the whole cell instead of sitting as an 80px thumbnail in the corner. The tile
   title is kept in the markup for screen readers and becomes the click target laid over the picture. */
body .elementor-element-e0325f8 .sw-cats-two__item {
	padding: 0;
	overflow: hidden;
}
body .elementor-element-e0325f8 .sw-cats-two__item .sw-cats-two__info {
	display: none;
}
body .elementor-element-e0325f8 .sw-cats-two__item .sw-cats-two__img {
	position: static;
	right: auto;
	bottom: auto;
}
body .elementor-element-e0325f8 .sw-cats-two__item .sw-cats-two__img img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}
body .elementor-element-e0325f8 .sw-cats-two__item .sw-cats-two__title {
	position: absolute;
	inset: 0;
	margin: 0;
	z-index: 2;
	font-size: 0;
	line-height: 0;
}
body .elementor-element-e0325f8 .sw-cats-two__item .sw-cats-two__title a {
	display: block;
	width: 100%;
	height: 100%;
	color: transparent;
}

/* "Top Brand" boxes (brand widget 404d1ec on the homepage, fb59e88 on About): the demo logos were small
   transparent PNGs; the boxes now hold the 16:9 game logo cards, so size the card to the box width,
   keep every box the same height, and let two-line names ("Magic: The Gathering") fit. */
body .elementor-element-404d1ec .sw-brand-one__item,
body .elementor-element-fb59e88 .sw-brand-one__item {
	height: 100%;
	min-height: 0;
	justify-content: flex-start;
	padding: 12px 12px 18px;
}
body .elementor-element-404d1ec .sw-brand-one__item > a,
body .elementor-element-fb59e88 .sw-brand-one__item > a {
	display: block;
	width: 100%;
}
body .elementor-element-404d1ec .sw-brand-one__item img,
body .elementor-element-fb59e88 .sw-brand-one__item img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: 8px;
	margin-bottom: 14px;
}
body .elementor-element-404d1ec .sw-brand-one__title,
body .elementor-element-fb59e88 .sw-brand-one__title {
	font-size: 16px;
	line-height: 1.3;
	margin: 0;
}

/* Popular Categories now has 6 game tiles, so on desktop lay them out 3 across (two full rows)
   instead of the theme's 4 across, which would leave two empty cells. */
@media (min-width: 992px) {
	body .elementor-element-e0325f8 .sw-cats-two__wrapper .row > [class*="col-"] {
		flex: 0 0 33.3333%;
		max-width: 33.3333%;
		width: 33.3333%;
	}
}

/* Pokémon Elite Trainer Box grid (product-list widget b3e7a15, replaced the Popular Categories logo grid e0325f8):
   same full-picture side banner as Community Picks, with the Temporal Forces art. */
body .elementor-element-b3e7a15 .sw-best-deal__banner {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	min-height: 520px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
}
@media (min-width: 992px) {
	body .elementor-element-b3e7a15 .sw-best-deal__banner {
		min-height: 590px;
	}
}
body .elementor-element-b3e7a15 .sw-best-deal__banner > img {
	position: absolute;
	inset: 0;
	z-index: -2;
	width: 100%;
	height: 100%;
	max-width: none;
	margin: 0;
	object-fit: cover;
	object-position: center 45%;
}
body .elementor-element-b3e7a15 .sw-best-deal__banner::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.45) 22%, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0) 72%, rgba(0, 0, 0, 0.55) 100%);
}
body .elementor-element-b3e7a15 .sw-best-deal__banner-title,
body .elementor-element-b3e7a15 .sw-best-deal__banner .swiftcart-btn {
	position: relative;
}




/* Phones: the homepage was ~26,400px (33 screens) because every product card stacked one per row.
   Below 768px: product cards 2 across, at most 4 products per section (each section keeps its
   "View all" / "Shop now" link), and the brand boxes / info boxes 2 across. */
@media (max-width: 767px) {
	body .elementor-532 .row > [class*="col-"]:has(> [class*="sw-product"][class*="__item"]) {
		flex: 0 0 50%;
		max-width: 50%;
		width: 50%;
	}
	body .elementor-532 .row > [class*="col-"]:has(> [class*="sw-product"][class*="__item"]):nth-child(n+5) {
		display: none;
	}
	body .elementor-532 .row:has(> [class*="col-"] > [class*="sw-product"][class*="__item"]) {
		--bs-gutter-x: 12px;
		--bs-gutter-y: 12px;
	}
	/* Cards are half as wide now: smaller image box, tighter padding, and titles clamped to 3 lines. */
	body .elementor-532 [class*="sw-product"][class*="__item"] {
		padding-left: 10px;
		padding-right: 10px;
		min-width: 0;
	}
	body .elementor-532 [class*="sw-product"][class*="__item"] img {
		max-width: 100%;
		height: auto;
		max-height: 130px;
		object-fit: contain;
	}
	body .elementor-532 [class*="sw-product"][class*="__item"] .el-pd-title {
		font-size: 14px;
		line-height: 1.35;
		display: -webkit-box;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}
	body .elementor-532 [class*="sw-product"][class*="__item"] .button,
	body .elementor-532 [class*="sw-product"][class*="__item"] .add_to_cart_button {
		font-size: 13px;
		padding-left: 10px;
		padding-right: 10px;
		white-space: nowrap;
		max-width: 100%;
	}
	/* Top Brand boxes: 2 across (the theme only goes 2-up from 576px). */
	body .elementor-532 .sw-brand-one .row > [class*="col-"] {
		flex: 0 0 50%;
		max-width: 50%;
		width: 50%;
	}
	body .elementor-532 .sw-brand-one__title {
		font-size: 14px;
	}
}
@media (max-width: 767px) {
	/* Half-width cards: tighter spacing and a compact rating row. */
	body .elementor-532 [class*="sw-product"][class*="__item"] {
		padding-top: 14px;
		padding-bottom: 14px;
	}
	body .elementor-532 [class*="sw-product"][class*="__item"] [class*="__img"] {
		margin-bottom: 10px;
	}
	body .elementor-532 [class*="sw-product"][class*="__item"] [class*="__price"] {
		margin-bottom: 6px;
	}
	body .elementor-532 [class*="sw-product"][class*="__item"] [class*="__title"] {
		margin-bottom: 10px;
	}
	body .elementor-532 [class*="sw-product"][class*="__item"] .el-pd-ratting {
		margin-bottom: 8px;
		font-size: 12px;
		line-height: 1.2;
		min-height: 0;
	}
	/* The two promo banners (Generations / Sleep) were 440px tall each on phones. */
	body .elementor-element-454649b .sw-banner-three__item,
	body .elementor-element-ac78ab2 .sw-banner-three__item {
		min-height: 380px;
	}
}
@media (max-width: 767px) {
	/* Add to cart + wishlist heart must fit a half-width card. */
	body .elementor-532 [class*="sw-product"][class*="__btns"] {
		gap: 6px;
		min-width: 0;
	}
	body .elementor-532 [class*="sw-product"][class*="__btns"] .button {
		padding-left: 8px;
		padding-right: 8px;
		font-size: 12px;
		min-width: 0;
	}
}
@media (max-width: 359px) {
	/* Smallest phones: the heart drops under the button instead of poking out of the card. */
	body .elementor-532 [class*="sw-product"][class*="__btns"] {
		flex-wrap: wrap;
		justify-content: center;
	}
}
@media (max-width: 767px) {
	/* Hero: hide the two side banners (Paldean Fates / Journey Together, container 5fb3e8c) on phones,
	   so the slider sits straight under the header. Saves ~520px. */
	body .elementor-532 .elementor-element-5fb3e8c {
		display: none;
	}
	/* Two "New Arrivals" sections on phones: hide the booster-pack list (container 8f9688b); its products
	   are in the tabbed New Arrivals section's "Booster Packs" tab. Saves ~1,100px. */
	body .elementor-532 .elementor-element-8f9688b {
		display: none;
	}
	/* The tabbed section now has 5 tabs: one swipeable row instead of wrapping onto several lines. */
	body .elementor-element-3820311 .sw-best-deal__filter-btn {
		flex-wrap: nowrap;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		max-width: 100%;
	}
	body .elementor-element-3820311 .sw-best-deal__filter-btn::-webkit-scrollbar {
		display: none;
	}
	body .elementor-element-3820311 .sw-best-deal__filter-btn .tab-btn {
		flex: 0 0 auto;
		white-space: nowrap;
	}
}

/* Pokémon palette (replaces the sky-blue accent). Official brand colours:
   blue #2a75bb (logo lettering outline), yellow #ffcb05 (logo lettering), navy #003a70, Poké Ball red #ee1515.
   --swiftcart-base drives buttons, links, badges and the header bar; --swiftcart-secondary drives the
   theme's red highlights. */
:root {
	--swiftcart-base: #2a75bb;
	--swiftcart-base-rgb: 42, 117, 187;
	--swiftcart-secondary: #ee1515;
	--swiftcart-secondary-rgb: 238, 21, 21;
}
/* Header: thin top strip in Pokémon yellow with navy text (the theme hard-codes it #0965d0). */
.sw-header-two__top {
	background-color: #ffcb05;
}
.sw-header-two__top,
.sw-header-two__top a,
.sw-header-two__top span,
.sw-header-two__top p,
.sw-header-two__top i,
.sw-header-two__top select,
.sw-header-two__top button {
	color: #003a70;
}
/* Footer (Footer One template): near-black -> Pokémon navy, yellow link hovers. */
body .elementor-element.elementor-element-f4bf176 {
	background-color: #003a70 !important;
}
body .elementor-element.elementor-element-0c9aaa2 {
	background-color: #002a52 !important;
}
body .elementor-element-f4bf176 a:hover,
body .elementor-element-0c9aaa2 a:hover {
	color: #ffcb05 !important;
}
/* Newsletter "Send Now" button: Pokémon yellow, red on hover. */
body .elementor-element-c2223ca button,
body .elementor-element-c2223ca input[type="submit"] {
	background-color: #ffcb05;
	color: #003a70;
	border-color: #ffcb05;
}
body .elementor-element-c2223ca button:hover,
body .elementor-element-c2223ca input[type="submit"]:hover {
	background-color: #ee1515;
	color: #fff;
	border-color: #ee1515;
}
/* Footer body text/links: the theme grey (#929fa5) was designed for near-black; lighten it for navy. */
body .elementor-element-f4bf176 a,
body .elementor-element-f4bf176 li,
body .elementor-element-f4bf176 p,
body .elementor-element-0c9aaa2 p,
body .elementor-element-0c9aaa2 span,
body .elementor-element-0c9aaa2 a {
	color: #d0dae6;
}

/* Add to cart buttons (product cards, shop grid, single product page): Pokémon yellow with navy text,
   Poké Ball red on hover. !important beats WooCommerce's own .woocommerce a.button / button.alt colours. */
a.add_to_cart_button,
button.add_to_cart_button,
.single_add_to_cart_button,
.woocommerce a.button.add_to_cart_button,
.woocommerce button.button.single_add_to_cart_button,
.woocommerce button.button.alt.single_add_to_cart_button {
	background-color: #ffcb05 !important;
	color: #003a70 !important;
	border-color: #ffcb05 !important;
}
a.add_to_cart_button:hover,
a.add_to_cart_button:focus-visible,
button.add_to_cart_button:hover,
.single_add_to_cart_button:hover,
.single_add_to_cart_button:focus-visible,
.woocommerce a.button.add_to_cart_button:hover,
.woocommerce button.button.single_add_to_cart_button:hover,
.woocommerce button.button.alt.single_add_to_cart_button:hover {
	background-color: #ee1515 !important;
	color: #fff !important;
	border-color: #ee1515 !important;
}

/* Homepage banner buttons ("Shop Now" etc.): Pokémon yellow with navy text, Poké Ball red on hover,
   matching the Add to cart buttons. Scoped to the banner widgets so other .swiftcart-btn buttons
   (forms, contact page) keep the blue: hero slider af62a89, side banners a14d833 / f0524cf, promo banners
   454649b / ac78ab2, wide banner 9730bed, picture panels of 2f5f0b7 / b3e7a15, Sealed Products banner e73e29d. */
body .elementor-element-af62a89 .swiftcart-btn,
body .elementor-element-a14d833 .swiftcart-btn,
body .elementor-element-f0524cf .swiftcart-btn,
body .elementor-element-454649b .swiftcart-btn,
body .elementor-element-ac78ab2 .swiftcart-btn,
body .elementor-element-9730bed .swiftcart-btn,
body .elementor-element-2f5f0b7 .sw-best-deal__banner .swiftcart-btn,
body .elementor-element-b3e7a15 .sw-best-deal__banner .swiftcart-btn,
body .elementor-element-e73e29d .sw-banner-five .swiftcart-btn {
	background-color: #ffcb05;
	color: #003a70;
}
body .elementor-element-af62a89 .swiftcart-btn:hover,
body .elementor-element-a14d833 .swiftcart-btn:hover,
body .elementor-element-f0524cf .swiftcart-btn:hover,
body .elementor-element-454649b .swiftcart-btn:hover,
body .elementor-element-ac78ab2 .swiftcart-btn:hover,
body .elementor-element-9730bed .swiftcart-btn:hover,
body .elementor-element-2f5f0b7 .sw-best-deal__banner .swiftcart-btn:hover,
body .elementor-element-b3e7a15 .sw-best-deal__banner .swiftcart-btn:hover,
body .elementor-element-e73e29d .sw-banner-five .swiftcart-btn:hover {
	background-color: #ee1515;
	color: #fff;
}

/* Footer newsletter band (c2223ca): background photo removed at the user's request, so the 87% blue
   overlay would sit over nothing and look washed out. Make the band solid Pokémon blue instead. */
body .elementor-element-c2223ca .sw-newsletter-form {
	background-image: none !important;
	background-color: var(--swiftcart-base);
}
body .elementor-element-c2223ca .sw-newsletter-form::before {
	background-color: var(--swiftcart-base);
	opacity: 1;
}

/* ============================================================================================
   Pokémon skin ("make the site feel like a Pokémon site"). Builds on the palette above:
   blue #2a75bb, yellow #ffcb05, navy #003a70, red #ee1515.
   ============================================================================================ */

/* 1. Rounded, bold headings (Fredoka, self-hosted in fonts/fonts.css); body text stays Public Sans. */
:root {
	--swiftcart-heading-font: "Fredoka", "Inter", sans-serif;
}

/* 2. Section titles: navy, heavier, with a short yellow swoosh underneath. */
.sw-sec-heading__title {
	color: #003a70;
	font-weight: 600;
	letter-spacing: 0;
}
.sw-sec-heading.text-white .sw-sec-heading__title {
	color: #fff;
}

/* 3. Section labels ("Categories", "Fresh Stock"…): the theme's little blue pill becomes a Poké Ball. */
.sw-sec-heading-two .sw-sec-heading__subtitle.has-before::before {
	width: 18px;
	height: 18px;
	border-radius: 50%;
	box-sizing: border-box;
	border: 2px solid #1c1c1c;
	background:
		radial-gradient(circle at 50% 50%, #fff 0 2.5px, #1c1c1c 2.6px 4.6px, transparent 4.7px),
		linear-gradient(to bottom, #ee1515 0 44%, #1c1c1c 44% 56%, #fff 56% 100%);
	flex: 0 0 18px;
}
.sw-sec-heading__subtitle {
	color: #2a75bb;
	gap: 8px;
}

/* 4. Product cards: rounded like trading cards, yellow edge + lift on hover; prices in navy. */
.sw-product-six__item,
.sw-product-seven__item {
	border-radius: 16px;
	border: 2px solid #e3eaf4;
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.sw-product-six__item:hover,
.sw-product-seven__item:hover {
	border-color: #ffcb05;
	box-shadow: 0 4px 12px rgba(0, 58, 112, 0.08);
}
.sw-product-three__item {
	transition: box-shadow 0.25s ease;
}
.sw-product-three__item:hover {
	box-shadow: inset 0 0 0 2px #ffcb05;
}
.el-pd-price,
.el-pd-price .amount {
	color: #003a70;
	font-weight: 700;
}
.el-pd-title,
.el-pd-title a {
	font-weight: 600;
}

/* 5. Buttons: rounded "Pokémon UI" pills in the display font. */
.swiftcart-btn,
.swiftcart-btn-black,
a.add_to_cart_button,
.single_add_to_cart_button,
body .elementor-element-c2223ca button {
	border-radius: 10px;
	font-family: var(--swiftcart-heading-font);
	font-weight: 600;
	letter-spacing: 0.2px;
}

/* 6. Headers: the inner-page header (sw-header-one) was black; make it Pokémon blue like the homepage
   header, and give both a yellow stripe along the bottom edge of the blue bar. */
.sw-header-one {
	background-color: #2a75bb;
}
.sw-header-one,
.sw-header-two {
	border-bottom: 3px solid #ffcb05;
}
.sw-header-one__wrapper a:not(.sub-menu a):hover,
.sw-header-two__wrapper a:not(.sub-menu a):hover {
	color: #ffcb05;
}
/* The inner-page header carries Bootstrap's .bg-black (black !important); beat it with the same weight. */
.sw-header-one.bg-black {
	background-color: #2a75bb !important;
}

/* Text pages (legal pages etc. on the default page template): readable heading sizes and a comfortable
   line length now that the blog sidebar is gone. */
body.page-template-default .blog-details-page-content {
	max-width: 860px;
	margin-left: auto;
	margin-right: auto;
}
body.page-template-default .blog-details-page-content h2.wp-block-heading {
	font-size: 24px;
	line-height: 1.3;
	color: #003a70;
	margin-top: 32px;
	margin-bottom: 10px;
}
body.page-template-default .blog-details-page-content p,
body.page-template-default .blog-details-page-content li {
	font-size: 16px;
	line-height: 1.7;
}
body.page-template-default .blog-details-page-content ul.wp-block-list {
	padding-left: 22px;
	margin-bottom: 16px;
}
body.page-template-default .blog-details-page-content li {
	list-style: disc;
	margin-bottom: 6px;
}
@media (max-width: 767px) {
	body.page-template-default .blog-details-page-content h2.wp-block-heading {
		font-size: 20px;
		margin-top: 24px;
	}
}

/* Homepage "What collectors say" reviews section ([tcg_reviews], container c7a1e05). */
.tcg-reviews {
	padding: 0 0 80px;
}
.tcg-reviews__heading {
	margin-bottom: 30px;
}
.tcg-reviews__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
}
.tcg-reviews__card {
	margin: 0;
	background: #fff;
	border: 1px solid #e3eaf4;
	border-radius: 14px;
	padding: 22px 24px;
	display: flex;
	flex-direction: column;
	gap: 14px;
	box-shadow: 0 2px 10px rgba(0, 42, 82, 0.05);
}
/* Header: initials circle + name with small stars underneath. */
.tcg-reviews__head {
	display: flex;
	align-items: center;
	gap: 12px;
}
.tcg-reviews__avatar {
	flex: 0 0 44px;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 0.5px;
}
.tcg-reviews__id {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}
.tcg-reviews__name {
	font-size: 16px;
	color: #1c1c1c;
	line-height: 1.3;
}
.tcg-reviews__stars {
	font-size: 15px;
	letter-spacing: 1px;
	line-height: 1;
}
.tcg-reviews__stars .on {
	color: #f5a623;
}
.tcg-reviews__stars .off {
	color: #d9dde3;
}
.tcg-reviews__text {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 16px;
	line-height: 1.6;
	color: #1c1c1c;
	flex: 1 1 auto;
}
.tcg-reviews__who {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 10px;
	font-size: 14px;
	color: #003a70;
}
.tcg-reviews__verified {
	background: #e7f6ec;
	color: #1b7a3a;
	border-radius: 999px;
	padding: 2px 10px;
	font-size: 12px;
	font-weight: 600;
}
.tcg-reviews__product {
	flex-basis: 100%;
	color: #2a75bb;
	font-size: 13px;
	line-height: 1.4; /* the theme's link line-height (~28px) spread wrapped product names apart */
}
.tcg-reviews__empty {
	max-width: 640px;
	margin: 0 auto;
	text-align: center;
	background: #fff;
	border: 2px dashed #cfdcec;
	border-radius: 16px;
	padding: 24px 28px;
}
.tcg-reviews__empty p {
	margin: 0;
	font-size: 16px;
	line-height: 1.6;
	color: #003a70;
}
@media (max-width: 991px) {
	.tcg-reviews__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media (max-width: 575px) {
	.tcg-reviews__grid {
		grid-template-columns: 1fr;
	}
}


/* Blog: the demo posts have no author (user #0), so the byline is an empty link to /author/ (404). Hide the
   byline whenever its author link is empty; a real author with a display name will show normally. */
.byline:has(.author a:empty) {
	display: none !important;
}

/* Quantity boxes: the theme gives every input 29px side padding and 60px height, which left WooCommerce's
   58px-wide quantity field with no room for the number (cart showed "– [blank] +"). */
.wc-block-components-quantity-selector {
	height: 42px;
	min-width: 112px;
	border-radius: 8px;
	align-items: stretch;
}
body .wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input {
	padding: 0 !important;
	margin: 0;
	height: auto;
	min-height: 0;
	width: auto;
	min-width: 2.5em;
	flex: 1 1 auto;
	font-size: 16px;
	font-weight: 600;
	line-height: normal;
	color: #1c1c1c;
	text-align: center;
	-moz-appearance: textfield;
}
body .wc-block-components-quantity-selector .wc-block-components-quantity-selector__button {
	min-width: 34px;
	font-size: 18px;
	color: #003a70;
}
/* Classic quantity field (product page / classic cart). */
body .quantity input.qty {
	padding-left: 6px !important;
	padding-right: 6px !important;
	min-width: 3.5em;
	text-align: center;
	color: #1c1c1c;
	font-size: 16px;
}

/* Classic checkout: the theme leaves "Place order" as plain grey text (transparent, 29px). Make it the same
   yellow buy button as Add to cart, full width and easy to tap. */
body.woocommerce-checkout #place_order,
body.woocommerce-checkout .woocommerce #payment #place_order {
	display: block;
	width: 100%;
	min-height: 54px;
	padding: 14px 24px;
	margin-top: 16px;
	background-color: #ffcb05 !important;
	color: #003a70 !important;
	border: 0 !important;
	border-radius: 10px;
	font-family: var(--swiftcart-heading-font);
	font-size: 18px;
	font-weight: 600;
	letter-spacing: 0.2px;
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease;
}
body.woocommerce-checkout #place_order:hover,
body.woocommerce-checkout #place_order:focus-visible {
	background-color: #ee1515 !important;
	color: #fff !important;
}

/* Homepage info boxes (aff768e): keep all four the same height even if one line wraps. */
body .elementor-element-aff768e .row > [class*="col-"] {
	display: flex;
}
body .elementor-element-aff768e .row > [class*="col-"] > [class*="__item"] {
	flex: 1 1 auto;
	height: 100%;
}

/* Homepage: consecutive product sections each added 80px (bottom of one + top of the next = ~160px of empty
   background). Drop the top padding of the sections that follow another product section. */
body .elementor-element-3820311 .sw-best-deal {
	padding-top: 0;
}
body .elementor-element-b3e7a15 > .elementor-widget-container,
body .elementor-element.elementor-element-b3e7a15 {
	padding-top: 0 !important;
}

/* Product page: "Hot release: limit N per customer" note under the price. */
.tcg-limit-note {
	display: inline-block;
	margin: 4px 0 14px;
	padding: 4px 12px;
	background: #fff4c2;
	color: #003a70;
	border-radius: 999px;
	font-size: 14px;
	font-weight: 600;
}

/* 404 page (child 404.php): "4 [Poké Ball] 4", search, game links, newest products. */
.tcg-404__code {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 14px;
	font-family: var(--swiftcart-heading-font);
	font-size: 150px;
	font-weight: 700;
	line-height: 1;
	color: #003a70;
	margin-bottom: 20px;
}
.tcg-404__ball {
	position: relative;
	display: inline-block;
	width: 118px;
	height: 118px;
	border-radius: 50%;
	border: 7px solid #1c1c1c;
	background: linear-gradient(to bottom, #ee1515 0 46%, #1c1c1c 46% 54%, #fff 54% 100%);
	animation: tcg-404-wobble 2.4s ease-in-out infinite;
	transform-origin: 50% 90%;
}
.tcg-404__ball::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 36px;
	height: 36px;
	margin: -18px 0 0 -18px;
	border-radius: 50%;
	background: #fff;
	border: 7px solid #1c1c1c;
	box-sizing: border-box;
}
@keyframes tcg-404-wobble {
	0%, 55%, 100% { transform: rotate(0); }
	65% { transform: rotate(-14deg); }
	75% { transform: rotate(12deg); }
	85% { transform: rotate(-6deg); }
}
@media (prefers-reduced-motion: reduce) {
	.tcg-404__ball { animation: none; }
}
.tcg-404__title {
	font-size: 40px;
	color: #003a70;
	margin-bottom: 12px;
}
.tcg-404__info {
	max-width: 560px;
	margin: 0 auto 28px;
	font-size: 17px;
}
.tcg-404__search {
	display: flex;
	gap: 10px;
	max-width: 560px;
	margin: 0 auto 24px;
}
body .tcg-404__search input[type="search"] {
	flex: 1 1 auto;
	min-width: 0;
	height: 54px;
	padding: 0 20px;
	border: 2px solid #e3eaf4;
	border-radius: 999px;
	background: #fff;
	font-size: 16px;
}
.tcg-404__search input[type="search"]:focus {
	border-color: #2a75bb;
	outline: none;
}
.tcg-404__search .swiftcart-btn {
	flex: 0 0 auto;
	height: 54px;
	padding: 0 26px;
	border: 0;
}
.tcg-404__games {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	list-style: none;
	margin: 0 auto 30px;
	padding: 0;
	max-width: 760px;
}
.tcg-404__games a {
	display: inline-block;
	padding: 8px 18px;
	border: 2px solid #e3eaf4;
	border-radius: 999px;
	color: #003a70;
	font-weight: 600;
	transition: border-color 0.2s ease, background-color 0.2s ease;
}
.tcg-404__games a:hover,
.tcg-404__games a:focus-visible {
	border-color: #ffcb05;
	background: #fff4c2;
}
.tcg-404__buttons {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
}
body .tcg-404__buttons .swiftcart-btn {
	background: #ffcb05;
	color: #003a70;
}
body .tcg-404__buttons .swiftcart-btn:hover {
	background: #ee1515;
	color: #fff;
}
body .tcg-404__buttons .tcg-404__btn-alt {
	background: #2a75bb;
	color: #fff;
}
.tcg-404__latest {
	margin-top: 70px;
}
.tcg-404__latest-title {
	text-align: center;
	font-size: 28px;
	color: #003a70;
	margin-bottom: 26px;
}
@media (max-width: 767px) {
	.tcg-404__code {
		font-size: 96px;
		gap: 8px;
	}
	.tcg-404__ball {
		width: 76px;
		height: 76px;
		border-width: 5px;
	}
	.tcg-404__ball::after {
		width: 26px;
		height: 26px;
		margin: -13px 0 0 -13px;
		border-width: 5px;
	}
	.tcg-404__title {
		font-size: 28px;
	}
	.tcg-404__search .swiftcart-btn {
		padding: 0 18px;
	}
	/* "Fresh stock": 2 per row on phones, like the homepage. The theme lays the grid out with absolutely
	   positioned items (isotope), so switch it to a plain CSS grid here. */
	body .tcg-404__latest .vs-shop-product-grid {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px;
		height: auto !important;
		margin: 0;
	}
	body .tcg-404__latest .vs-shop-product-grid > .swiftcart-product-main {
		position: static !important;
		width: auto !important;
		max-width: none;
		padding: 0;
		margin: 0;
	}
	body .tcg-404__latest .sw-product-six__item {
		height: 100%;
		padding: 12px;
		display: flex;
		flex-direction: column;
	}
	body .tcg-404__latest .sw-product-six__img,
	body .tcg-404__latest .sw-product-six__img img {
		width: 100%;
		height: auto;
	}
	body .tcg-404__latest .sw-product-six__price {
		font-size: 16px;
		margin: 8px 0 4px;
	}
	body .tcg-404__latest .sw-product-six__title {
		font-size: 14px;
		line-height: 1.35;
		margin-bottom: 6px;
		display: -webkit-box;
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}
	body .tcg-404__latest .sw-product-six__ratting .details-rating > span {
		display: none;
	}
	body .tcg-404__latest .sw-product-six__ratting i {
		font-size: 12px;
	}
	body .tcg-404__latest .sw-product-six__btns {
		margin-top: auto;
		display: flex;
		align-items: center;
		gap: 6px;
		width: 100%;
	}
	body .tcg-404__latest .sw-product-six__btns .product__add-to-cart {
		flex: 1 1 auto;
		min-width: 0;
	}
	body .tcg-404__latest .sw-product-six__btns .add_to_cart_button {
		display: block;
		width: 100%;
		padding: 8px 6px;
		font-size: 13px;
		line-height: 1.2;
		text-align: center;
		white-space: nowrap;
	}
}

/* Header search: live product suggestions (js/tcg-live-search.js). */
.tcg-live-search {
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	right: 0;
	z-index: 1000;
	max-height: 420px;
	overflow-y: auto;
	background: #fff;
	border: 2px solid #e3eaf4;
	border-radius: 14px;
	box-shadow: 0 12px 30px rgba(0, 42, 82, 0.18);
	text-align: left;
	padding: 6px;
}
.tcg-live-search[hidden] {
	display: none;
}
.tcg-live-search__item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 8px 10px;
	border-radius: 10px;
	color: #1c1c1c;
	text-decoration: none;
}
.tcg-live-search__item:hover,
.tcg-live-search__item.is-active {
	background: #fff4c2;
	color: #003a70;
}
.tcg-live-search__item img {
	flex: 0 0 48px;
	width: 48px;
	height: 48px;
	object-fit: contain;
	border-radius: 6px;
	background: #fff;
}
.tcg-live-search__text {
	display: flex;
	flex-direction: column;
	min-width: 0;
}
.tcg-live-search__name {
	font-size: 14px;
	line-height: 1.3;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}
.tcg-live-search__price {
	font-size: 14px;
	font-weight: 700;
	color: #003a70;
}
.tcg-live-search__all {
	justify-content: center;
	margin-top: 4px;
	border-top: 1px solid #e3eaf4;
	border-radius: 0 0 10px 10px;
	font-weight: 600;
	color: #2a75bb;
}
.tcg-live-search__empty {
	padding: 12px;
	font-size: 14px;
	color: #555;
}

/* TCGCARDLEGEND logo (936x138 image, shown at 1/3 size or smaller). Headers, side menu and footer. */
img[src*="tcgcardlegend-logo"] {
	width: 260px;
	max-width: 100%;
	height: auto;
}
@media (max-width: 575px) {
	header img[src*="tcgcardlegend-logo"] {
		width: 200px;
	}
}
@media (max-width: 359px) {
	header img[src*="tcgcardlegend-logo"] {
		width: 170px;
	}
}

/* Phones/tablets (<1200px, where the theme hides the header search): search button + slide-down bar. */
.tcg-msearch-btn {
	display: none;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin-right: 6px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: #fff; /* Both headers are Pokémon blue; matches the white menu icon. */
	cursor: pointer;
	vertical-align: middle;
}
.tcg-msearch-btn:hover,
.tcg-msearch-btn.is-open {
	color: #ffcb05 !important;
}
.tcg-msearch-btn:focus-visible {
	outline: 2px solid #ffcb05;
	outline-offset: 2px;
}
.tcg-msearch {
	background: #003a70;
	padding: 12px 16px;
	position: relative;
	z-index: 50;
}
.tcg-msearch[hidden] {
	display: none;
}
.tcg-msearch__form {
	position: relative;
	display: flex;
	max-width: 720px;
	margin: 0 auto;
}
body .tcg-msearch__form input[type="search"] {
	flex: 1 1 auto;
	min-width: 0;
	height: 46px;
	padding: 0 56px 0 18px;
	border: 0;
	border-radius: 999px;
	background: #fff;
	color: #1c1c1c;
	font-size: 16px; /* 16px stops iOS zooming in on focus */
}
.tcg-msearch__submit {
	position: absolute;
	top: 4px;
	right: 4px;
	width: 38px;
	height: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: #ffcb05;
	color: #003a70;
	cursor: pointer;
}
.tcg-msearch__submit:hover {
	background: #ee1515;
	color: #fff;
}
@media (max-width: 1199px) {
	.tcg-msearch-btn {
		display: inline-flex;
	}
	/* Line the search icon up with the menu icon (the wrapper was a baseline-aligned block). The theme's
	   d-lg-none / d-xl-none use !important, so they still hide the wrapper where they should. */
	.sw-header-one__hamburger,
	.sw-header-two__hamburger {
		display: flex;
		align-items: center;
	}
}
@media (min-width: 1200px) {
	.tcg-msearch {
		display: none !important;
	}
}

/* Private review preview banner (inc/tcg-review-preview.php; only with the secret ?review_preview= key). */
.tcg-rp-banner {
	position: fixed;
	left: 12px;
	right: 12px;
	bottom: 12px;
	z-index: 100000;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 6px 14px;
	padding: 10px 16px;
	background: #ee1515;
	color: #fff;
	border-radius: 12px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
	font-size: 14px;
	line-height: 1.4;
	text-align: center;
}
.tcg-rp-banner a {
	color: #ffcb05;
	font-weight: 700;
	text-decoration: underline;
}
@media (max-width: 575px) {
	.tcg-rp-banner span {
		display: none;
	}
}
/* Review text: the theme capitalises every word in blockquotes; keep normal sentence case. */
.tcg-reviews .tcg-reviews__text,
.tcg-reviews .tcg-reviews__text p {
	text-transform: none !important;
}
/* The theme styles every blockquote with a big blue quote icon and a grey panel, which sat on top of
   the review text. Plain text in the review cards. */
body .tcg-reviews blockquote.tcg-reviews__text {
	background: none !important;
	padding: 0 !important;
	margin: 0 !important;
	border: 0 !important;
	font-style: normal;
	font-size: 16px;
	line-height: 1.6;
	color: #1c1c1c;
	position: static;
}
body .tcg-reviews blockquote.tcg-reviews__text::before,
body .tcg-reviews blockquote.tcg-reviews__text::after {
	content: none !important;
	display: none !important;
}

/* YayCurrency's switcher (header top bar + under every product price) only offers USD, the shop's single
   currency, so it's clutter. Hidden rather than deactivated, because theme templates call it. */
.yay-currency-single-page-switcher,
.sw-header-two__currency,
.sw-header-one__currency {
	display: none !important;
}

.tcg-rp-note {
	margin-top: 16px;
	padding: 10px 14px;
	border: 2px dashed #cfdcec;
	border-radius: 12px;
	font-size: 14px;
	color: #555;
}

/* Phone side menu: the theme prints envelope/phone icons with no email or number yet. Hide until real
   contact details are added (remove this rule then). */
.sw-mobile-nav__contact {
	display: none !important;
}

/* Phones (<992px, where the theme hides its cart link): cart icon with item count, beside search. */
.tcg-mcart-btn {
	display: none;
	position: relative;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin-right: 4px;
	color: #fff;
	text-decoration: none;
}
.tcg-mcart-btn:hover,
.tcg-mcart-btn:focus-visible {
	color: #ffcb05;
}
.tcg-mcart-btn:focus-visible {
	outline: 2px solid #ffcb05;
	outline-offset: 2px;
	border-radius: 50%;
}
/* !important: the inner-page header's own badge rule (sw-header-one) clears the background. */
body header .tcg-mcart-btn .cart-count {
	display: inline-block !important;
	visibility: visible !important;
	opacity: 1 !important;
	position: absolute !important;
	top: 1px !important;
	right: 0 !important;
	left: auto !important;
	min-width: 18px;
	height: 18px !important;
	width: auto !important;
	padding: 0 5px !important;
	border-radius: 999px !important;
	background: #ffcb05 !important;
	color: #003a70 !important;
	font-size: 11px !important;
	font-weight: 700;
	line-height: 18px !important;
	text-align: center;
	transform: none !important;
}
@media (max-width: 991px) {
	.tcg-mcart-btn {
		display: inline-flex;
	}
}

/* Product card badge stack, top-left (tcg-shop-extras.php): WHOLESALE 5+, sale "-N%", "Only N left". */
.swiftcart-product-main,
.sw-product-six__item,
.sw-product-seven__item {
	position: relative;
}
/* Shop/category cards: the stack is printed at the start of the card, so inset it like the card padding. */
.swiftcart-product-main > .tcg-badges {
	top: 14px;
	left: 14px;
}
/* The badges sit on the product picture (wrapper added around each card thumbnail). */
.tcg-thumb-wrap {
	position: relative;
	display: block;
}
.tcg-badges {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 5px;
	pointer-events: none;
}
.tcg-badge {
	display: inline-block;
	padding: 2px 9px;
	border-radius: 6px;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.5;
	white-space: nowrap;
}
.tcg-badge--wholesale {
	background: #ffcb05;
	color: #003a70;
	border: 1.5px solid #003a70;
	text-transform: uppercase;
	letter-spacing: 0.3px;
}
.tcg-badge--sale,
.tcg-low-stock {
	background: #ee1515;
	color: #fff;
	border-radius: 999px;
}
/* The theme's own sale flags duplicated the "-N%" badge (sw-product-six__offer in the Elementor cards,
   WooCommerce "Sale!" in shop loops). */
.sw-product-six__offer,
.swiftcart-product-main .onsale {
	display: none !important;
}
/* Product page: wholesale offer line + "-N%" sale flash. */
.tcg-wholesale-note {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 4px 0 12px;
	font-size: 15px;
	color: #003a70;
}
.single-product .onsale.tcg-onsale {
	background: #ee1515;
	color: #fff;
	border-radius: 999px;
	padding: 4px 12px;
	font-weight: 700;
	min-height: 0;
	min-width: 0;
	line-height: 1.5;
}

/* Newsletter band (footer, blue): welcome-offer line and the sign-up result message (tcg-welcome-discount). */
.sw-newsletter-form .tcg-wd-offer {
	color: #fff;
	font-size: 17px;
	margin: -6px 0 20px;
}
.sw-newsletter-form .tcg-wd-offer strong {
	color: #ffcb05;
}
.sw-newsletter-form .tcg-wd-consent {
	margin: 14px 0 0;
	font-size: 13px;
	color: #d0dae6;
}
.sw-newsletter-form .tcg-wd-consent a {
	color: #fff;
	text-decoration: underline;
}
.sw-newsletter-form .tcg-wd-consent a:hover {
	color: #ffcb05;
}

/* Footer columns: the about column had no right padding at >=1200px, so its text ran into "Shop". */
body .elementor-element.elementor-element-ffd27fe {
	padding-right: 40px !important;
}
/* Footer columns after the Popular Tag column was removed: about + Shop / Customer service / Company fill
   the row (desktop); on tablets the about text spans the top and the three link columns sit side by side. */
@media (min-width: 1025px) {
	body .elementor-element.elementor-element-ffd27fe {
		--width: 34% !important;
	}
	body .elementor-element.elementor-element-845b4b1,
	body .elementor-element.elementor-element-93f423d,
	body .elementor-element.elementor-element-639ba4e {
		--width: 22% !important;
	}
}
@media (min-width: 768px) and (max-width: 1024px) {
	body .elementor-element.elementor-element-ffd27fe {
		--width: 100% !important;
		padding-right: 0 !important;
		margin-bottom: 20px;
	}
	body .elementor-element.elementor-element-845b4b1,
	body .elementor-element.elementor-element-93f423d,
	body .elementor-element.elementor-element-639ba4e {
		--width: 33.333% !important;
	}
}

/* Footer tag boxes: the theme's dark border (#303639) barely showed on navy. */
.sw-footer-one__widget .tagcloud a {
	border-color: rgba(255, 255, 255, 0.28) !important;
}
.sw-footer-one__widget .tagcloud a:hover {
	border-color: #ffcb05 !important;
}

/* Footer bottom bar: trademark disclaimer + legal links (copyright widget b74204a). */
.sw-footer-one-copyright__text {
	line-height: 1.6;
}
.sw-footer-one-copyright__text .tcg-legal-links {
	display: block;
	margin-top: 6px;
}
.sw-footer-one-copyright__text .tcg-legal-links a {
	color: inherit;
	text-decoration: none;
}
.sw-footer-one-copyright__text .tcg-legal-links a + a::before {
	content: "·";
	margin: 0 10px;
	color: #8aa0b8;
}
.sw-footer-one-copyright__text .tcg-legal-links a:hover {
	color: #ffcb05;
}

body .sw-newsletter-form .wpcf7 form .wpcf7-response-output {
	margin: 16px auto 0;
	padding: 10px 16px;
	border: 2px solid #ffcb05 !important;
	border-radius: 12px;
	background: rgba(0, 42, 82, 0.35);
	color: #fff;
	font-size: 15px;
	line-height: 1.5;
}
body .sw-newsletter-form .wpcf7 form.invalid .wpcf7-response-output,
body .sw-newsletter-form .wpcf7 form.failed .wpcf7-response-output {
	border-color: #fff !important;
}

@media (max-width: 767px) {
	/* Phones: the rating row was hidden on product cards because every card read "☆☆☆☆☆ (0)".
	   Show it again on cards that actually have reviews; keep hiding it on zero-review cards. */
	body .elementor-532 [class*="sw-product"][class*="__item"] .el-pd-ratting:not(:has(.details-rating[title="Rating 0 out of 5"])) {
		display: block;
		margin-bottom: 8px;
	}
}

/* Homepage reviews: first 3 visible, the rest behind the "More reviews" button (see functions.php).
   Desktop/tablet: one row of 3; phones: stacked. */
.tcg-reviews:not(.is-open) .tcg-reviews__card:nth-child(n+4) {
	display: none;
}
.tcg-reviews__more {
	text-align: center;
	margin-top: 26px;
}
.tcg-reviews__more-btn {
	border: 0;
	cursor: pointer;
	min-width: 200px;
}
@media (min-width: 768px) and (max-width: 991px) {
	.tcg-reviews__grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 14px;
	}
	.tcg-reviews__card {
		padding: 16px;
	}
}
@media (max-width: 767px) {
	.tcg-reviews__grid {
		grid-template-columns: 1fr;
	}
}
/* "More reviews" button: Pokémon yellow with navy text, Poké Ball red on hover (like the shopping buttons). */
.tcg-reviews__more .tcg-reviews__more-btn {
	background-color: #ffcb05;
	color: #003a70;
}
.tcg-reviews__more .tcg-reviews__more-btn:hover,
.tcg-reviews__more .tcg-reviews__more-btn:focus-visible {
	background-color: #ee1515;
	color: #fff;
}

/* Shop / category pagination: with many pages the row of numbers was wider than a phone screen
   (page scrolled 56px sideways at 375px). Let it wrap and centre instead. */
.woocommerce-pagination ul.page-numbers,
.woocommerce nav.woocommerce-pagination ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
	max-width: 100%;
	border: 0;
}
.woocommerce-pagination ul.page-numbers li,
.woocommerce nav.woocommerce-pagination ul li {
	float: none;
	margin: 0;
}
/* The theme's own pagination (.basic-pagination > nav > ul.page-numbers, inline-flex nowrap) — same fix. */
.basic-pagination nav {
	max-width: 100%;
}
.basic-pagination ul.page-numbers {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
	max-width: 100%;
}
.basic-pagination ul.page-numbers li {
	margin: 0;
}
/* Footer copyright legal links (Terms · Privacy · Cookies · …): the links sit back-to-back in the HTML with
   no spaces, so the row could not wrap and "Accessibility" overflowed on 320px phones. Inline-block links
   give the browser a break point between each link while keeping the row's existing alignment. */
.sw-footer-one-copyright__text .tcg-legal-links a {
	display: inline-block;
	white-space: nowrap;
}

/* Footer copyright text was rendering at the theme's default 16px, too large for a legal disclaimer line. */
.sw-footer-one-copyright__text {
	font-size: 13px;
	line-height: 1.6;
}

/* Homepage "Popular Categories" ticker: replaced plain-text game names with logo tiles
   (category thumbnails). The widget always renders the text title alongside the image,
   so hide the text now that a logo is shown. */
.sw-category-one__item .sw-category-one__title {
	display: none;
}
.sw-category-one__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 8px;
}

/* Shop/category sidebar "shop by game" card filter (see functions.php swiftcart_child_game_filter_cards). */
.tcg-game-filter {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
	margin: 0 0 24px;
	padding: 16px;
	background: #fff;
	border-radius: 8px;
}
.tcg-game-filter__card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	width: 96px;
	padding: 8px;
	border: 1px solid #e5e5e5;
	border-radius: 8px;
	text-align: center;
	text-decoration: none;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.tcg-game-filter__card:hover {
	border-color: #ffc107;
}
.tcg-game-filter__card.is-active {
	border-color: #2d9cdb;
	box-shadow: 0 0 0 1px #2d9cdb;
}
.tcg-game-filter__card img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	border-radius: 6px;
}
.tcg-game-filter__card span {
	font-size: 12px;
	font-weight: 600;
	color: #1c1c1c;
	line-height: 1.3;
}

/* Logo size: the new badge logo is 3:2, so the theme's width:260px made it 173px tall (too big).
   Constrain by height so header/footer logos stay compact. */
.sw-header-one__logo img,
.sw-header-two__logo img,
.logo-box img,
.sw-footer-one__logo img,
.sw-mobile-nav__content .logo-box img {
	width: auto !important;
	height: 92px !important;
	max-width: 100% !important;
}
@media (max-width: 767px) {
	.sw-header-one__logo img,
	.sw-header-two__logo img,
	.logo-box img,
	.sw-mobile-nav__content .logo-box img {
		height: 72px !important;
	}
}

/* Centre the header search bar (shown xl+ only). It normally sits in the right group next to the
   cart/wishlist/account icons; absolutely centring it in the wrapper puts it mid-header with the
   logo on the left and the icons on the right. */
@media (min-width: 1200px) {
	.sw-header-one__wrapper,
	.sw-header-two__wrapper {
		position: relative;
	}
	.sw-header-one__search.d-xl-block,
	.sw-header-two__search.d-xl-block {
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		width: 560px;
		max-width: 42%;
		margin: 0;
	}
}

/* Reduce header height: the blue bar had 20px top/bottom padding around the 110px logo row
   (~153px total). Trim the padding to tighten it while keeping the logo size. */
.sw-header-one,
.sw-header-two {
	padding-top: 6px !important;
	padding-bottom: 6px !important;
}

/* Increase logo size on header AND footer, desktop and mobile (supersedes the earlier
   92px/72px logo rules by coming later with equal specificity). */
.sw-header-one__logo img,
.sw-header-two__logo img,
.logo-box img,
.sw-footer-one__logo img,
.sw-mobile-nav__content .logo-box img {
	height: 115px !important;
}
@media (max-width: 767px) {
	.sw-header-one__logo img,
	.sw-header-two__logo img,
	.logo-box img,
	.sw-footer-one__logo img,
	.sw-mobile-nav__content .logo-box img {
		height: 100px !important;
	}
}

/* Perf/CLS: the hero owl-carousel stacks all 7 slides before it initialises, then collapses to one
   -> large layout shift. Show only the first slide until owl-loaded, and reserve slider height. */
.sw-main-slider__carousel:not(.owl-loaded) .sw-main-slider__item:not(:first-child){
	display: none !important;
}
.sw-main-slider__carousel:not(.owl-loaded){
	overflow: hidden;
}
@media (max-width: 767px){
	.sw-main-slider{ min-height: 600px; }
}

/* Accessibility (WCAG AA contrast): darken the product-card sale badge (white-on-red) and the
   discounted sale price (white-on-green) so text passes contrast. */
.tcg-badge--sale { background-color: #cc0000 !important; }
.sw-product-six__price ins .woocommerce-Price-amount,
.sw-product-six__price ins bdi { background-color: #2e7d0a !important; }

/* a11y contrast (WCAG AA): darken muted grey tab labels + review counts, and the review avatar bg. */
.sw-best-deal__filter-btn li span { color:#595959 !important; }
.sw-best-deal__filter-btn li.active-btn span { color:#1c1c1c !important; }
.details-rating span { color:#595959 !important; }
.tcg-reviews__avatar { background-color:#9c5700 !important; }

/* a11y contrast round 2: Top Brand names (grey), footer legal links (near-invisible light grey),
   and banner subtitle (white on light blue -> add a dark chip so white text passes). */
.sw-brand-one__title, .sw-brand-one__title a { color:#595959 !important; }
.tcg-legal-links a, .tcg-legal-links span, .tcg-legal-links { color:#5a5a5a !important; }
.sw-banner-three__subtitle {
	background-color: rgba(0,0,0,0.45) !important;
	padding: 2px 8px !important;
	border-radius: 4px !important;
	display: inline-block !important;
}

/* a11y target-size (WCAG 2.5.8): enlarge small tap targets to >=24px.
   - carousel dots (were 10px wide): pad the button, keep the visual dot (span) small.
   - Top Brand category name links (were 17px tall): add vertical padding. */
.sw-main-slider .owl-dots .owl-dot,
.sw-main-slider__carousel .owl-dots button {
	min-width: 24px !important;
	min-height: 24px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
}
.sw-brand-one__title a {
	display: inline-block !important;
	padding-top: 4px !important;
	padding-bottom: 4px !important;
}

/* a11y target-size: header search submit button was 22px wide (needs >=24). */
.sw-header-two__search form button[type="submit"],
.sw-header-two__search button[type="submit"] {
	min-width: 24px !important;
	min-height: 24px !important;
}

/* Mobile hero fix: image only covered ~372px of the 600px card, leaving a black gap under the
   overlaid text. Make the slide image cover the whole card + add a readability gradient. */
@media (max-width: 767px) {
	.sw-main-slider__item img {
		height: 100% !important;
		width: 100% !important;
		object-fit: cover !important;
		object-position: 50% 22% !important;
	}
	.sw-main-slider__img::after {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0.05) 30%, rgba(0,0,0,0.55) 65%, rgba(0,0,0,0.82) 100%);
		z-index: 1;
		pointer-events: none;
	}
	.sw-main-slider__content { position: relative; z-index: 2; }
	.sw-main-slider__subtitle,
	.sw-main-slider__title,
	.sw-main-slider__content p { text-shadow: 0 2px 8px rgba(0,0,0,0.75) !important; }
}

/* Shop/archive mobile+tablet: show PRODUCTS above the sidebar (categories/search/filters).
   Columns stack below 992px (col-lg-*); reorder so the products column comes first. */
@media (max-width: 991.98px) {
	body.woocommerce.archive .row.gutter-y-60 > .col-lg-9 { order: -1 !important; }
	body.woocommerce.archive .row.gutter-y-60 > [class*="col-lg-3"] { order: 1 !important; }
}
