/**
 * Toys theme styles.
 *
 * Layout, components and WordPress specific fixes layered on top of the
 * compiled design system in base.css.
 */

/* ==========================================================================
   1. Base / WordPress essentials
   ========================================================================== */

body {
	margin: 0;
	background: rgb(var(--background));
	color: rgb(var(--text-color));
	font-family: var(--text-font-family);
	font-size: calc(var(--base-font-size) - 1px);
	overflow-x: hidden;
}

img {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}

a {
	color: inherit;
	text-decoration: none;
	transition: color 0.2s ease-in-out, opacity 0.2s ease-in-out;
}

a:hover {
	color: rgb(var(--heading-color));
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.screen-reader-text:focus {
	display: block;
	top: 8px;
	left: 8px;
	width: auto;
	height: auto;
	padding: 12px 20px;
	margin: 0;
	clip: auto;
	z-index: 100000;
	background: rgb(var(--background));
	color: rgb(var(--heading-color));
	font-size: 14px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
	border-radius: var(--button-border-radius);
}

/* Skip link + large buttons used by the hero */
.button--large {
	min-height: calc(var(--button-height) + 6px);
	padding: 0 44px;
	font-size: 13px;
}

.skip-link:focus {
	position: fixed !important;
}

/* WordPress core alignment classes inside rich text */
.rte .alignleft {
	float: left;
	margin: 0 24px 24px 0;
}

.rte .alignright {
	float: right;
	margin: 0 0 24px 24px;
}

.rte .aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.rte .wp-caption,
.rte figure {
	max-width: 100%;
	margin: 24px 0;
}

.rte .wp-caption-text,
.rte figcaption {
	font-size: 13px;
	color: rgba(var(--text-color), 0.6);
	margin-top: 8px;
	text-align: center;
}

.rte blockquote {
	margin: 32px 0;
	padding-left: 24px;
	border-left: 3px solid rgb(var(--border-color));
	font-style: italic;
}

.rte ul,
.rte ol {
	padding-left: 20px;
}

.rte li + li {
	margin-top: 8px;
}

.rte table {
	width: 100%;
	border-collapse: collapse;
	margin: 24px 0;
}

.rte th,
.rte td {
	padding: 12px 16px;
	border: 1px solid rgb(var(--border-color));
	text-align: left;
}

.rte img {
	height: auto;
}

/* ==========================================================================
   2. Header
   ========================================================================== */

.announcement-bar {
	min-height: 38px;
	font-size: 12px;
	letter-spacing: 0.02em;
	color: #fff;
	background: rgb(0, 179, 233);
}

.announcement-bar__message {
	margin: 0;
	text-align: center;
	line-height: 1.4;
	padding: 8px 0;
}

.site-header {
	position: relative;
	z-index: 20;
}

/* Logged-in visitors get the WordPress admin bar. Above 600px it is pinned to
   the top of the viewport, so the stuck header has to start below it instead of
   sliding underneath and clipping the logo row. Under 600px WP switches the bar
   to position:absolute, which scrolls away with the page, so the header still
   needs top:0 there - hence the min-width guard. */
@media screen and (min-width: 601px) {
	body.admin-bar .site-header.is-stuck {
		top: var(--wp-admin--admin-bar--height, 32px);
	}
}

.site-header.is-stuck {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	box-shadow: 0 1px 0 rgba(var(--header-border-color), 1), 0 8px 24px rgba(0, 0, 0, 0.06);
	animation: toys-slide-down 0.25s ease;
}

@keyframes toys-slide-down {
	from {
		transform: translateY(-100%);
	}
	to {
		transform: translateY(0);
	}
}

.header__wrapper {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 16px;
}

.header__inline-navigation {
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
}

.header__logo {
	display: flex;
	justify-content: center;
}

.header__logo-link {
	display: block;
	line-height: 0;
}

.header__logo-image {
	width: auto;
	max-width: 220px;
	max-height: 56px;
	object-fit: contain;
}

.header__secondary-links {
	justify-self: end;
}

.header__icon-list {
	display: flex;
	align-items: center;
	gap: 4px;
}

.header__icon-wrapper {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	cursor: pointer;
	border-radius: 50%;
	transition: background 0.2s ease-in-out, color 0.2s ease-in-out;
}

.header__icon-wrapper:hover {
	background: rgba(var(--header-text-color), 0.07);
}

.header__icon-wrapper svg {
	width: 20px;
	height: 20px;
}

.header__cart-link {
	position: relative;
}

.header__cart-count {
	position: absolute;
	top: 2px;
	right: 0;
	min-width: 17px;
	height: 17px;
	padding: 0 4px;
	border-radius: 9px;
	background: rgb(var(--primary-button-background));
	color: rgb(var(--primary-button-text-color));
	font-size: 10px;
	font-weight: 600;
	line-height: 17px;
	text-align: center;
	opacity: 0;
	transform: scale(0.6);
	transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;
}

.header__cart-count.has-items {
	opacity: 1;
	transform: scale(1);
}

.header__linklist {
	display: flex;
	align-items: center;
	gap: 4px;
	margin: 0;
	padding: 0;
}

.header__linklist-item {
	position: relative;
}

.header__linklist-link {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 10px 12px;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.header__linklist-chevron {
	display: inline-flex;
	transition: transform 0.2s ease-in-out;
}

.header__linklist-item:hover .header__linklist-chevron {
	transform: rotate(180deg);
}

/* Dropdown submenus created by the walker (base.css owns the reveal logic) */
.header__linklist-item > .nav-dropdown {
	margin-left: 0;
	min-width: 220px;
	padding: 10px 0;
	background: rgb(var(--background));
	border: 1px solid rgb(var(--border-color));
	border-radius: var(--block-border-radius-reduced);
	box-shadow: 0 16px 40px rgba(var(--text-color), 0.12);
	z-index: 40;
}

.nav-dropdown__link {
	padding: 9px 22px;
	font-size: 14px;
	text-transform: none;
	letter-spacing: 0;
	white-space: nowrap;
	transition: color 0.15s ease-in-out, background 0.15s ease-in-out;
}

.nav-dropdown__link:hover,
.nav-dropdown__item.is-active > .nav-dropdown__link {
	color: rgb(var(--heading-color));
	background: rgb(var(--secondary-background));
}

.nav-dropdown__link:hover {
	opacity: 1;
}

.header__linklist-link[aria-expanded="true"] .header__linklist-chevron {
	transform: rotate(180deg);
}

/* Drawers (reuse base.css [open] semantics) */
body.toys-drawer-open {
	overflow: hidden;
}

.drawer {
	z-index: 100;
}

.drawer__overlay {
	cursor: pointer;
	border: 0;
	padding: 0;
}

.drawer__title {
	gap: 8px;
	font-size: 16px;
}

.drawer__title svg {
	width: 18px;
	height: 18px;
	flex: none;
}

/* Mini cart action buttons live outside the .woocommerce wrapper. */
.widget_shopping_cart_content .buttons a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0 24px;
	border: 1px solid rgb(var(--primary-button-background));
	border-radius: var(--button-border-radius);
	background: rgb(var(--primary-button-background));
	color: rgb(var(--primary-button-text-color));
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-align: center;
	transition: background 0.2s ease-in-out, color 0.2s ease-in-out, border-color 0.2s ease-in-out;
}

.widget_shopping_cart_content .buttons a:hover {
	background: rgb(var(--heading-color));
	border-color: rgb(var(--heading-color));
	color: #fff;
}

.widget_shopping_cart_content .buttons a.checkout {
	background: transparent;
	border-color: rgb(var(--border-color-darker));
	color: rgb(var(--heading-color));
}

.widget_shopping_cart_content .buttons a.checkout:hover {
	background: rgb(var(--heading-color));
	border-color: rgb(var(--heading-color));
	color: #fff;
}

body.admin-bar .drawer {
	top: 32px;
}

@media screen and (max-width: 782px) {
	body.admin-bar .drawer {
		top: 46px;
	}
}

/* Mobile navigation */
.mobile-nav {
	margin: 0;
	padding: 0;
}

.mobile-nav__item {
	border-bottom: 1px solid rgba(var(--root-border-color), 1);
}

.mobile-nav__link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 16px 0;
	border: 0;
	background: none;
	color: inherit;
	font-family: inherit;
	text-align: left;
	cursor: pointer;
}

.animated-plus {
	position: relative;
	display: block;
	width: 12px;
	height: 12px;
	flex: none;
}

.animated-plus:before,
.animated-plus:after {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	width: 12px;
	height: 1.5px;
	background: currentColor;
	transition: transform 0.2s ease-in-out;
}

.animated-plus:after {
	transform: rotate(90deg);
}

.mobile-nav__link[aria-expanded="true"] .animated-plus:after {
	transform: rotate(0deg);
}

.mobile-submenu {
	padding-bottom: 8px;
}

.mobile-submenu[hidden] {
	display: none;
}

.mobile-nav .mobile-nav .mobile-nav__item {
	border-bottom: 0;
}

.mobile-nav__footer {
	display: flex;
	gap: 24px;
	font-size: 13px;
}

.mobile-nav__footer .icon-text {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

/* Search drawer */
.predictive-search__form {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-grow: 1;
	padding-right: 40px;
}

.predictive-search__form svg {
	width: 20px;
	height: 20px;
	flex: none;
	opacity: 0.6;
}

.predictive-search__input {
	width: 100%;
	height: 44px;
	border: 0;
	background: none;
	font-family: inherit;
	font-size: 16px;
	color: inherit;
	outline: none;
}

.predictive-search__content-wrapper {
	padding-top: 24px;
}

.predictive-search__hint {
	margin: 0 0 24px;
}

.predictive-search__suggestions .heading {
	margin-bottom: 12px;
	display: block;
}

/* Mini cart inside the drawer */
.widget_shopping_cart_content .cart_list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.widget_shopping_cart_content .cart_list li {
	position: relative;
	padding: 16px 26px 16px 0;
	border-bottom: 1px solid rgba(var(--root-border-color), 1);
}

/* WooCommerce renders the thumbnail and the product name inside one link. */
.widget_shopping_cart_content .cart_list li > a:not(.remove) {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.45;
}

.widget_shopping_cart_content .cart_list li > a:not(.remove) img {
	width: 64px;
	height: 64px;
	flex: none;
	object-fit: cover;
	border-radius: var(--block-border-radius-reduced);
}

.widget_shopping_cart_content .cart_list li .quantity {
	display: block;
	margin-top: 6px;
	padding-left: 78px;
	font-size: 13px;
	opacity: 0.7;
}

.widget_shopping_cart_content .cart_list li a.remove {
	position: absolute;
	top: 14px;
	right: 0;
	width: 22px;
	height: 22px;
	line-height: 20px;
	text-align: center;
	border-radius: 50%;
	font-size: 16px;
	color: inherit !important;
	background: rgba(var(--root-text-color), 0.06) !important;
}

.widget_shopping_cart_content .cart_list li dl.variation {
	margin: 4px 0 0 78px;
	font-size: 12px;
	opacity: 0.7;
}

.widget_shopping_cart_content .cart_list li a.remove:hover {
	background: rgba(var(--root-text-color), 0.12) !important;
}

.widget_shopping_cart_content .total {
	display: flex;
	justify-content: space-between;
	padding: 20px 0;
	font-weight: 600;
	border-bottom: 0;
}

.widget_shopping_cart_content .buttons {
	display: grid;
	gap: 10px;
	margin: 0;
}

.widget_shopping_cart_content .buttons a {
	width: 100%;
}

.mini-cart__empty {
	padding: 48px 0;
	text-align: center;
}

/* ==========================================================================
   3. Homepage sections
   ========================================================================== */

.home-hero {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 560px;
	overflow: hidden;
	isolation: isolate;
}

.home-hero__media {
	position: absolute;
	inset: 0;
	z-index: -2;
}

.home-hero__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.home-hero__overlay {
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(90deg, rgba(9, 22, 46, 0.66) 0%, rgba(9, 22, 46, 0.38) 45%, rgba(9, 22, 46, 0.1) 100%);
}

.home-hero__container {
	width: 100%;
	padding-top: 64px;
	padding-bottom: 64px;
}

.home-hero__content {
	max-width: 620px;
	color: #fff;
}

.home-hero__eyebrow {
	margin: 0 0 12px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	opacity: 0.85;
}

.home-hero__title {
	margin: 0;
	color: #fff;
	font-size: clamp(34px, 5vw, var(--heading-large-font-size));
	line-height: 1.08;
}

.home-hero__text {
	margin: 20px 0 0;
	max-width: 480px;
	font-size: 17px;
	line-height: 1.6;
	color: rgba(255, 255, 255, 0.88);
}

.home-hero__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px;
	margin-top: 32px;
}

.home-hero__secondary-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #fff;
	font-size: 14px;
	font-weight: 500;
	border-bottom: 1px solid rgba(255, 255, 255, 0.5);
	padding-bottom: 2px;
}

.home-hero__secondary-link:hover {
	color: #fff;
	border-color: #fff;
}

.home-hero__secondary-link svg {
	width: 16px;
	height: 16px;
}

/* Feature trio */
.home-features__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 40px 48px;
	text-align: center;
}

.home-feature__icon {
	margin-bottom: 16px;
	line-height: 0;
}

.home-feature__icon img {
	width: 76px;
	height: 76px;
	object-fit: contain;
}

.home-feature .heading {
	margin-bottom: 8px;
}

.home-feature p {
	margin: 0;
	color: rgba(var(--text-color), 0.72);
	font-size: 15px;
	line-height: 1.65;
}

/* Awards strip */
.home-awards__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 24px 48px;
}

.home-awards__list img {
	width: 132px;
	height: 132px;
	object-fit: contain;
	border-radius: 50%;
	mix-blend-mode: multiply;
}

/* Category mosaic */
.home-categories__header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	margin-bottom: 32px;
}

.home-categories__link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	white-space: nowrap;
}

.home-categories__link svg {
	width: 16px;
	height: 16px;
}

.home-categories__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	grid-auto-rows: 210px;
	gap: 16px;
}

/* Adapt the mosaic to how many categories exist. */
.home-categories__grid[data-count="1"] {
	grid-template-columns: minmax(0, 1fr);
	grid-auto-rows: 340px;
}

.home-categories__grid[data-count="2"] {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-auto-rows: 300px;
}

.home-categories__grid[data-count="3"] {
	grid-template-columns: repeat(3, minmax(0, 1fr));
	grid-auto-rows: 240px;
}

.home-category {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: var(--block-border-radius);
	isolation: isolate;
}

.home-category--large {
	grid-column: span 2;
	grid-row: span 2;
}

.home-category__image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s cubic-bezier(0.2, 0.6, 0.2, 1);
}

.home-category:hover .home-category__image {
	transform: scale(1.04);
}

.home-category__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0.55) 100%);
}

.home-category__content {
	position: absolute;
	inset: auto 0 0 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 24px;
	color: #fff;
}

.home-category__count {
	font-size: 11px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	opacity: 0.8;
}

.home-category__title {
	color: #fff;
	margin: 0;
}

.home-category__cta {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	opacity: 0;
	transform: translateY(6px);
	transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
}

.home-category:hover .home-category__cta {
	opacity: 1;
	transform: translateY(0);
}

.home-category__cta svg {
	width: 14px;
	height: 14px;
}

/* Best sellers block */
.home-best-sellers__header {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	margin-bottom: 32px;
}

.home-best-sellers__header .text-container {
	max-width: 560px;
}

.home-best-sellers__header p {
	margin-top: 12px;
	color: rgba(var(--text-color), 0.7);
}

/* Promo blocks */
.home-promos .image-with-text {
	margin-bottom: var(--vertical-breather);
}

.home-promos .image-with-text:last-child {
	margin-bottom: 0;
}

.image-with-text__text-wrapper {
	margin-top: 16px;
}

.image-with-text__content .section__eyebrow {
	margin-bottom: 8px;
}

/* Trust bar */
.home-trust {
	padding: 40px 0;
	border-top: 1px solid rgb(var(--border-color));
	background: rgb(var(--secondary-background));
}

.home-trust__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 24px;
}

.home-trust__item {
	display: flex;
	align-items: flex-start;
	gap: 14px;
}

.home-trust__item svg {
	width: 26px;
	height: 26px;
	flex: none;
	color: rgb(var(--heading-color));
}

.home-trust__item .heading {
	display: block;
	margin-bottom: 2px;
}

.home-trust__item p {
	margin: 0;
	font-size: 13px;
	color: rgba(var(--text-color), 0.65);
}

/* Shared section bits */
.section__eyebrow {
	margin: 0 0 8px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: rgba(var(--heading-color), 0.65);
}

.section__header--center {
	text-align: center;
	margin-bottom: 40px;
}

.section__header--center .text-container {
	margin-left: auto;
	margin-right: auto;
	max-width: 680px;
}

.text-container {
	max-width: 760px;
}

/* ==========================================================================
   4. Product grid & cards
   ========================================================================== */

.toys-product-grid {
	--section-products-per-row: 4;
	--product-list-column-gap: var(--grid-gap);
}

.toys-product-grid .product-list__inner {
	display: grid;
	grid-template-columns: repeat(var(--section-products-per-row), minmax(0, 1fr));
	gap: var(--grid-gap);
	margin: 0;
	overflow: visible;
}

.toys-product-grid .product-item {
	min-width: 0;
}

.product-item__image-wrapper {
	border-radius: var(--block-border-radius);
	background: rgb(var(--secondary-background));
}

.product-item__aspect-ratio {
	display: block;
	position: relative;
	overflow: hidden;
	border-radius: var(--block-border-radius-reduced);
}

.product-item__aspect-ratio > img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: opacity 0.35s ease-in-out, transform 0.6s ease-in-out;
}

.product-item__secondary-image {
	opacity: 0;
}

.product-item__image-wrapper--multiple:hover .product-item__secondary-image {
	opacity: 1;
}

.product-item__image-wrapper--multiple:hover .product-item__primary-image {
	opacity: 0;
}

.product-item__label-list {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 4px;
}

.product-item .label {
	padding: 3px 8px;
	border-radius: 3px;
}

.product-item .label--highlight {
	background: rgb(var(--product-on-sale-accent));
	color: #fff;
}

.product-item .label--subdued {
	background: rgb(var(--product-sold-out-accent));
	color: #fff;
}

.product-item-meta {
	text-align: center;
}

.product-item-meta__title {
	display: block;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.45;
	color: rgb(var(--heading-color));
}

.product-item-meta__price-list-container {
	margin-top: 6px;
	display: flex;
	justify-content: center;
}

.product-item-meta__price-list-container .price-list,
.product-item-meta__price-list-container .price {
	font-size: 14px;
	font-weight: 600;
}

.product-item-meta__price-list-container del,
.product-meta__price-list-container del {
	margin-right: 8px;
	opacity: 0.55;
	font-weight: 400;
	text-decoration: line-through;
}

.product-item-meta__price-list-container ins,
.product-meta__price-list-container ins {
	text-decoration: none;
}

.product-item-meta__color-count {
	margin: 6px 0 0;
}

.product-item--sold-out .product-item-meta__title {
	color: rgba(var(--heading-color), 0.5);
}

.toys-card__cta {
	font-size: 12px !important;
	letter-spacing: 0.08em !important;
}

.product-item__quick-form .toys-card__cta,
.product-item__image-wrapper > .toys-card__cta {
	background: #fff;
	color: rgb(var(--heading-color));
	border: 0;
}

.product-item__quick-form .toys-card__cta:hover,
.product-item__image-wrapper > .toys-card__cta:hover {
	background: rgb(var(--heading-color));
	color: #fff;
}

/* Empty states */
.toys-empty-state {
	padding: 64px 24px;
	text-align: center;
	border: 1px dashed rgb(var(--border-color));
	border-radius: var(--block-border-radius);
	background: rgb(var(--secondary-background));
}

.toys-empty-state .heading {
	margin-bottom: 8px;
}

.toys-empty-state p {
	margin: 0 0 20px;
	color: rgba(var(--text-color), 0.7);
}

/* ==========================================================================
   5. Page headers, breadcrumbs, pagination
   ========================================================================== */

.page-header {
	padding: calc(var(--vertical-breather) * 0.6) 0 calc(var(--vertical-breather) * 0.4);
	background: rgb(var(--background));
	text-align: center;
	position: relative;
	overflow: hidden;
}

.page-header--shop {
	background: rgb(var(--background));
}

.page-header .breadcrumb {
	margin-bottom: 20px;
	justify-content: center;
	display: flex;
}

.page-header__text-wrapper {
	margin: 0 auto;
}

.page-header__text-wrapper .heading {
	margin: 0;
}

.page-header__description {
	margin: 16px auto 0;
	max-width: 640px;
	color: rgba(var(--text-color), 0.72);
}

.page-header--with-image {
	display: flex;
	align-items: center;
	min-height: 360px;
	padding: calc(var(--vertical-breather) * 1.4) 0;
	color: #fff;
	background: rgb(var(--heading-color));
}

.page-header--with-image .heading,
.page-header--with-image .page-header__description,
.page-header--with-image .breadcrumb a,
.page-header--with-image .breadcrumb span {
	color: #fff;
}

.page-header__media {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.page-header__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.page-header__overlay {
	position: absolute;
	inset: 0;
	background: rgba(9, 22, 46, 0.45);
	z-index: 1;
}

.page-header--with-image .container {
	position: relative;
	z-index: 2;
}

.page-header--post {
	padding-bottom: calc(var(--vertical-breather) * 0.8);
}

.breadcrumb__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.breadcrumb__item + .breadcrumb__item:before {
	content: "/";
	margin-right: 8px;
	opacity: 0.4;
}

.pagination {
	margin-top: 48px;
}

.pagination__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.pagination__item > * {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border: 1px solid rgb(var(--border-color));
	border-radius: var(--button-border-radius);
	font-size: 13px;
	font-weight: 500;
	justify-content: center;
	transition: border-color 0.2s ease-in-out, background 0.2s ease-in-out, color 0.2s ease-in-out;
}

.pagination__item > *:hover {
	border-color: rgb(var(--heading-color));
}

.pagination__item .current {
	background: rgb(var(--heading-color));
	border-color: rgb(var(--heading-color));
	color: #fff;
}

.pagination__item svg {
	width: 14px;
	height: 14px;
}

/* ==========================================================================
   6. Shop archive / facets
   ========================================================================== */

.shop-content {
	padding-top: var(--vertical-breather);
}

.product-facet {
	align-items: flex-start;
}

.product-facet__aside {
	position: sticky;
	top: calc(var(--anchor-offset) - 30px);
	max-height: calc(100vh - var(--anchor-offset));
	overflow-y: auto;
	padding-right: 8px;
	/* Keep the column scrollable on short viewports but hide the visible bar. */
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.product-facet__aside::-webkit-scrollbar {
	width: 0;
	height: 0;
	display: none;
}

.product-facet__filters-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 16px;
}

.product-facet__filters-header .heading {
	margin: 0;
}

.product-facet__close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 0;
	background: none;
	color: inherit;
	cursor: pointer;
}

.product-facet__filter-item {
	padding: 18px 0;
	border-bottom: 1px solid rgb(var(--border-color));
}

.product-facet__filter-item:first-child {
	padding-top: 0;
}

.product-facet__filter-item:last-child {
	border-bottom: 0;
}

.collapsible-toggle {
	display: block;
	margin: 0 0 12px;
	font-size: 14px;
}

.facet-list {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.facet-list__item a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 7px 10px;
	margin-left: -10px;
	border-radius: var(--block-border-radius-reduced);
	font-size: 14px;
	color: rgba(var(--text-color), 0.8);
	transition: background 0.2s ease-in-out, color 0.2s ease-in-out;
}

.facet-list__item a:hover {
	background: rgba(var(--heading-color), 0.05);
	color: rgb(var(--heading-color));
}

.facet-list__item.is-active a {
	background: rgb(var(--heading-color));
	color: #fff;
	font-weight: 500;
}

.facet-list__count {
	font-size: 12px;
	opacity: 0.6;
}

.price-range__input-group {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
}

.price-range__input {
	display: flex;
	align-items: center;
	gap: 4px;
	flex: 1 1 0;
	min-width: 0;
	padding: 0 8px;
	height: 42px;
	border: 1px solid rgb(var(--border-color));
	border-radius: var(--button-border-radius);
	background: rgb(var(--background));
}

.price-range__input:focus-within {
	border-color: rgb(var(--heading-color));
}

.price-range__input .input-prefix__value {
	font-size: 12px;
}

/* woocommerce.css styles every input[type="number"] inside .woocommerce with
   16px side padding, its own border and a taller box, which made the field
   overflow this 42px pill and clip the "Min" / "Max" placeholder. Reset it. */
.product-facet .price-range__input .input-prefix__field {
	flex: 1 1 0;
	width: 100%;
	min-width: 0;
	height: auto;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	box-shadow: none;
	font-family: inherit;
	font-size: 13px;
	line-height: normal;
	color: inherit;
	outline: none;
	text-align: left;
}

.product-facet .price-range__input .input-prefix__field::placeholder {
	color: rgba(var(--text-color), 0.45);
	opacity: 1;
}

.product-facet .price-range__input .input-prefix__field::-webkit-outer-spin-button,
.product-facet .price-range__input .input-prefix__field::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.price-range__delimiter {
	flex: none;
	margin: 0;
	opacity: 0.6;
}

.price-filter__submit {
	margin-top: 4px;
}

.price-filter__reset {
	display: inline-block;
	margin-top: 10px;
	text-decoration: underline;
	opacity: 0.7;
}

.product-facet__widgets {
	margin-top: 8px;
}

.product-facet__main {
	flex: 1;
	min-width: 0;
}

.product-facet__meta-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding-bottom: 16px;
	margin-bottom: 24px;
	border-bottom: 1px solid rgb(var(--border-color));
	flex-wrap: wrap;
}

.product-facet__meta-bar-item--count {
	font-size: 13px;
	color: rgba(var(--text-color), 0.6);
}

.product-facet__filter-toggle {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 0;
	border: 0;
	background: none;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: inherit;
	cursor: pointer;
}

.product-facet__filter-toggle svg {
	width: 16px;
	height: 16px;
}

.product-facet__meta-bar-item--sort .woocommerce-ordering {
	margin: 0;
}

.product-facet__filters-footer {
	position: sticky;
	bottom: 0;
	padding: 16px 0;
	margin-top: 16px;
	background: rgb(var(--background));
}

/* Mobile: filters become a panel */
@media screen and (max-width: 999px) {
	.product-facet__aside {
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		width: min(88vw, 380px);
		max-height: none;
		z-index: 100;
		background: rgb(var(--background));
		box-shadow: 0 0 60px rgba(0, 0, 0, 0.2);
		transform: translateX(-100%);
		transition: transform 0.3s ease-in-out;
		overflow-y: auto;
		padding: 20px var(--container-gutter) 0;
	}

	.product-facet__aside.is-open {
		transform: translateX(0);
	}

	.product-facet__aside-inner {
		display: flex;
		flex-direction: column;
		min-height: 100%;
	}

	body.toys-filters-open {
		overflow: hidden;
	}

	.product-facet__filter-list {
		flex: 1;
	}
}

/* ==========================================================================
   7. Single product
   ========================================================================== */

/* The base design system treats .product as the flex row itself; our markup
   wraps the columns in a container, so keep the outer wrapper in normal flow. */
.woocommerce div.product,
.product.product--thumbnails-bottom {
	display: block;
	align-items: stretch;
	margin-left: 0;
	margin-right: 0;
}

.product {
	padding-top: 24px;
}

.product .breadcrumb {
	margin-bottom: 24px;
}

.product__top {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
	gap: 56px;
	align-items: flex-start;
	padding-bottom: var(--vertical-breather);
}

.product__media {
	position: relative;
}

.product__media-list-wrapper {
	position: relative;
}

.product__label-list {
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 3;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.product__media-list {
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	border-radius: var(--block-border-radius);
	background: rgb(var(--secondary-background));
}

.product__media-list::-webkit-scrollbar {
	display: none;
}

.product__media-item {
	flex: 0 0 100%;
	scroll-snap-align: start;
	min-width: 0;
}

/* base.css keeps a Flickity leftover that hides every slide without
   .is-selected. This gallery is a scroll-snap strip, so all slides have to
   stay rendered - otherwise the strip has a single slide to scroll and the
   arrows can never move past the second image. Same specificity as the
   original rule, declared later, so this wins the cascade. */
.product__media-list:not(.flickity-enabled) .product__media-item:not(.is-selected) {
	display: block;
}

.product__media-image-wrapper {
	position: relative;
	width: 100%;
	padding-bottom: 125%; /* 4:5 portrait */
	overflow: hidden;
}

.product__media-image-wrapper img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	/* Product photos are 1500x1500 square originals: contain keeps the whole
	   product visible, the white backdrop blends with the extra 4:5 space. */
	object-fit: contain;
	background: rgb(var(--background));
}

.product__media-nav {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
	margin-top: 12px;
}

.product__media-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 1px solid rgb(var(--border-color));
	border-radius: 50%;
	background: rgb(var(--background));
	color: inherit;
	cursor: pointer;
	transition: border-color 0.2s ease-in-out, background 0.2s ease-in-out;
}

.product__media-arrow:hover {
	border-color: rgb(var(--heading-color));
}

.product__media-arrow svg {
	width: 15px;
	height: 15px;
}

.product__media-counter {
	font-size: 13px;
	color: rgba(var(--text-color), 0.65);
}

.product__thumbnail-list {
	margin-top: 12px;
	overflow-x: auto;
	scrollbar-width: none;
}

.product__thumbnail-list::-webkit-scrollbar {
	display: none;
}

.product__thumbnail-list-inner {
	display: flex;
	gap: 10px;
}

.product__thumbnail-item {
	flex: 0 0 72px;
	width: 72px;
	padding: 0;
	border: 1px solid transparent;
	border-radius: var(--block-border-radius-reduced);
	overflow: hidden;
	background: none;
	cursor: pointer;
	opacity: 0.6;
	transition: opacity 0.2s ease-in-out, border-color 0.2s ease-in-out;
}

.product__thumbnail-item:hover,
.product__thumbnail-item.is-selected {
	opacity: 1;
	border-color: rgb(var(--heading-color));
}

.product__thumbnail {
	display: block;
	position: relative;
	padding-bottom: 100%;
}

.product__thumbnail img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.product__info {
	position: sticky;
	top: calc(var(--anchor-offset) - 40px);
	padding-top: 4px;
}

.product-meta__vendor {
	margin: 0 0 8px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: rgba(var(--heading-color), 0.6);
}

.product-meta__vendor a:hover {
	color: rgb(var(--heading-color));
}

.product-meta__title {
	margin: 0 0 12px;
}

.product-meta__reviews-badge {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 12px;
}

.product-stars .star-rating,
.product-stars {
	display: inline-flex;
	align-items: center;
	gap: 2px;
	color: rgb(var(--product-star-rating));
}

.product-stars svg {
	width: 14px;
	height: 14px;
}

.product-meta__price-list-container {
	margin-bottom: 20px;
}

.product-meta__price-list-container .price-list,
.product-meta__price-list-container .price {
	font-size: 22px;
	font-weight: 600;
	color: rgb(var(--heading-color));
}

.product-meta__price-list-container del {
	opacity: 0.5;
	font-weight: 400;
	margin-right: 8px;
}

.product-meta__description {
	color: rgba(var(--text-color), 0.78);
	font-size: 15px;
	line-height: 1.7;
	margin-bottom: 24px;
}

.product-perks {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-top: 28px;
	padding-top: 24px;
	border-top: 1px solid rgb(var(--border-color));
}

.product-perk {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 14px;
	color: rgba(var(--text-color), 0.8);
}

.product-perk svg {
	width: 20px;
	height: 20px;
	flex: none;
	color: rgb(var(--heading-color));
}

.product-meta__aside {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-top: 24px;
	padding-top: 20px;
	border-top: 1px solid rgb(var(--border-color));
	font-size: 13px;
	color: rgba(var(--text-color), 0.65);
}

.product-meta__reference {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}

.product-meta__category a {
	text-decoration: underline;
}

.product-meta__share {
	display: flex;
	align-items: center;
	gap: 10px;
}

.product-meta__share-label {
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-size: 11px;
	opacity: 0.7;
}

.product-meta__share-button-list {
	display: flex;
	gap: 6px;
}

.product-meta__share-button-item {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border: 1px solid rgb(var(--border-color));
	border-radius: 50%;
	transition: border-color 0.2s ease-in-out, background 0.2s ease-in-out, color 0.2s ease-in-out;
}

.product-meta__share-button-item:hover {
	background: rgb(var(--heading-color));
	border-color: rgb(var(--heading-color));
	color: #fff;
}

.product-meta__share-button-item svg {
	width: 14px;
	height: 14px;
}

.product-content-section {
	margin-top: var(--vertical-breather);
	margin-bottom: var(--vertical-breather);
}

.product-content-section .product-content {
	border-top: 1px solid rgb(var(--border-color));
	padding-top: 32px;
}

/* ==========================================================================
   8. Pages, posts, sidebar, comments
   ========================================================================== */

.page-layout {
	padding-top: var(--vertical-breather);
	padding-bottom: var(--vertical-breather);
}

.page-layout--sidebar {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 300px;
	gap: 56px;
	align-items: flex-start;
}

.page-layout .entry-content > *:first-child {
	margin-top: 0;
}

.page-sidebar {
	display: flex;
	flex-direction: column;
	gap: 32px;
}

.widget {
	font-size: 14px;
}

.widget__title {
	display: block;
	margin: 0 0 12px;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

.widget ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.widget ul li + li {
	margin-top: 8px;
}

.widget a {
	color: rgba(var(--text-color), 0.78);
}

.widget a:hover {
	color: rgb(var(--heading-color));
}

.page-links {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 32px 0;
	font-size: 14px;
}

.page-links a,
.page-links > span:not(:first-child) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 32px;
	height: 32px;
	border: 1px solid rgb(var(--border-color));
	border-radius: var(--button-border-radius);
}

.post-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: var(--grid-gap);
}

.post-card {
	display: flex;
	flex-direction: column;
	border: 1px solid rgb(var(--border-color));
	border-radius: var(--block-border-radius);
	overflow: hidden;
	background: rgb(var(--background));
	transition: box-shadow 0.3s ease-in-out, transform 0.3s ease-in-out;
}

.post-card:hover {
	box-shadow: 0 16px 40px rgba(0, 0, 0, 0.08);
	transform: translateY(-2px);
}

.post-card__image-link {
	display: block;
	position: relative;
	padding-bottom: 62%;
	background: rgb(var(--secondary-background));
	overflow: hidden;
}

.post-card__image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.post-card__content {
	padding: 20px 22px 24px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex-grow: 1;
}

.post-card__meta {
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: rgba(var(--text-color), 0.55);
}

.post-card__title {
	margin: 0;
	font-size: 19px;
	line-height: 1.35;
}

.post-card__link {
	color: rgb(var(--heading-color));
}

.post-card__excerpt {
	margin: 0;
	font-size: 14px;
	line-height: 1.65;
	color: rgba(var(--text-color), 0.72);
}

.post-layout {
	padding-top: var(--vertical-breather);
	padding-bottom: var(--vertical-breather);
}

.post-layout--sidebar {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 300px;
	gap: 56px;
	align-items: flex-start;
}

.post-hero-image {
	margin: 0 0 32px;
	border-radius: var(--block-border-radius);
	overflow: hidden;
}

.post-content {
	max-width: 760px;
	margin: 0 auto;
}

.post-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 32px;
}

.post-tags a {
	display: inline-block;
	padding: 5px 12px;
	border: 1px solid rgb(var(--border-color));
	border-radius: 100px;
	font-size: 12px;
	color: rgba(var(--text-color), 0.7);
}

.post-tags a:hover {
	border-color: rgb(var(--heading-color));
	color: rgb(var(--heading-color));
}

.post-navigation {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	margin-top: 48px;
	padding-top: 32px;
	border-top: 1px solid rgb(var(--border-color));
}

.post-navigation__item {
	display: flex;
	flex-direction: column;
	gap: 6px;
	font-size: 14px;
}

.post-navigation__item--next {
	text-align: right;
	align-items: flex-end;
}

.post-navigation__item span.text--xsmall {
	text-transform: uppercase;
	letter-spacing: 0.1em;
	opacity: 0.6;
}

/* Comments */
.comments-area {
	max-width: 760px;
	margin: 48px auto 0;
	padding-top: 32px;
	border-top: 1px solid rgb(var(--border-color));
}

.comments-title,
.comment-reply-title {
	display: block;
	margin: 0 0 24px;
	font-size: 22px;
	font-weight: 600;
	color: rgb(var(--heading-color));
}

.comment-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.comment-list .comment-body {
	padding: 20px 0;
	border-bottom: 1px solid rgb(var(--border-color));
}

.comment-list .children {
	margin: 0;
	padding-left: 32px;
	list-style: none;
}

.comment-meta {
	font-size: 13px;
	color: rgba(var(--text-color), 0.6);
	margin-bottom: 8px;
}

.comment-author img {
	border-radius: 50%;
	margin-right: 8px;
}

.comment-content {
	font-size: 15px;
	line-height: 1.7;
}

.comment-form {
	display: grid;
	gap: 16px;
	margin-top: 24px;
}

.comment-form p {
	margin: 0;
}

.comment-form label {
	display: block;
	margin-bottom: 6px;
	font-size: 13px;
	font-weight: 500;
}

.no-comments {
	font-size: 15px;
	color: rgba(var(--text-color), 0.65);
}

/* ==========================================================================
   9. Footer
   ========================================================================== */

.site-footer {
	margin-top: var(--vertical-breather);
	border-top: 1px solid rgb(var(--border-color));
	background: rgb(var(--secondary-background));
}

.footer__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 2.4fr);
	gap: 48px;
	padding-bottom: 40px;
}

.footer__brand {
	max-width: 340px;
}

.footer__logo-link {
	display: inline-block;
	line-height: 0;
	margin-bottom: 16px;
}

.footer__logo-image {
	width: auto;
	max-width: 210px;
	max-height: 42px;
	object-fit: contain;
}

.footer__about {
	margin: 0 0 20px;
	font-size: 14px;
	line-height: 1.7;
	color: rgba(var(--text-color), 0.7);
}

.footer__social {
	display: flex;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.footer__social a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 1px solid rgb(var(--border-color));
	border-radius: 50%;
	background: rgb(var(--background));
	color: rgb(var(--heading-color));
	transition: background 0.2s ease-in-out, color 0.2s ease-in-out, border-color 0.2s ease-in-out;
}

.footer__social a:hover {
	background: rgb(var(--heading-color));
	border-color: rgb(var(--heading-color));
	color: #fff;
}

.footer__social svg {
	width: 16px;
	height: 16px;
}

.footer__item-list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 32px;
}

.footer__item-title {
	display: block;
	margin: 0 0 14px;
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.1em;
}

.footer__item-content {
	font-size: 14px;
}

.footer__item-content .linklist__item + .linklist__item {
	margin-top: 9px;
}

.footer__item-content .link--faded {
	color: rgba(var(--text-color), 0.7);
}

.footer__item-content .link--faded:hover {
	color: rgb(var(--heading-color));
}

/* Rich text coming from the footer settings screen. */
.footer__about > *:last-child,
.footer__item-content--rich > *:last-child {
	margin-bottom: 0;
}

.footer__about p,
.footer__item-content--rich p {
	margin: 0 0 10px;
	font-size: 14px;
	line-height: 1.7;
	color: rgba(var(--text-color), 0.7);
}

.footer__item-content--rich a {
	text-decoration: underline;
	text-underline-offset: 2px;
}

.footer__item-content--rich a:hover {
	color: rgb(var(--heading-color));
}

.footer__item-content--rich ul,
.footer__item-content--rich ol {
	margin: 0 0 10px;
	padding-left: 20px;
	list-style-position: outside;
	list-style-type: disc;
	color: rgba(var(--text-color), 0.7);
}

.footer__item-content--rich ol {
	list-style-type: decimal;
}

.footer__item-content--rich li + li {
	margin-top: 6px;
}

.footer__item-content--rich strong {
	color: rgb(var(--heading-color));
}

.footer__item-content--rich img {
	max-width: 100%;
	height: auto;
	border-radius: var(--block-border-radius-reduced);
}

.footer__newsletter-text {
	margin: 0 0 14px;
	font-size: 13px;
	line-height: 1.6;
	color: rgba(var(--text-color), 0.7);
}

.footer__newsletter-form .input {
	position: relative;
	border-bottom: 1px solid rgb(var(--border-color-darker));
	padding-bottom: 6px;
}

.footer__newsletter-form .input__label {
	display: none;
}

.footer__newsletter-form .input__field--text {
	width: 100%;
	padding: 8px 40px 8px 0;
	border: 0;
	background: none;
	font-family: inherit;
	font-size: 14px;
	color: inherit;
	outline: none;
	box-shadow: none;
	height: auto;
}

.footer__newsletter-form .input__submit-icon {
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border: 0;
	background: none;
	color: inherit;
	cursor: pointer;
}

.footer__newsletter-form .input__submit-icon svg {
	width: 16px;
	height: 16px;
}

.toys-newsletter-message {
	margin: 0 0 12px;
	font-size: 13px;
	padding: 8px 12px;
	border-radius: var(--block-border-radius-reduced);
}

.toys-newsletter-message--success {
	background: rgb(var(--success-background));
	color: rgb(var(--success-color));
}

.toys-newsletter-message--error {
	background: rgb(var(--error-background));
	color: rgb(var(--error-color));
}

.toys-honeypot {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.footer__aside {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 16px;
	padding-top: 24px;
	border-top: 1px solid rgb(var(--border-color));
}

.footer__copyright a {
	text-decoration: underline;
	text-underline-offset: 2px;
}

.footer__payment-methods {
	display: flex;
	align-items: center;
	gap: 10px;
}

.payment-methods-list {
	display: flex;
	align-items: center;
	gap: 6px;
}

.payment-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 22px;
	padding: 0 7px;
	border: 1px solid rgb(var(--border-color));
	border-radius: 3px;
	background: rgb(var(--background));
	font-size: 9px;
	font-weight: 700;
	letter-spacing: 0.04em;
	color: rgba(var(--text-color), 0.7);
}

.payment-badge--mastercard span {
	display: inline-block;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: rgba(var(--text-color), 0.45);
}

.payment-badge--mastercard span + span {
	margin-left: -4px;
	background: rgba(var(--text-color), 0.22);
}

/* Global notices (toasts) */
.toys-global-notices {
	position: fixed;
	left: 24px;
	bottom: 24px;
	z-index: 90;
	max-width: min(92vw, 380px);
}

.toys-global-notices .woocommerce-message,
.toys-global-notices .woocommerce-info,
.toys-global-notices .woocommerce-error {
	margin: 0;
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.14);
}

/* ==========================================================================
   10. Search results & 404
   ========================================================================== */

.search-form {
	display: flex;
	align-items: center;
	gap: 8px;
	max-width: 420px;
}

.search-field {
	flex: 1;
	min-width: 0;
	height: var(--form-input-field-height);
	padding: 0 16px;
	border: 1px solid rgb(var(--border-color));
	border-radius: var(--button-border-radius);
	background: rgb(var(--background));
	font-family: inherit;
	font-size: 14px;
	color: inherit;
}

.search-submit {
	height: var(--form-input-field-height);
	padding: 0 20px;
	border: 0;
	border-radius: var(--button-border-radius);
	background: rgb(var(--primary-button-background));
	color: rgb(var(--primary-button-text-color));
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	cursor: pointer;
}

.woo-page-container {
	padding-top: var(--vertical-breather);
	padding-bottom: var(--vertical-breather);
}

.woo-page-header {
	margin-bottom: 32px;
}

.woo-page-header .breadcrumb {
	margin-bottom: 12px;
}

.woo-page-header .heading {
	margin: 0;
}

/* ==========================================================================
   11. Toast & sticky placeholder
   ========================================================================== */

.site-header-placeholder {
	width: 100%;
}

.toys-toast {
	position: fixed;
	left: 50%;
	bottom: 28px;
	z-index: 200;
	padding: 12px 22px;
	border-radius: 100px;
	background: rgb(var(--heading-color));
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.02em;
	box-shadow: 0 12px 36px rgba(0, 0, 0, 0.22);
	opacity: 0;
	visibility: hidden;
	transform: translate(-50%, 12px);
	transition: opacity 0.25s ease-in-out, transform 0.25s ease-in-out, visibility 0.25s;
}

.toys-toast.is-visible {
	opacity: 1;
	visibility: visible;
	transform: translate(-50%, 0);
}

.add_to_cart_button.loading {
	opacity: 0.65;
	pointer-events: none;
}

/* ==========================================================================
   12. Responsive
   ========================================================================== */

@media screen and (max-width: 1199px) {
	.toys-product-grid {
		--section-products-per-row: 3;
	}

	.product__top {
		gap: 40px;
	}

	.footer__item-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 28px 32px;
	}
}

@media screen and (max-width: 999px) {
	.header__wrapper {
		grid-template-columns: auto 1fr auto;
	}

	.header__logo {
		justify-content: flex-start;
	}

	.header__secondary-links {
		justify-self: end;
	}

	.home-categories__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		grid-auto-rows: 180px;
	}

	.home-category--large {
		grid-column: span 2;
		grid-row: span 1;
	}

	.home-trust__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 20px;
	}

	.product__top {
		grid-template-columns: minmax(0, 1fr);
		gap: 32px;
	}

	.product__info {
		position: static;
	}

	.page-layout--sidebar,
	.post-layout--sidebar {
		grid-template-columns: minmax(0, 1fr);
		gap: 40px;
	}

	.page-sidebar {
		display: none;
	}

	.footer__inner {
		grid-template-columns: minmax(0, 1fr);
		gap: 40px;
	}

	.footer__brand {
		max-width: none;
	}
}

@media screen and (max-width: 740px) {
	.toys-product-grid {
		--section-products-per-row: 2;
	}

	.toys-product-grid .product-list__inner {
		gap: 12px var(--grid-gap);
	}

	.home-hero {
		min-height: 480px;
	}

	.home-hero__container {
		padding-top: 48px;
		padding-bottom: 48px;
	}

	.home-hero__text {
		font-size: 15px;
	}

	.home-features__grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 32px;
	}

	.home-awards__list {
		gap: 16px 24px;
	}

	.home-awards__list img {
		width: 88px;
		height: 88px;
	}

	.home-categories__header,
	.home-best-sellers__header {
		flex-direction: column;
		align-items: flex-start;
	}

	.home-trust__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.footer__item-list {
		grid-template-columns: minmax(0, 1fr);
	}

	.footer__aside {
		flex-direction: column;
		align-items: flex-start;
	}

	.post-navigation {
		grid-template-columns: minmax(0, 1fr);
	}

	.product__thumbnail-item {
		flex-basis: 60px;
		width: 60px;
	}

	.toys-global-notices {
		left: 12px;
		right: 12px;
		bottom: 12px;
		max-width: none;
	}
}

/* ==========================================================================
   10. Content pages: FAQ, shipping / refund policies, contact
   ========================================================================== */

.sm-lead {
	max-width: 780px;
	font-size: calc(var(--base-font-size) + 1px);
	line-height: 1.7;
	color: rgba(var(--text-color), 0.8);
}

/* Long-form pages read best on a narrower measure, like the original policy
   pages this content came from. */
.page-template-page-full-php .page-layout .entry-content {
	max-width: 880px;
	margin-left: auto;
	margin-right: auto;
}

/* The design system's h2 token is larger than h1: cap it so long-form pages
   keep a readable hierarchy under the page title. */
.page-template-page-full-php .rte h2 {
	font-size: calc(var(--heading-h1-font-size) * 0.8);
	line-height: 1.25;
}

.sm-callout {
	margin-bottom: 32px;
	padding: 16px 20px;
	background: rgb(var(--secondary-background));
	border-left: 3px solid rgb(var(--heading-color));
	border-radius: var(--block-border-radius-reduced);
}

.sm-table th {
	background: rgb(var(--secondary-background));
	font-weight: var(--text-font-bold-weight);
	white-space: nowrap;
}

/* --- FAQ accordion ------------------------------------------------------- */

.sm-faq {
	max-width: 900px;
	margin-top: 8px;
}

.sm-faq__item {
	border-bottom: 1px solid rgba(var(--text-color), 0.15);
}

.sm-faq__item:first-child {
	border-top: 1px solid rgba(var(--text-color), 0.15);
}

.sm-faq__question {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding: 20px 0;
	font-weight: var(--text-font-bold-weight);
	line-height: 1.45;
	cursor: pointer;
	list-style: none;
	transition: color 0.2s ease-in-out;
}

.sm-faq__question::-webkit-details-marker {
	display: none;
}

.sm-faq__question:hover {
	color: rgb(var(--heading-color));
}

.sm-faq__icon {
	position: relative;
	flex: none;
	width: 14px;
	height: 14px;
}

.sm-faq__icon::before,
.sm-faq__icon::after {
	position: absolute;
	content: "";
	background: currentColor;
	transition: transform 0.25s ease-in-out, opacity 0.25s ease-in-out;
}

.sm-faq__icon::before {
	top: 50%;
	left: 0;
	width: 100%;
	height: 1.5px;
	transform: translateY(-50%);
}

.sm-faq__icon::after {
	top: 0;
	left: 50%;
	width: 1.5px;
	height: 100%;
	transform: translateX(-50%);
}

.sm-faq__item[open] .sm-faq__icon::after {
	opacity: 0;
	transform: translateX(-50%) rotate(90deg);
}

.sm-faq__answer {
	padding: 0 40px 24px 0;
	color: rgba(var(--text-color), 0.85);
}

.sm-faq__answer > *:first-child {
	margin-top: 0;
}

.sm-faq__answer > *:last-child {
	margin-bottom: 0;
}

/* --- CTA block ----------------------------------------------------------- */

.sm-cta {
	margin-top: 56px;
	padding: 40px 32px;
	text-align: center;
	background: rgb(var(--secondary-background));
	border-radius: var(--block-border-radius);
}

.rte .sm-cta__title {
	margin: 0 0 12px;
	font-size: calc(var(--heading-h1-font-size) * 0.7);
}

.sm-cta__text {
	max-width: 520px;
	margin: 0 auto 24px;
	color: rgba(var(--text-color), 0.75);
}

/* --- Contact page -------------------------------------------------------- */

.sm-contact {
	display: grid;
	grid-template-columns: minmax(0, 320px) minmax(0, 1fr);
	gap: 56px;
	align-items: start;
	margin-top: 40px;
}

.sm-contact__aside {
	padding: 28px;
	background: rgb(var(--secondary-background));
	border-radius: var(--block-border-radius);
}

.sm-contact__label {
	margin: 0 0 10px;
	font-size: 11px;
	font-weight: var(--text-font-bold-weight);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgba(var(--text-color), 0.6);
}

.sm-contact__email {
	display: inline-block;
	font-size: 19px;
	font-weight: var(--text-font-bold-weight);
	color: rgb(var(--heading-color));
	word-break: break-word;
}

.sm-contact__email:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.sm-contact__note {
	margin: 14px 0 0;
	font-size: 14px;
	line-height: 1.6;
	color: rgba(var(--text-color), 0.7);
}

.rte .sm-contact__title {
	margin: 0 0 24px;
	font-size: calc(var(--heading-h1-font-size) * 0.7);
}

/* --- Contact Form 7 ------------------------------------------------------ */

.sm-form p {
	margin: 0 0 20px;
}

.sm-form label {
	display: block;
	margin-bottom: 8px;
	font-size: 13px;
	font-weight: var(--text-font-bold-weight);
}

.sm-form__required {
	color: rgb(var(--error-color));
}

.sm-form .wpcf7-form-control-wrap {
	display: block;
}

.sm-input.input__field,
.sm-input {
	width: 100%;
	height: var(--form-input-field-height);
	line-height: normal;
	padding: 0 16px;
	font-family: inherit;
	font-size: var(--base-font-size);
	color: rgb(var(--text-color));
	background: rgb(var(--background));
	border: 1px solid rgb(var(--border-color));
	border-radius: var(--button-border-radius);
	transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}

textarea.sm-input {
	height: auto;
	min-height: 170px;
	padding: 14px 16px;
	line-height: 1.6;
	resize: vertical;
}

.sm-input:focus {
	outline: none;
	border-color: rgb(var(--text-color));
	box-shadow: 0 0 0 1px rgb(var(--text-color)) inset;
}

.sm-submit {
	display: inline-block;
	min-width: 190px;
	height: var(--button-height);
	padding: 0 30px;
	font-family: inherit;
	font-size: var(--base-font-size);
	font-weight: var(--text-font-bold-weight);
	color: rgb(var(--primary-button-text-color));
	text-align: center;
	background: rgb(var(--primary-button-background));
	border: none;
	border-radius: var(--button-border-radius);
	cursor: pointer;
	transition: opacity 0.2s ease-in-out;
}

.sm-submit:hover {
	opacity: 0.85;
}

.sm-form .wpcf7-not-valid-tip {
	margin-top: 6px;
	font-size: 13px;
	color: rgb(var(--error-color));
}

.sm-form .wpcf7-response-output {
	margin: 24px 0 0;
	padding: 12px 16px;
	font-size: 14px;
	background: rgb(var(--secondary-background));
	border: none;
	border-radius: var(--block-border-radius-reduced);
}

.sm-form form.submitting .wpcf7-spinner {
	visibility: visible;
}

@media screen and (max-width: 999px) {
	.sm-contact {
		grid-template-columns: minmax(0, 1fr);
		gap: 32px;
	}

	.sm-contact__aside {
		padding: 24px;
	}

	.sm-faq__answer {
		padding-right: 0;
	}

	.sm-cta {
		padding: 32px 24px;
	}
}

/* --- Product registration page ------------------------------------------- */

.sm-reg__lead {
	max-width: 720px;
	margin: 0 auto 32px;
	text-align: center;
	font-size: 17px;
	line-height: 1.75;
	color: rgba(var(--text-color), 0.8);
}

.sm-reg__perks {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	max-width: 880px;
	margin: 0 auto 48px;
	padding: 0;
	list-style: none;
}

.sm-reg__perks li {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 58px;
	padding: 12px 18px;
	text-align: center;
	font-size: 14px;
	font-weight: var(--text-font-bold-weight);
	line-height: 1.4;
	color: rgb(var(--primary-button-background));
	background: rgb(var(--secondary-background));
	border-radius: var(--block-border-radius);
}

.sm-reg__card {
	max-width: 880px;
	margin: 0 auto;
	padding: 40px 44px;
	background: rgb(var(--background));
	border: 1px solid rgb(var(--border-color));
	border-radius: var(--block-border-radius);
}

.rte .sm-reg__title {
	margin: 0 0 8px;
	font-size: var(--heading-h3-font-size);
	text-align: center;
}

.sm-reg__subtitle {
	margin: 0 0 32px;
	text-align: center;
	font-size: 14px;
	color: rgba(var(--text-color), 0.65);
}

.sm-reg__note {
	margin: 24px 0 0;
	padding-top: 20px;
	border-top: 1px solid rgb(var(--border-color));
	font-size: 13px;
	line-height: 1.7;
	color: rgba(var(--text-color), 0.65);
}

.sm-reg__note a {
	color: rgb(var(--heading-color));
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* Two-up field rows inside the registration form */
.sm-form__row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 20px;
	align-items: start;
}

/* base.css adds `.rte p:not(.heading)+p { margin-top: 24px }`, which pushes the
   right-hand column of every row down. Reset it inside the grid rows. */
.sm-form .sm-form__row > .sm-form__field {
	margin-top: 0;
}

/* Keep every control the same box height (inline-block adds a baseline gap). */
.sm-form .sm-input {
	display: block;
}

.sm-form select.sm-input {
	-webkit-appearance: none;
	appearance: none;
	padding-right: 40px;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%231a1a1a' stroke-width='1.6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 16px center;
	cursor: pointer;
}

textarea.sm-input#sm-address,
textarea.sm-input#sm-message {
	min-height: 112px;
}

/* Radio / checkbox chips (purchase channel, consent) */
.sm-form .wpcf7-radio,
.sm-form .wpcf7-checkbox {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 2px;
}

.sm-form .wpcf7-list-item {
	display: block;
	margin: 0;
}

.sm-form .wpcf7-list-item label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 11px 18px;
	font-size: 14px;
	font-weight: 400;
	line-height: 1.3;
	border: 1px solid rgb(var(--border-color));
	border-radius: var(--button-border-radius);
	cursor: pointer;
	transition: border-color 0.2s ease-in-out, background 0.2s ease-in-out,
		color 0.2s ease-in-out;
}

.sm-form .wpcf7-list-item label:hover {
	border-color: rgb(var(--border-color-darker));
}

.sm-form .wpcf7-list-item input[type="radio"],
.sm-form .wpcf7-list-item input[type="checkbox"] {
	margin: 0;
	accent-color: rgb(var(--primary-button-background));
}

.sm-form .wpcf7-list-item label:has(input:checked) {
	color: rgb(var(--primary-button-background));
	background: rgb(var(--secondary-background));
	border-color: rgb(var(--primary-button-background));
}

.sm-form .wpcf7-acceptance .wpcf7-list-item label {
	align-items: flex-start;
	padding: 0;
	font-size: 13px;
	line-height: 1.6;
	border: none;
	color: rgba(var(--text-color), 0.75);
}

.sm-form .wpcf7-acceptance .wpcf7-list-item label:has(input:checked) {
	color: rgba(var(--text-color), 0.75);
	background: none;
}

.sm-form .wpcf7-acceptance input[type="checkbox"] {
	margin-top: 3px;
}

.sm-form .wpcf7-spinner {
	margin: 0 0 0 12px;
}

@media screen and (max-width: 767px) {
	.sm-reg__perks {
		grid-template-columns: minmax(0, 1fr);
		margin-bottom: 32px;
	}

	.sm-reg__card {
		padding: 28px 22px;
	}

	.sm-form__row {
		grid-template-columns: minmax(0, 1fr);
	}

	.sm-reg__lead {
		font-size: 16px;
	}
}

/* --- About page ---------------------------------------------------------- */

.rte .sm-about__title {
	margin: 48px 0 24px;
	font-size: var(--heading-h3-font-size);
}

.sm-about__cards {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	margin: 0 0 32px;
}

.sm-about__card {
	padding: 26px 24px;
	background: rgb(var(--secondary-background));
	border-radius: var(--block-border-radius);
}

.rte .sm-about__card-title {
	margin: 0 0 10px;
	font-size: 17px;
}

.sm-about__card-text {
	margin: 0;
	font-size: 14px;
	line-height: 1.7;
	color: rgba(var(--text-color), 0.75);
}

@media screen and (max-width: 767px) {
	.sm-about__cards {
		grid-template-columns: minmax(0, 1fr);
		gap: 14px;
	}

	.rte .sm-about__title {
		margin-top: 36px;
	}
}
@media screen and (min-width: 741px) {
  .announcement-bar__message { max-width: none; }
}
/* --------------------------------------------------------------------------
   Product detail: heading
   Long marketplace titles are split by the template into a headline (the
   product name) plus a muted spec line, so the block stays scannable.
   -------------------------------------------------------------------------- */
.product-meta h1.product-meta__title {
	margin: 0 0 18px;
	font-size: clamp(20px, 1.75vw, 26px);
	font-weight: 600;
	line-height: 1.42;
	letter-spacing: -0.01em;
	text-transform: none;
	color: rgb(var(--heading-color));
	overflow-wrap: break-word;
}

.product-meta__title-lead {
	display: block;
	font-size: clamp(25px, 2.4vw, 33px);
	font-weight: 700;
	line-height: 1.18;
	letter-spacing: -0.022em;
	color: rgb(var(--heading-color));
}

.product-meta__title-rule {
	display: block;
	width: 34px;
	height: 3px;
	margin: 14px 0;
	border-radius: 999px;
	background: linear-gradient(90deg, rgb(var(--heading-color)) 0%, rgba(var(--heading-color), 0.12) 100%);
}

.product-meta__title-rest {
	display: block;
	font-size: clamp(14px, 1vw, 15px);
	font-weight: 500;
	line-height: 1.7;
	letter-spacing: 0;
	color: rgba(var(--heading-color), 0.66);
}

/* base.css pulls the price up by -8px; keep the 18px gap from the title. */
.product-meta .product-meta__price-list-container {
	margin-top: 0;
}

/* --------------------------------------------------------------------------
   Product detail: "Buy From Amazon" (shown when enable_to_amz + asin are set)
   The .woocommerce prefix keeps these rules above `.woocommerce a.button`
   in woocommerce.css.
   -------------------------------------------------------------------------- */
.woocommerce .product-form .button--amazon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	min-height: var(--button-height);
	margin: 12px 0 0;
	padding: 0 24px;
	border: 1.5px solid rgb(var(--heading-color));
	border-radius: var(--button-border-radius);
	background: rgb(var(--background));
	color: rgb(var(--heading-color));
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

/* The add-to-cart form keeps its own bottom margin (2em, set by WooCommerce's
   `.woocommerce div.product form.cart`); drop it so the Amazon button sits the
   same 12px below the cart button as the quantity field does. */
.woocommerce div.product .product-form--amazon form.cart {
	margin-bottom: 0;
}

.woocommerce .product-form .button--amazon .icon {
	width: 18px;
	height: 18px;
	flex: 0 0 auto;
}

.woocommerce .product-form .button--amazon:hover,
.woocommerce .product-form .button--amazon:focus-visible {
	background: rgb(var(--heading-color));
	border-color: rgb(var(--heading-color));
	color: #fff;
	box-shadow: 0 8px 20px rgba(var(--heading-color), 0.18);
}
.product__thumbnail-item[aria-current] .product__thumbnail::after { display: none; }
.product__thumbnail { width: 100%; min-width: 0; padding: 0; padding-bottom: 100%; }

.home-trust{
	display: none;
}
footer.footer.site-footer .product-menu{
	margin-left:-5px;
}
body .footer__item-content--rich ul, body  .footer__item-content--rich ol {
	margin: 0;
    padding-left: 0;
    list-style-position: outside;
    list-style-type: none;
}
body footer.footer.site-footer .product-menu a{

text-decoration: none;
}

body .header__linklist-chevron{
	   position: relative;
    top: 5px;
}


.footer__aside {
	/* 关键：跨满 .footer__inner 的两列，实现通栏 100% */
	grid-column: 1 / -1;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between; /* 左边版权，右边支付方式 */
	flex-wrap: nowrap;
	gap: 16px;
	margin-top: 24px;
	padding-top: 24px;
	border-top: 1px solid rgb(var(--border-color));
}

/* 覆盖 base.css 里 .footer__copyright / .footer__payment-methods 的 margin-top:32px */
.footer__aside .footer__copyright,
.footer__aside .footer__payment-methods {
	margin-top: 0;
}

.footer__aside .footer__copyright {
	flex: 0 1 auto;
	min-width: 0;
}

.footer__aside .footer__payment-methods {
	flex: 0 0 auto;
}


body .header__linklist-chevron {
  position: relative;
  top: 0;
  display: block;
  width: 12px;
  height: 12px;
  flex: none;
  overflow: hidden;
}
.header__linklist-chevron svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  transform: translateY(2.5px);
}
.header__linklist-link { gap: 6px; }


.home .text-container a:hover{
	color:#afaeae;
}

/* ==========================================================================
   13. Mobile only refinements (<= 740px)
   Everything in this block is scoped to phones; the >=741px layout is
   untouched.
   ========================================================================== */

@media screen and (max-width: 740px) {
	/* Product cards.
	   The imported titles are full Amazon-style names (60-90 words), so at two
	   columns they ran 10-12 lines, cards ended up 460 vs 506px tall and the
	   prices never lined up. Clamp to three lines and reserve the same height
	   for every card so the grid stays on a baseline. */
	.toys-product-grid .product-item-meta__title {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		line-clamp: 3;
		overflow: hidden;
		min-height: 3.9em;
		font-size: 13px;
		line-height: 1.3;
	}

	.toys-product-grid .product-item-meta__price-list-container {
		margin-top: 8px;
	}

	/* Awards strip.
	   Four 88px seals plus 24px gaps need 424px, so the fourth wrapped alone
	   onto a second row. A 2x2 grid keeps them balanced at any phone width. */
	.home-awards__list {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		justify-items: center;
		gap: 20px 16px;
	}

	.home-awards__list img {
		width: 96px;
		height: 96px;
	}

	/* Hero readability.
	   The overlay is a horizontal gradient (dark on the left) meant for the
	   desktop two-column hero. On phones the copy spans the full width and the
	   right half - "Explore the collection" in particular - sits on bright
	   artwork, so switch to a vertical gradient that covers the whole block. */
	.home-hero__overlay {
		background: linear-gradient(180deg, rgba(9, 22, 46, 0.62) 0%, rgba(9, 22, 46, 0.34) 42%, rgba(9, 22, 46, 0.74) 100%);
	}

	/* Footer legal row.
	   base.css turns .footer__copyright into a flex row, so the sentence wraps
	   inside its own box while the separator and Privacy/Terms are pushed to
	   the right edge ("Terms" ended up flush against the container edge).
	   Flow it as normal inline text again. */
	.footer__aside {
		flex-direction: column;
		align-items: flex-start;
		flex-wrap: wrap;
	}

	.footer__aside .footer__copyright {
		display: block;
		line-height: 1.65;
	}

	.footer__aside .footer__copyright .square-separator {
		display: none;
	}

	.footer__aside .footer__copyright a {
		white-space: nowrap;
	}

	/* Put the legal links on their own line. Without this the sentence and
	   "Privacy | Terms" compete for one line and the pipe gets orphaned. */
	.footer__aside .footer__copyright a:first-of-type::before {
		content: "";
		display: block;
	}

	.footer__aside .footer__payment-methods {
		margin-top: 4px;
	}
}

/* Mobile drawer "+" toggle.
   base.css positions the two pseudo bars with left:50% + translate(-50%,-50%)
   and rotates both -90deg; toys.css only overrides left to 0, so the bars ended
   up side by side and the toggle rendered as "||" instead of "+". Reset both
   so :before is the horizontal bar and :after the vertical one. */
.mobile-nav .animated-plus:before,
.mobile-nav .animated-plus:after {
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
}

.mobile-nav .animated-plus:after {
	transform: translate(-50%, -50%) rotate(90deg);
}

.mobile-nav__link[aria-expanded="true"] .animated-plus:after {
	transform: translate(-50%, -50%) rotate(0deg);
}

/* ==========================================================================
   14. Mobile only refinements, part 2 (<= 740px)
   Header logo, breadcrumb, quantity / add-to-cart alignment, product tabs,
   cart block.
   ========================================================================== */
#post-49 .rte li + li{
 margin-top: unset;
}
body .rte .woocommerce  p:not(.heading)+p{
  margin-top: unset;
}
@media screen and (max-width: 740px) {
	/* Header.
	   Three columns (icons / logo / icons) with 16px gaps need ~350px, so at
	   320-360px the logo track was allowed to keep its full width and the
	   search button overlapped the logo. Let the logo shrink instead. */
	.header__logo {
		min-width: 0;
	}

	.header__logo-image {
		max-width: 100%;
	}

	/* Breadcrumb.
	   The imported titles are full Amazon-style names, so the trail used to
	   wrap into four lines with the "/" separator stranded at the start of a
	   line. Keep the trail on a single line and ellipsize the last crumb. */
	.breadcrumb__list {
		flex-wrap: nowrap;
		overflow: hidden;
	}

	.breadcrumb__item {
		display: flex;
		align-items: center;
		flex: 0 0 auto;
		min-width: 0;
	}

	.breadcrumb__item:last-child {
		flex: 0 1 auto;
	}

	.breadcrumb__item + .breadcrumb__item:before {
		float: none;
		flex: 0 0 auto;
	}

	.breadcrumb__link {
		display: block;
		min-width: 0;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	/* Quantity + add to cart.
	   form.cart is a wrapping flex row with a 12px gap; a 100% wide quantity
	   pushed the button onto its own line, where flex sizing left it 12px
	   narrower than both the quantity box above and the Amazon button below.
	   Stack the two as plain blocks so all three edges stay flush.
	   (Flex/grid both work, but WooCommerce's template leaves whitespace text
	   nodes between the two controls, and in those containers they turn into
	   anonymous items that insert phantom 12px gaps.) */
	.product-form form.cart {
		display: block;
	}

	.product-form .quantity,
	.product-form .single_add_to_cart_button {
		display: flex;
		width: 100%;
	}

	/* The plugin's "float the quantity left" rule wins on margin
	   (.woocommerce div.product form.cart div.quantity), so match it head-on. */
	body.woocommerce div.product form.cart div.quantity {
		justify-content: center;
		margin: 0 0 12px;
	}

	body.woocommerce div.product form.cart .single_add_to_cart_button {
		margin: 0;
	}

	/* Product tabs.
	   WooCommerce's default tab skin (.woocommerce div.product ... ul.tabs li)
	   outranks the theme's underline tabs, so on phones the three tabs turned
	   into ragged grey boxes overlapping each other on a negative margin.
	   Restore the underline style and let the row scroll instead of wrapping. */
	body.woocommerce div.product .woocommerce-tabs ul.tabs {
		display: flex;
		flex-wrap: nowrap;
		gap: 12px;
		margin: 0 0 20px;
		padding: 0;
		border-bottom: 1px solid rgb(var(--border-color));
		overflow-x: auto;
		scrollbar-width: none;
	}

	body.woocommerce div.product .woocommerce-tabs ul.tabs::-webkit-scrollbar {
		display: none;
	}

	body.woocommerce div.product .woocommerce-tabs ul.tabs li {
		display: block;
		flex: 0 0 auto;
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 0;
		background: none;
	}

	body.woocommerce div.product .woocommerce-tabs ul.tabs li.active,
	body.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
		background: none;
	}

	body.woocommerce div.product .woocommerce-tabs ul.tabs li a {
		display: block;
		margin: 0;
		padding: 12px 0;
		border: 0;
		border-bottom: 2px solid transparent;
		background: none;
		white-space: nowrap;
		font-size: 11px;
		letter-spacing: 0.04em;
		color: rgba(var(--text-color), 0.6);
	}

	body.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
		color: rgb(var(--heading-color));
		border-bottom-color: rgb(var(--heading-color));
	}

	/* Cart block.
	   Next to a 90px thumbnail the imported name ran to seven lines and the
	   short description to four, so a single row filled the whole screen.
	   The blocks plugin ships `table.wc-block-cart-items ... { display: block }`
	   for both, so match that weight plus a body element. */
	body .wc-block-cart-items .wc-block-cart-items__row .wc-block-components-product-name,
	body .wc-block-cart-items .wc-block-cart-items__row .wc-block-components-product-metadata {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		line-clamp: 2;
		overflow: hidden;
	}

	#site-header .container{
		padding-left:1px;
	}
}