/* Doki Site Kit 1.7.264: keep SHOP BY CATEGORY labels inside their tiles.
 *
 * Cause: in the desktop 2-column row layout (min-width: 1420px) each tile is
 * ~121px. Live custom CSS puts word-break:normal; overflow-wrap:normal;
 * min-width:0 on the <a> only, so the label <span> keeps min-width:auto.
 * Site-wide picture.doki-pic{display:contents} also turns the two <source>
 * elements into flex siblings, each consuming a .5rem gap (~16px). Together
 * with the 34px thumb + .5rem gap + .4rem padding, "Merchandise" (~73px at
 * .74rem) overflows the lavender pill by ~23px. "Pre-orders" wraps after its
 * hyphen ("Pre-" / "orders"). Mobile shop-mobile.css used
 * overflow-wrap:break-word, which would mid-word-break "Merchandise".
 *
 * Fix: picture is one flex item, text column min-width:0, no mid-word or
 * hyphen breaks, slightly tighter font/gap/padding in the row layout so
 * every label fits, no clip or ellipsis. Selectors start with `html body`
 * to win over Additional CSS.
 */

html body.woocommerce.archive.ast-left-sidebar .doki-shop-nav__tiles a {
	min-width: 0;
	box-sizing: border-box;
}


/* picture.doki-pic is display:contents site-wide, so <source> elements become
   flex siblings of the thumb and steal gap space from the label. Keep the
   picture as one flex item. */
html body.woocommerce.archive.ast-left-sidebar .doki-shop-nav__tiles a > picture.doki-pic {
	display: flex;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
}
html body.woocommerce.archive.ast-left-sidebar .doki-shop-nav__tiles a > span {
	min-width: 0;
	flex: 1 1 auto;
	box-sizing: border-box;
	max-width: 100%;
	overflow: visible;
	text-overflow: unset;
	overflow-wrap: normal;
	word-break: normal;
	hyphens: none;
	white-space: normal;
}

/* Keep the existing hyphen in "Pre-orders" from becoming a line break. */
html body.woocommerce.archive.ast-left-sidebar .doki-shop-nav__tiles a[href*="/product-category/pre-order/"] > span {
	white-space: nowrap;
}

/* Row layout (thumb left of label): fit "Merchandise" on one line. */
@media (min-width: 1420px) {
	html body.woocommerce.archive.ast-left-sidebar .doki-shop-nav__tiles a {
		gap: 0.3rem;
		padding: 0.35rem 0.3rem;
		font-size: 0.68rem;
	}
}

/* Current category uses the same lavender pill as hover/focus. */
html body.woocommerce.archive.ast-left-sidebar .doki-shop-nav__tiles a.is-current,
html body.woocommerce.archive.ast-left-sidebar .doki-shop-nav__tiles a[aria-current="page"],
html body.term-trading-cards .doki-shop-nav__tiles a[href*="/product-category/trading-cards/"],
html body.term-merchandise .doki-shop-nav__tiles a[href*="/product-category/merchandise/"],
html body.term-apparel .doki-shop-nav__tiles a[href*="/product-category/apparel/"],
html body.term-pre-order .doki-shop-nav__tiles a[href*="/product-category/pre-order/"] {
	background: var(--doki-purple-soft);
	color: var(--doki-purple-ink) !important;
}

html body.woocommerce.archive.ast-left-sidebar .doki-shop-nav__tiles a.is-current img,
html body.woocommerce.archive.ast-left-sidebar .doki-shop-nav__tiles a[aria-current="page"] img,
html body.term-trading-cards .doki-shop-nav__tiles a[href*="/product-category/trading-cards/"] img,
html body.term-merchandise .doki-shop-nav__tiles a[href*="/product-category/merchandise/"] img,
html body.term-apparel .doki-shop-nav__tiles a[href*="/product-category/apparel/"] img,
html body.term-pre-order .doki-shop-nav__tiles a[href*="/product-category/pre-order/"] img {
	box-shadow: 0 0 0 3px rgba(91, 61, 181, 0.2), 0 6px 14px rgba(31, 26, 43, 0.16);
}