/* RecCMS Site Overrides — loaded AFTER site-uastyle.css */

/* Fix nav link colors (Bootstrap a:link overrides uastyle) */
.main-nav > a,
.main-nav .nav-item > a,
.site-footer a,
.topbar a {
	color: inherit;
	text-decoration: none;
}
.main-nav > a:hover,
.main-nav .nav-item > a:hover {
	color: inherit;
}

/* Main-nav dropdown — desktop: hover-triggered overlay; mobile: Bootstrap collapse */
.main-nav .nav-item.has-dropdown { position: relative; }
.main-nav .nav-dropdown-toggle {
	background: none; border: none; padding: .25rem;
	color: inherit; cursor: pointer; line-height: 1;
	transition: transform .2s;
}
.main-nav .nav-dropdown-toggle .icon { width: 14px; height: 14px; }
.main-nav .nav-dropdown-toggle[aria-expanded="true"] { transform: rotate(180deg); }

@media (min-width: 993px) {
	/* Desktop: overlay dropdown, hover-triggered. Override Bootstrap .collapse display. */
	.main-nav .nav-dropdown.collapse,
	.main-nav .nav-dropdown.collapsing,
	.main-nav .nav-dropdown {
		display: block !important;
		height: auto !important;
		position: absolute;
		top: 100%;
		left: 0;
		min-width: 220px;
		background: var(--us-bg, #fff);
		border: 1px solid var(--us-line, #e0e0e0);
		box-shadow: var(--us-shadow, 0 8px 24px rgba(0,0,0,.08));
		border-radius: 0 0 .5rem .5rem;
		padding: .5rem 0;
		opacity: 0;
		visibility: hidden;
		transform: translateY(-6px);
		transition: opacity .2s, transform .2s, visibility .2s;
		z-index: 1020;
		pointer-events: none;
	}
	.main-nav .nav-item.has-dropdown:hover > .nav-dropdown,
	.main-nav .nav-item.has-dropdown:focus-within > .nav-dropdown {
		opacity: 1;
		visibility: visible;
		transform: translateY(0);
		pointer-events: auto;
	}
}

.main-nav .nav-dropdown ul { list-style: none; margin: 0; padding: 0; }
.main-nav .nav-dropdown li { margin: 0; }
.main-nav .nav-dropdown a {
	display: block;
	padding: .5rem 1rem;
	font-size: .88rem;
	color: var(--us-ink-2, #555);
	text-decoration: none;
	text-transform: none;
	letter-spacing: 0;
	transition: background .15s, color .15s;
}
.main-nav .nav-dropdown a::after { display: none; }
.main-nav .nav-dropdown a:hover {
	background: var(--us-bg-soft, #f5f5f5);
	color: var(--us-ink, #111);
}

@media (max-width: 992px) {
	/* Mobile: Bootstrap collapse handles show/hide animation */
	.main-nav .nav-item.has-dropdown {
		position: static;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
	}
	.main-nav .nav-item.has-dropdown > a { flex: 1; }
	.main-nav .nav-dropdown {
		flex-basis: 100%;
		padding: .25rem 0 .25rem 1rem;
		background: transparent;
		border: none;
		box-shadow: none;
	}
	.main-nav .nav-dropdown a { padding: .35rem 0; }
}

/* Mobile: compact header action buttons */
@media (max-width: 768px) {
	.header-actions .btn-icon,
	.header-actions .theme-toggle,
	.mobile-menu-btn {
		width: 36px;
		height: 36px;
	}
	.header-actions .btn-icon .icon,
	.header-actions .theme-toggle .icon,
	.mobile-menu-btn .icon {
		width: 16px;
		height: 16px;
	}
}

/* Cart drawer summary: right-align shipping value on narrow screens */
@media (max-width: 480px) {
	#cart .cart-summary .row-line { flex-wrap: wrap; }
	#cart .cart-summary .row-line > :last-child { margin-left: auto; text-align: right; }
}

/* Cart drawer line — compact item row (always narrow, like mobile) */
.cart-drawer-line {
	display: grid;
	grid-template-columns: 72px 1fr;
	grid-template-areas:
		"media title"
		"actions actions";
	gap: .5rem .75rem;
	padding: .75rem;
	background: var(--us-bg-soft, #fafafa);
	border: 1px solid var(--us-line, #ececec);
	border-radius: 12px;
	position: relative;
	margin-bottom: .5rem;
}
.cart-drawer-line__media { grid-area: media; position: relative; }
.cart-drawer-line__media img {
	width: 72px; height: 96px;
	object-fit: cover;
	border-radius: 8px;
	background: var(--us-bg-elevated, #fff);
	display: block;
}
.cart-drawer-line__title {
	grid-area: title;
	font-size: .88rem;
	font-weight: 500;
	line-height: 1.3;
	color: var(--us-ink, #111);
	padding-right: 28px; /* space for remove button corner */
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.cart-drawer-line__actions {
	grid-area: actions;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .75rem;
	padding-top: .5rem;
	border-top: 1px solid var(--us-line, #eee);
}
.cart-drawer-line__price {
	font-weight: 600;
	font-size: 1rem;
	color: var(--us-ink, #111);
}
.cart-drawer-line__remove {
	position: absolute;
	top: 6px;
	left: 6px;
	width: 28px;
	height: 28px;
	border: none;
	background: var(--us-bg-elevated, #fff);
	color: var(--us-ink-2, #555);
	border-radius: 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 2;
	box-shadow: 0 1px 4px rgba(0,0,0,.12);
	transition: background .15s, color .15s;
}
.cart-drawer-line__remove:hover {
	background: var(--us-promo, #c4422a);
	color: var(--us-ink-inverse, #fff);
}
.cart-drawer-line__remove .icon { width: 14px; height: 14px; }

/* Catalog root-category chips */
.catalog-categories { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.catalog-categories__chip {
	display: inline-block;
	padding: .4rem .9rem;
	border: 1px solid var(--us-line, #e0e0e0);
	border-radius: 999px;
	background: var(--us-bg, #fff);
	color: var(--us-ink, #111);
	text-decoration: none;
	font-size: .85rem;
	font-weight: 500;
	transition: border-color .15s, background .15s;
}
.catalog-categories__chip:hover {
	border-color: var(--us-ink, #111);
	background: var(--us-bg-soft, #f5f5f5);
}

/* Cart drawer actions — two buttons (Cart / Checkout) */
.cart-drawer-actions { display: flex; gap: .5rem; }
.cart-drawer-actions .btn { flex: 1; }

/* ============ V4 Checkout (tabs + cart + delivery + payment on one page) ============ */

/* Tab pills */
.checkout-tabs { display: flex; gap: .5rem; margin: 0 0 1.5rem; padding: 0; list-style: none; border: none; }
.checkout-tab { flex: 1; display: flex; align-items: center; gap: .75rem; background: var(--us-bg-soft, #f5f5f5); border: 1px solid transparent; border-radius: 14px; padding: 1rem 1.25rem; cursor: pointer; text-align: left; transition: background .15s, border-color .15s, box-shadow .15s; color: var(--us-ink-2, #555); position: relative; }
.checkout-tab:hover { background: #ededed; }
.checkout-tab.active { background: var(--us-bg-elevated, #fff); border-color: var(--us-line, #e0e0e0); box-shadow: 0 2px 8px rgba(0,0,0,.06); color: var(--us-ink, #111); }
.checkout-tab__num { width: 32px; height: 32px; border-radius: 50%; background: var(--us-bg-elevated, #fff); border: 1.5px solid var(--us-line, #ddd); display: inline-flex; align-items: center; justify-content: center; font-weight: 600; font-size: .95rem; flex-shrink: 0; }
.checkout-tab.active .checkout-tab__num { background: var(--us-ink, #111); color: var(--us-ink-inverse, #fff); border-color: var(--us-ink, #111); }
/* Explicit dark-mode overrides — both [data-theme="dark"] (uastyle) and
   [data-bs-theme="dark"] (Bootstrap 5) supported. The token-based version
   above is correct in theory, but if a theme.min.css redefines `--us-ink`
   without `--us-ink-inverse`, you get a "light text on light bg" trap.
   Hardcoded values guarantee contrast regardless of token state. */
[data-theme="dark"] .checkout-tab.active .checkout-tab__num,
[data-bs-theme="dark"] .checkout-tab.active .checkout-tab__num {
    background: #f5f5f5;
    color: #0d0d0d;
    border-color: #f5f5f5;
}
.checkout-tab__body { display: block; flex: 1; }
.checkout-tab__label { display: block; font-weight: 600; font-size: 1rem; line-height: 1.2; }
.checkout-tab__count { display: block; font-size: .75rem; color: var(--us-ink-3, #999); font-weight: 400; }
@media (max-width: 640px) {
  .checkout-tab { padding: .75rem; }
  .checkout-tab__label { font-size: .9rem; }
  .checkout-tab__count { display: none; }
}

/* Cart empty state */
.cart-empty {
	text-align: center;
	padding: 3rem 1rem;
	background: var(--us-bg-soft, #fafafa);
	border: 1px solid var(--us-line, #ececec);
	border-radius: 14px;
	margin-bottom: 2rem;
}
.cart-empty__icon {
	width: 48px !important;
	height: 48px !important;
	color: var(--us-ink-3, #bbb);
	margin-bottom: .75rem;
}
.cart-empty h3 { font-size: 1.15rem; margin: 0 0 .5rem; color: var(--us-ink, #111); }
.cart-empty p { max-width: 420px; margin: 0 auto 1rem; }
.cart-empty .btn .icon { margin-right: .35rem; }

/* Cart lines */
.cart-lines { display: flex; flex-direction: column; gap: .75rem; margin-bottom: 2rem; }
.cart-line { display: grid; grid-template-columns: 96px 1fr auto auto auto; gap: 1rem; align-items: center; padding: 1rem; background: var(--us-bg-soft, #fafafa); border-radius: 14px; border: 1px solid var(--us-line, #ececec); position: relative; }
.cart-line__media { display: block; flex-shrink: 0; }
.cart-line__media img { width: 96px; height: 128px; object-fit: cover; border-radius: 10px; background: var(--us-bg-elevated, #fff); }
.cart-line__body { min-width: 0; }
.cart-line__brand { font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; color: var(--us-ink-3, #999); margin-bottom: .15rem; }
.cart-line__title { display: block; font-size: 1rem; font-weight: 500; color: var(--us-ink, #111); text-decoration: none; margin-bottom: .35rem; line-height: 1.3; }
.cart-line__title:hover { text-decoration: underline; }
.cart-line__attrs { display: flex; gap: .35rem; margin-bottom: .5rem; flex-wrap: wrap; }
.cart-line__attrs .chip { font-size: .72rem; padding: .15rem .5rem; border-radius: 999px; background: var(--us-bg-elevated, #fff); border: 1px solid var(--us-line, #e0e0e0); color: var(--us-ink-2, #555); }
.cart-line__meta { display: flex; gap: 1rem; align-items: center; font-size: .78rem; color: var(--us-ink-3, #999); flex-wrap: wrap; }
.cart-line__tenant { display: inline-flex; align-items: center; gap: .25rem; }
.cart-line__tenant .icon { width: 13px; height: 13px; }

.qty-stepper { display: inline-flex; align-items: center; border: 1px solid var(--us-line, #ddd); border-radius: 999px; background: var(--us-bg-elevated, #fff); overflow: hidden; }
.qty-stepper button { width: 32px; height: 32px; background: transparent; border: none; cursor: pointer; color: var(--us-ink-2, #555); display: inline-flex; align-items: center; justify-content: center; transition: background .15s; }
.qty-stepper button:hover { background: var(--us-bg-soft, #f5f5f5); color: var(--us-ink, #111); }
.qty-stepper button .icon { width: 14px; height: 14px; }
.qty-stepper input { width: 38px; text-align: center; border: none; background: transparent; font-weight: 600; font-size: .9rem; color: var(--us-ink, #111); outline: none; padding: 0; }

.cart-line__price { text-align: right; min-width: 90px; }
.cart-line__price-now { font-weight: 600; font-size: 1rem; }
.cart-line__price-now.promo { color: var(--us-promo, #c4422a); }
.cart-line__price-old { font-size: .8rem; color: var(--us-ink-3, #999); text-decoration: line-through; }

.cart-line__remove { width: 36px; height: 36px; background: transparent; border: none; color: var(--us-ink-3, #999); cursor: pointer; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; transition: background .15s, color .15s; }
.cart-line__remove:hover { background: #fdeaea; color: #c4422a; }
.cart-line__remove .icon { width: 18px; height: 18px; }

@media (max-width: 720px) {
  .cart-line { grid-template-columns: 80px 1fr auto; grid-template-areas: "media body remove" "actions actions actions"; gap: .75rem; padding: .75rem; }
  .cart-line__media { grid-area: media; }
  .cart-line__media img { width: 80px; height: 100px; }
  .cart-line__body { grid-area: body; min-width: 0; }
  .cart-line__remove { grid-area: remove; align-self: start; width: 32px; height: 32px; }
  .cart-line__remove .icon { width: 16px; height: 16px; }
  .cart-line__qty, .cart-line__price { grid-area: actions; border-top: 1px solid #eee; padding-top: .65rem; align-self: end; }
  .cart-line__qty { justify-self: start; }
  .cart-line__price { justify-self: end; }
}

/* Recently viewed slider */
.recently-viewed { margin-bottom: 2rem; }
/* Splide auto-deactivates when total slides < perPage (default config has
   perPage: 5, but a typical session has 2-3 recently-viewed items). When
   not `.is-active`, splide.min.css forces `.splide__list { display: block }`
   making cards stack vertically. We want the slider layout regardless of
   item count — force flex. */
.recently-viewed .splide.is-initialized .splide__list { display: flex !important; }
.recently-viewed__head { margin-bottom: 1rem; }
.recently-viewed__head h3 { font-size: 1.2rem; margin: .25rem 0 0; }
.rv-card { display: flex; flex-direction: column; gap: .35rem; text-align: left; }
.rv-card__media { display: block; aspect-ratio: 3 / 4; border-radius: 10px; overflow: hidden; background: var(--us-bg-soft, #f5f5f5); margin-bottom: .5rem; }
.rv-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.rv-card__media:hover img { transform: scale(1.04); }
.rv-card__brand { font-size: .7rem; text-transform: uppercase; letter-spacing: .05em; color: var(--us-ink-3, #999); }
.rv-card__title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: .88rem; font-weight: 500; color: var(--us-ink, #111); text-decoration: none; line-height: 1.25; min-height: 2.2em; }
.rv-card__price { font-weight: 600; font-size: .9rem; margin: .15rem 0 .5rem; }
.rv-card__add { border: 1px solid var(--us-ink, #111); background: transparent; color: var(--us-ink, #111); padding: .4rem .75rem; border-radius: 999px; font-size: .78rem; font-weight: 500; cursor: pointer; transition: background .15s, color .15s; }
.rv-card__add:hover { background: var(--us-ink, #111); color: #fff; }

/* Cart actions footer */
.cart-actions { display: flex; justify-content: space-between; gap: 1rem; padding: 1rem 0 0; border-top: 1px solid var(--us-line, #eee); flex-wrap: wrap; }
.btn-ghost { background: transparent; border: none; color: var(--us-ink-2, #555); display: inline-flex; align-items: center; gap: .35rem; padding: .5rem .75rem; text-decoration: none; cursor: pointer; font-size: .9rem; }
.btn-ghost:hover { color: var(--us-ink, #111); }
.btn-ghost .icon { width: 16px; height: 16px; }

/* Saved addresses */
.saved-addresses { display: flex; flex-direction: column; gap: .5rem; margin-bottom: 1rem; }
.saved-address { display: grid; grid-template-columns: auto 1fr auto; gap: .75rem; align-items: start; padding: 1rem; background: var(--us-bg-elevated, #fff); border: 1.5px solid var(--us-line, #e0e0e0); border-radius: 12px; cursor: pointer; transition: border-color .15s, background .15s; }
.saved-address input[type="radio"] { margin: .2rem 0 0; accent-color: var(--us-ink, #111); }
.saved-address:hover { border-color: #999; }
.saved-address.is-selected, .saved-address:has(input:checked) { border-color: var(--us-ink, #111); background: var(--us-bg-soft, #fafafa); }
.saved-address__head { display: flex; align-items: center; gap: .5rem; margin-bottom: .2rem; }
.saved-address__head strong { font-size: .95rem; }
.saved-address__text { font-size: .85rem; color: var(--us-ink-2, #555); line-height: 1.4; }
.badge-soft { display: inline-block; font-size: .65rem; padding: .1rem .45rem; border-radius: 999px; background: var(--us-ink, #111); color: var(--us-ink-inverse, #fff); text-transform: uppercase; letter-spacing: .04em; font-weight: 500; }
[data-theme="dark"] .badge-soft,
[data-bs-theme="dark"] .badge-soft {
    background: #f5f5f5;
    color: #0d0d0d;
}
.saved-address__edit { width: 32px; height: 32px; border-radius: 50%; background: transparent; border: 1px solid transparent; color: var(--us-ink-3, #999); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: background .15s, color .15s, border-color .15s; text-decoration: none; padding: 0; }
.saved-address__edit:hover { background: var(--us-bg-elevated, #fff); color: var(--us-ink, #111); border-color: var(--us-line, #ddd); text-decoration: none; }
.saved-address__edit .icon { width: 14px; height: 14px; }

.saved-addresses-more { }
.saved-addresses-more[open] summary { margin-bottom: .5rem; }
.saved-addresses-more > .saved-address + .saved-address { margin-top: .5rem; }
.saved-addresses-more summary { cursor: pointer; font-size: .85rem; color: var(--us-ink-2, #555); padding: .65rem 1rem; font-weight: 500; list-style: none; background: var(--us-bg-soft, #fafafa); border: 1px dashed var(--us-line, #ddd); border-radius: 12px; transition: border-color .15s, color .15s; }
.saved-addresses-more summary:hover { border-color: var(--us-ink-3, #999); color: var(--us-ink, #111); }
.saved-addresses-more summary::-webkit-details-marker { display: none; }
.saved-addresses-more summary::before { content: "▸"; display: inline-block; margin-right: .4rem; transition: transform .15s; }
.saved-addresses-more[open] summary::before { transform: rotate(90deg); }

.saved-address-add { display: inline-flex; align-items: center; gap: .4rem; background: transparent; border: 1.5px dashed var(--us-line, #ccc); color: var(--us-ink-2, #555); padding: .75rem 1rem; border-radius: 12px; cursor: pointer; font-size: .88rem; font-weight: 500; transition: border-color .15s, color .15s; margin-top: .25rem; align-self: flex-start; }
.saved-address-add:hover { border-color: var(--us-ink, #111); color: var(--us-ink, #111); }
.saved-address-add .icon { width: 16px; height: 16px; }

.delivery-option.is-selected, .delivery-option:has(input:checked) { border-color: var(--us-ink, #111); background: var(--us-bg-soft, #fafafa); }

/* Sticky sidebar */
.sticky-summary { position: sticky; top: 1rem; }
.summary-trust { display: flex; justify-content: space-around; margin-top: .75rem; padding-top: .75rem; border-top: 1px solid var(--us-line, #eee); font-size: .75rem; color: var(--us-ink-3, #999); }
.summary-trust span { display: inline-flex; align-items: center; gap: .3rem; }
.summary-trust .icon { width: 14px; height: 14px; }

/* Sidebar selection row (delivery + payment summary) */
.summary-selection { display: flex; flex-direction: column; gap: .5rem; margin: .5rem 0 1rem; padding-bottom: 1rem; border-bottom: 1px solid var(--us-line, #eee); }
.summary-selection__row { display: grid; grid-template-columns: 28px 1fr auto; gap: .6rem; align-items: start; padding: .5rem; background: var(--us-bg-soft, #fafafa); border-radius: 8px; }
.summary-selection__icon { color: var(--us-ink-2, #555); display: inline-flex; align-items: center; justify-content: center; margin-top: 2px; }
.summary-selection__icon .icon { width: 18px; height: 18px; }
.summary-selection__body { min-width: 0; }
.summary-selection__label { font-size: .65rem; text-transform: uppercase; letter-spacing: .05em; color: var(--us-ink-3, #999); font-weight: 500; }
.summary-selection__value { font-size: .88rem; font-weight: 600; color: var(--us-ink, #111); line-height: 1.25; margin: .1rem 0 .15rem; }
.summary-selection__meta { font-size: .75rem; color: var(--us-ink-2, #555); line-height: 1.3; }
.summary-selection__edit { width: 28px; height: 28px; border-radius: 50%; background: var(--us-bg-elevated, #fff); border: 1px solid var(--us-line, #ddd); color: var(--us-ink-2, #555); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: background .15s, color .15s, border-color .15s; flex-shrink: 0; align-self: start; }
.summary-selection__edit:hover { background: var(--us-ink, #111); color: #fff; border-color: var(--us-ink, #111); }
.summary-selection__edit .icon { width: 14px; height: 14px; }

/* Coupon apply button — icon + label; mobile = icon only */
.coupon-apply-btn { display: inline-flex; align-items: center; gap: .35rem; flex-shrink: 0; white-space: nowrap; }
.coupon-apply-btn .icon { width: 14px; height: 14px; }
@media (max-width: 480px) {
	.coupon-apply-btn__label { display: none; }
}

/* Splide arrow in checkout */
#recentlyViewedSplide .splide__arrow { background: var(--us-bg-elevated, #fff); border: 1px solid var(--us-line, #ddd); opacity: 1; }
#recentlyViewedSplide .splide__arrow svg { fill: var(--us-ink, #111); }

/* Mobile: hide sidebar (info already in tabs) */
@media (max-width: 992px) {
  .checkout-aside { display: none; }
}

/* Language dropdown — base */
.lang-dropdown { position: relative; }
.lang-dropdown__toggle {
	display: flex; align-items: center; gap: .35rem;
	background: none; border: none; cursor: pointer;
	font-size: .8rem; font-weight: 500; letter-spacing: .02em;
	color: inherit; padding: .25rem 0;
}
.lang-dropdown__toggle .icon { width: 16px; height: 16px; }
.lang-dropdown__toggle .icon-chevron { width: 12px; height: 12px; transition: transform .2s; }
.lang-dropdown.is-open .icon-chevron { transform: rotate(180deg); }
.lang-dropdown__menu {
	display: none; position: absolute; top: 100%; right: 0;
	background: var(--us-bg-elevated, #fff); border: 1px solid var(--us-line, #e0e0e0);
	border-radius: .5rem; padding: .35rem 0; min-width: 140px;
	box-shadow: 0 8px 24px rgba(0,0,0,.15); z-index: 1050;
}
.lang-dropdown__menu.is-open { display: block; }
.lang-dropdown__menu a.lang-dropdown__item {
	display: block; padding: .4rem .75rem; font-size: .82rem;
	color: var(--us-ink, #333); text-decoration: none; white-space: nowrap; opacity: 1;
}
.lang-dropdown__menu a.lang-dropdown__item:hover { background: var(--us-bg-soft, #f0ede8); color: var(--us-ink, #111); }
.lang-dropdown__menu a.lang-dropdown__item.is-active { font-weight: 600; color: var(--us-ink, #111); }

/* Language dropdown — topbar (always-dark bar) */
.topbar .lang-dropdown__toggle { color: rgba(255,255,255,.7); }
.topbar .lang-dropdown__toggle:hover { color: #fff; }

/* Language dropdown — DARK THEME */
[data-theme="dark"] .lang-dropdown__menu,
[data-bs-theme="dark"] .lang-dropdown__menu {
	background: #1e1e1e; border-color: #3a3a3a;
	box-shadow: 0 8px 24px rgba(0,0,0,.4);
}
[data-theme="dark"] .lang-dropdown__menu a.lang-dropdown__item,
[data-bs-theme="dark"] .lang-dropdown__menu a.lang-dropdown__item { color: #ccc; opacity: 1; }
[data-theme="dark"] .lang-dropdown__menu a.lang-dropdown__item:hover,
[data-bs-theme="dark"] .lang-dropdown__menu a.lang-dropdown__item:hover { background: #2a2a2a; color: #fff; }
[data-theme="dark"] .lang-dropdown__menu a.lang-dropdown__item.is-active,
[data-bs-theme="dark"] .lang-dropdown__menu a.lang-dropdown__item.is-active { color: #fff; }

/* Page padding overrides (layout handles spacing) */
.account-page, .checkout-page, .cart-page { padding: 0; }
.catalog-layout { padding-bottom: 0; }

/* Product card — variant color dots */
.product-card__colors { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 6px; }
.product-card__color-dot {
	width: 16px; height: 16px; border-radius: 50%; background: var(--c, #999);
	border: 1.5px solid var(--us-line, #e0e0e0); cursor: pointer; transition: transform .15s;
}
.product-card__color-dot:hover { transform: scale(1.2); }
.product-card__color-dot.is-active { border-color: var(--us-ink, #111); outline: 1.5px solid var(--us-ink, #111); outline-offset: 1px; }

/* Product card — variant size chips */
.product-card__sizes { display: flex; gap: 3px; flex-wrap: wrap; margin-top: 6px; }
.product-card__size-chip {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 28px; height: 24px; padding: 0 6px;
	border: 1px solid var(--us-line, #e0e0e0); border-radius: 4px;
	font-size: .7rem; font-weight: 500; cursor: pointer;
	background: transparent; color: var(--us-ink, #111);
	transition: border-color .15s, background .15s;
}
.product-card__size-chip:hover { border-color: var(--us-ink, #111); }
.product-card__size-chip.is-active { background: var(--us-ink, #111); color: var(--us-ink-inverse, #fff); border-color: var(--us-ink, #111); }
.product-card__size-chip.is-out { color: var(--us-ink-3, #999); background: repeating-linear-gradient(-45deg, transparent 0 4px, var(--us-bg-soft, #f5f5f5) 4px 5px); cursor: not-allowed; opacity: .5; }
.product-card__size-chip:disabled { pointer-events: none; }

/* Quick-add modal */
.quick-add-product { display: flex; gap: 1rem; align-items: center; margin-bottom: 1rem; }
.quick-add-product img { width: 80px; height: 100px; object-fit: cover; border-radius: 8px; background: var(--us-bg-soft, #f5f5f5); flex-shrink: 0; }
.quick-add-product__brand { font-size: .7rem; text-transform: uppercase; letter-spacing: .04em; color: var(--us-ink-3, #999); }
.quick-add-product__title { font-size: 1rem; font-weight: 600; }
.quick-add-product__price { font-size: 1rem; font-weight: 600; margin-top: .25rem; }
.quick-add-variants__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: .5rem; margin-top: .5rem; }
.qa-variant-btn { aspect-ratio: 3/4; border: 1px solid var(--us-line, #e0e0e0); border-radius: 8px; padding: 2px; cursor: pointer; background: transparent; transition: border-color .15s; overflow: hidden; }
.qa-variant-btn:hover { border-color: var(--us-ink, #111); }
.qa-variant-btn.is-active { border-color: var(--us-ink, #111); outline: 1px solid var(--us-ink, #111); outline-offset: -2px; }
.qa-color-swatch { display: block; width: 100%; height: 100%; border-radius: 6px; }
@media (max-width: 480px) { .quick-add-variants__grid { grid-template-columns: repeat(5, 1fr); } }

.kit-filters { padding-bottom: 1.5rem; }
/* Filter groups spacing */
.kit-filter-group + .kit-filter-group {
	margin-top: 1.25rem;
	padding-top: 1.25rem;
}
/* Color swatch backgrounds from --c variable */
.color-swatches button[style*="--c"] { background: var(--c); }

/* Toast backdrop */
.toast {
	background: var(--us-bg-elevated, #fff) !important;
	border: 1px solid var(--us-line, #e8e6e0);
	box-shadow: 0 8px 32px rgba(0,0,0,.12);
}
[data-theme="dark"] .toast,
[data-bs-theme="dark"] .toast {
	background: var(--us-bg-elevated, #2a2a2a) !important;
	border-color: var(--us-line, #333);
}

/* Toggle switches in filters */
.kit-filters .form-switch { padding-left: 0; }
.kit-filters .form-switch .form-check-input {
	width: 2.5rem;
	height: 1.35rem;
	margin: 0;
	cursor: pointer;
	background-color: var(--us-line, #ddd);
	border: none;
	border-radius: 1rem;
	transition: background-color .2s;
}
.kit-filters .form-switch .form-check-input:checked {
	background-color: var(--us-ink, #111);
}
.kit-filters .form-switch .form-check-input:focus {
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--us-ink, #111) 20%, transparent);
}
[data-theme="dark"] .kit-filters .form-switch .form-check-input,
[data-bs-theme="dark"] .kit-filters .form-switch .form-check-input {
	background-color: #444;
}
[data-theme="dark"] .kit-filters .form-switch .form-check-input:checked,
[data-bs-theme="dark"] .kit-filters .form-switch .form-check-input:checked {
	background-color: #fff;
}

/* Catalog sort select — underline style */
.catalog-toolbar__sort select {
	appearance: none;
	background: transparent;
	border: none;
	border-bottom: 1px solid var(--us-line, #e8e6e0);
	border-radius: 0;
	padding: .25rem 1.2rem .25rem 0;
	font-size: .85rem;
	font-weight: 500;
	color: inherit;
	cursor: pointer;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right center;
}
.catalog-toolbar__sort select:focus { outline: none; border-bottom-color: var(--us-ink, #111); }
[data-theme="dark"] .catalog-toolbar__sort select,
[data-bs-theme="dark"] .catalog-toolbar__sort select {
	border-bottom-color: var(--us-line, #444);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23aaa' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}

/* Promoted products/news — marketplace highlighting */
.product-card.promoted {
	border: 1px solid var(--bs-primary);
	box-shadow: 0 0 0 1px rgba(var(--bs-primary-rgb), 0.15);
}

/* Product description images */
.product-description img {
	max-width: 100%;
	height: auto;
}

/* Language switcher */
.language-switcher .dropdown-toggle {
	border: none;
	background: none;
	color: inherit;
}

/* Search results (product-search.js) */
.site-search-results {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 1050;
	background: var(--bs-body-bg, #fff);
	border: 1px solid var(--bs-border-color, #dee2e6);
	border-top: none;
	border-radius: 0 0 0.5rem 0.5rem;
	box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
	max-height: 400px;
	overflow-y: auto;
}

.search-result-item {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.5rem 0.75rem;
	text-decoration: none;
	color: var(--bs-body-color);
	border-bottom: 1px solid var(--bs-border-color-translucent, rgba(0,0,0,.05));
}

.search-result-item:hover,
.search-result-item.active {
	background-color: var(--bs-tertiary-bg, #f8f9fa);
}

.search-result-img {
	width: 48px;
	height: 48px;
	object-fit: cover;
	border-radius: 0.375rem;
	flex-shrink: 0;
}

.search-result-img-placeholder {
	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 0.375rem;
	background: var(--bs-tertiary-bg, #f8f9fa);
	flex-shrink: 0;
}

.search-result-title {
	font-size: 0.9rem;
	font-weight: 500;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.search-result-price {
	font-size: 0.8rem;
	color: var(--bs-primary);
	font-weight: 600;
}

.search-show-all {
	display: block;
	padding: 0.6rem 1rem;
	text-align: center;
	font-size: 0.85rem;
	color: var(--bs-primary);
	text-decoration: none;
	border-top: 1px solid var(--bs-border-color, #dee2e6);
	background: var(--bs-tertiary-bg, #f8f9fa);
}

/* SVG icon spin animation (replaces fa-spin) */
@keyframes spin { to { transform: rotate(360deg); } }