/*
 * UI polish layer (3.4.86), loaded after every other theme stylesheet, mobile.css included
 * (see stx_bullseye_enqueue_polish_styles() in functions.php). Site-wide rules only:
 * numbers, headline wrapping, contrast, focus, busy states and motion.
 * Each block is independent; removing one block restores the earlier look for that item.
 */

/* Numbers line up in price columns, totals and stock counts. Display headlines keep their own digits. */
body { font-variant-numeric: tabular-nums; }
h1, h2, h3 { font-variant-numeric: normal; }

/* Headlines break into even lines; body text avoids a lone last word. */
h1, h2, h3, .stx-section-head h2, .product_title { text-wrap: balance; }
p, li, dd, figcaption { text-wrap: pretty; }

/* Section kickers repeated the heading under them ("Contact" over "Contact & directions"). */
.stx-section-kicker { display: none; }

/* Contrast (WCAG AA, 4.5:1 for text this size).
   White on the old oranges measured 2.7:1 (checkout) and 3.2-3.6:1 (primary buttons). */
.stx-btn--primary,
.site-shell .stx-btn--primary {
	background-image: linear-gradient(135deg, #b45309, #c2410c);
}
.stx-btn--primary,
.site-shell .stx-btn--primary,
.stx-footer .stx-btn--primary,
.stx-footer-cta .stx-btn--primary { color: #fff; }           /* the footer CTA inherited slate-300, 3.4:1 */
/* The cart's buttons take their colour from these variables (cart-stx.css). */
body.stx-cart-page,
body.stx-classic-cart {
	--stx-cart-orange: #c2410c;
	--stx-cart-orange-dark: #9a3412;
}
/* Patriotic season: the search button turns red-to-navy but kept its dark icon (1.3:1). */
body.stx-season--patriotic .stx-retail-v2 .stx-retail-search button,
body.stx-season--patriotic .site-shell .stx-retail-search button { color: #fff; }
.stx-footer-bottom span,
.stx-footer-bottom p,
.stx-footer-bottom small { color: #94a3b8; }               /* was #64748b on #070b10, 4.15:1 */
.stx-bundle-card__availability { color: #fdba74; }           /* was #8a2f16 on the dark card, 2.06:1 */

/* Inner radius = outer radius - padding (14px - 10px). */
.stx-spin__ticket-copy { border-radius: 4px; }

/* One visible keyboard focus ring everywhere. */
a:focus-visible,
button:focus-visible,
.button:focus-visible,
.stx-btn:focus-visible,
summary:focus-visible,
[role="button"]:focus-visible {
	outline: 2px solid #fb923c;
	outline-offset: 2px;
}

/* Busy states: WooCommerce adds .loading to a pressed button and .processing to a submitting form. */
.button.loading,
.stx-btn.loading,
form.processing button[type="submit"] {
	position: relative;
	pointer-events: none;
	opacity: 0.85;
}
.button.loading::after,
.stx-btn.loading::after,
form.processing button[type="submit"]::after {
	content: "";
	display: inline-block;
	width: 0.85em;
	height: 0.85em;
	margin-left: 0.5em;
	vertical-align: -0.1em;
	border: 2px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: stx-polish-spin 700ms linear infinite;
}
@keyframes stx-polish-spin { to { transform: rotate(360deg); } }

/* Feedback that moves only when something happened: notices and "View cart" after an add. */
.woocommerce-message,
.woocommerce-error,
.woocommerce-info,
a.added_to_cart {
	animation: stx-polish-in 200ms cubic-bezier(0.2, 0.7, 0.3, 1) both;
}
@keyframes stx-polish-in {
	from { opacity: 0; transform: translateY(-4px); }
	to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
	.woocommerce-message,
	.woocommerce-error,
	.woocommerce-info,
	a.added_to_cart { animation: none; }
	.button.loading::after,
	.stx-btn.loading::after,
	form.processing button[type="submit"]::after { animation: none; border-right-color: currentColor; opacity: 0.5; }
}

/* ---- Motion (second pass). Everyday UI: short, no bounce, entrances ease out, exits are shorter. ---- */
:root {
	--stx-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
	--stx-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
	--stx-enter: 200ms;
	--stx-exit: 160ms; /* 20% shorter than the entrance */
}

/* Press: 0.97 at once while held (no tween), eased back on release. */
.button:active,
.stx-btn:active,
.single_add_to_cart_button:active,
.stx-mini-cart__close:active,
.stx-cart-remove-modal__btn:active {
	transform: scale(0.97);
	transition-duration: 0s;
}

/* Mega menu (a dropdown): leaves in 140ms, arrives in 180ms with ease-out. */
.site-shell .stx-mega {
	transition: opacity 140ms ease-in, transform 140ms ease-in, visibility 140ms;
}
.site-shell .stx-mega-nav__item:hover > .stx-mega,
.site-shell .stx-mega-nav__item:focus-within > .stx-mega {
	transition: opacity 180ms var(--stx-ease-out), transform 180ms var(--stx-ease-out), visibility 0s;
}

/* Pop-ups start at 0.95 and fade their backdrop in. The mini cart grows from the header cart icon's
   side (top right); the remove-item dialog from its centre. */
.stx-mini-cart:not([hidden]) .stx-mini-cart__panel {
	transform-origin: top right;
	animation: stx-polish-pop var(--stx-enter) var(--stx-ease-out);
}
.stx-cart-remove-modal:not([hidden]) .stx-cart-remove-modal__panel {
	animation: stx-polish-pop var(--stx-enter) var(--stx-ease-out);
}
.stx-mini-cart:not([hidden]) .stx-mini-cart__backdrop,
.stx-cart-remove-modal:not([hidden]) .stx-cart-remove-modal__backdrop {
	animation: stx-polish-fade var(--stx-enter) ease-out;
}
@keyframes stx-polish-pop {
	from { opacity: 0; transform: scale(0.95); }
	to { opacity: 1; transform: none; }
}
@keyframes stx-polish-fade {
	from { opacity: 0; }
	to { opacity: 1; }
}

/* Mini-cart rows settle one after another, 30ms apart (first six). */
.stx-mini-cart:not([hidden]) .stx-mini-cart__item {
	animation: stx-polish-in var(--stx-enter) var(--stx-ease-out) both;
}
.stx-mini-cart:not([hidden]) .stx-mini-cart__item:nth-child(2) { animation-delay: 30ms; }
.stx-mini-cart:not([hidden]) .stx-mini-cart__item:nth-child(3) { animation-delay: 60ms; }
.stx-mini-cart:not([hidden]) .stx-mini-cart__item:nth-child(4) { animation-delay: 90ms; }
.stx-mini-cart:not([hidden]) .stx-mini-cart__item:nth-child(5) { animation-delay: 120ms; }
.stx-mini-cart:not([hidden]) .stx-mini-cart__item:nth-child(6) { animation-delay: 150ms; }

/* Phone menu groups unroll behind a mask when opened. */
.site-shell .stx-mobile-group[open] > :not(summary),
.site-shell .stx-mobile-subgroup[open] > :not(summary) {
	animation: stx-polish-reveal var(--stx-enter) var(--stx-ease-out);
}
@keyframes stx-polish-reveal {
	from { opacity: 0; clip-path: inset(0 0 100% 0); }
	to { opacity: 1; clip-path: inset(0); }
}

/* Success pulses once: "added to your cart" and the "View cart" link. */
.woocommerce-message {
	animation: stx-polish-in var(--stx-enter) var(--stx-ease-out) both, stx-polish-pulse 520ms var(--stx-ease-out) 200ms 1;
}
a.added_to_cart {
	animation: stx-polish-in var(--stx-enter) var(--stx-ease-out) both, stx-polish-pulse 520ms var(--stx-ease-out) 200ms 1;
}
@keyframes stx-polish-pulse {
	from { box-shadow: 0 0 0 0 rgba(251, 146, 60, 0.45); }
	to { box-shadow: 0 0 0 10px rgba(251, 146, 60, 0); }
}

@media (prefers-reduced-motion: reduce) {
	.button:active,
	.stx-btn:active,
	.single_add_to_cart_button:active,
	.stx-mini-cart__close:active,
	.stx-cart-remove-modal__btn:active { transform: none; }
	.site-shell .stx-mega,
	.site-shell .stx-mega-nav__item:hover > .stx-mega,
	.site-shell .stx-mega-nav__item:focus-within > .stx-mega { transition: none; }
	.stx-mini-cart:not([hidden]) .stx-mini-cart__panel,
	.stx-cart-remove-modal:not([hidden]) .stx-cart-remove-modal__panel,
	.stx-mini-cart:not([hidden]) .stx-mini-cart__backdrop,
	.stx-cart-remove-modal:not([hidden]) .stx-cart-remove-modal__backdrop,
	.stx-mini-cart:not([hidden]) .stx-mini-cart__item,
	.site-shell .stx-mobile-group[open] > :not(summary),
	.site-shell .stx-mobile-subgroup[open] > :not(summary),
	.woocommerce-message,
	a.added_to_cart { animation: none; }
}
