/*
 * AURA Woo Shop — foundation.
 *
 * Declares every design token with its inheritance chain and the few
 * utilities the components share. The compiled design (Design → tokens)
 * is printed after this file and overrides the tokens it owns, so the
 * "Theme" design source simply leaves these values in place.
 *
 * Nothing here selects WooCommerce or theme markup: only the AURA roots and
 * AURA utilities. Specificity stays at one or two classes; the WooCommerce
 * normalization lives in aura-shop-compat.css.
 */

.aura-shop,
.aura-shop-page,
.aura-shop-single,
body.woocommerce-cart,
body.woocommerce-checkout,
.aura-shop-drawer,
.aura-shop-dock,
.aura-shop-trigger {
	/* Colour */
	--aura-shop-accent: var(--aura-color-accent, var(--wp--preset--color--primary, #1f2937));
	--aura-shop-accent-hover: var(--aura-color-accent-hover, #111827);
	--aura-shop-accent-contrast: var(--aura-color-accent-contrast, #ffffff);
	--aura-shop-text: var(--aura-color-text, inherit);
	--aura-shop-heading: var(--aura-shop-text);
	--aura-shop-muted: var(--aura-color-muted, #545b66);
	--aura-shop-background: transparent;
	--aura-shop-surface: var(--aura-color-surface, #ffffff);
	--aura-shop-surface-secondary: var(--aura-color-surface-alt, #f5f6f8);
	--aura-shop-border: var(--aura-color-border, rgba(17, 24, 39, 0.16));
	--aura-shop-sale: #9f1239;
	--aura-shop-success: #166534;
	--aura-shop-badge: #111827;
	--aura-shop-badge-text: #ffffff;
	--aura-shop-card-surface: var(--aura-shop-surface);
	--aura-shop-card-media: rgba(17, 24, 39, 0.04);
	--aura-shop-filters-surface: var(--aura-shop-surface);
	--aura-shop-price-color: var(--aura-shop-heading);
	--aura-shop-cart-button-background: var(--aura-shop-accent);
	--aura-shop-cart-button-text: var(--aura-shop-accent-contrast);
	--aura-shop-cart-button-hover: var(--aura-shop-accent-hover);
	--aura-shop-cart-button-border: var(--aura-shop-cart-button-background);
	--aura-shop-cart-button-radius: var(--aura-shop-button-radius);
	--aura-shop-checkout-button-background: var(--aura-shop-accent);
	--aura-shop-checkout-button-text: var(--aura-shop-accent-contrast);
	--aura-shop-checkout-button-hover: var(--aura-shop-accent-hover);
	--aura-shop-checkout-button-border: var(--aura-shop-checkout-button-background);
	--aura-shop-checkout-button-radius: var(--aura-shop-button-radius);

	/* Typography */
	--aura-shop-font-body: inherit;
	--aura-shop-font-heading: inherit;
	--aura-shop-base-size: inherit;
	--aura-shop-heading-weight: 600;
	--aura-shop-card-title-size: 1rem;
	--aura-shop-card-title-weight: 600;
	--aura-shop-card-price-size: 1rem;
	--aura-shop-filters-heading: 1rem;
	--aura-shop-filters-item: 0.875rem;
	--aura-shop-single-title-size: 1.75rem;
	--aura-shop-single-price-size: 1.375rem;

	/* Spacing */
	--aura-shop-space-xs: 4px;
	--aura-shop-space-sm: 8px;
	--aura-shop-space-md: 16px;
	--aura-shop-space-lg: 24px;
	--aura-shop-space-xl: 32px;
	--aura-shop-space-2xl: 48px;

	/* Radius */
	--aura-shop-card-radius: var(--aura-radius-card, 12px);
	--aura-shop-image-radius: var(--aura-radius-card, 10px);
	--aura-shop-button-radius: var(--aura-radius-button, 8px);
	--aura-shop-input-radius: var(--aura-radius-button, 8px);
	--aura-shop-panel-radius: var(--aura-radius-card, 14px);
	--aura-shop-badge-radius: 999px;

	/* Shadow */
	--aura-shop-card-shadow: none;
	--aura-shop-panel-shadow: none;
	--aura-shop-filters-shadow: none;
	--aura-shop-drawer-shadow: 0 2px 6px rgba(17, 24, 39, 0.1), 0 18px 40px rgba(17, 24, 39, 0.12);
	--aura-shop-floating-shadow: 0 1px 2px rgba(17, 24, 39, 0.06), 0 6px 20px rgba(17, 24, 39, 0.06);

	/* Layout */
	--aura-shop-container: var(--aura-container, 1320px);
	--aura-shop-page-gutter: clamp(16px, 4vw, 40px);
	--aura-shop-columns: 4;
	--aura-shop-gap: 24px;
	--aura-shop-sidebar-width: 280px;
	--aura-shop-card-ratio: 1 / 1;
	--aura-shop-card-fit: cover;
	--aura-shop-card-lines: 2;
	--aura-shop-cta-height: 44px;
	--aura-shop-filters-offset: 16px;
	--aura-shop-gallery-ratio: auto;
	--aura-shop-dock-height: 4rem;
	--aura-shop-overlay: rgba(17, 24, 39, 0.5);
	--aura-shop-transition: 180ms ease;
}

.aura-shop {
	color: var(--aura-shop-text);
	font-family: var(--aura-shop-font-body);
	font-size: var(--aura-shop-base-size);
}

/*
 * The page container AURA opens around a classic archive or product page:
 * breadcrumb, title, hero, filters, results, gallery and summary. It never
 * touches the edge of the screen, and its width comes from the design, or
 * from the theme's `--aura-container` when the design leaves it.
 */
.aura-shop-page {
	box-sizing: border-box;
	inline-size: 100%;
	max-inline-size: calc(var(--aura-shop-container) + 2 * var(--aura-shop-page-gutter));
	margin-inline: auto;
	padding-inline: var(--aura-shop-page-gutter);
}

/* Explicit width can escape a theme's narrow content column, but never the viewport. */
.aura-shop-page--custom-width {
	inline-size: min(calc(var(--aura-shop-container) + 2 * var(--aura-shop-page-gutter)), calc(100vw - 2 * var(--aura-shop-page-gutter)));
	max-inline-size: none;
	position: relative;
	inset-inline-start: 50%;
	transform: translateX(-50%);
	margin-inline: 0;
}

html[dir="rtl"] .aura-shop-page--custom-width {
	transform: translateX(50%);
}

/* ------------------------------------------------------------- Utilities */

.aura-shop-sr {
	position: absolute !important; /* Screen-reader text must never become visible through theme rules. */
	inline-size: 1px;
	block-size: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.aura-shop-anchor {
	display: block;
	scroll-margin-block-start: 6rem;
}

.aura-shop-icon {
	inline-size: 1.25em;
	block-size: 1.25em;
	flex: none;
}

html[dir="rtl"] .aura-shop-icon--directional {
	transform: scaleX(-1);
}

.aura-shop-clamp {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var(--aura-shop-card-lines);
	line-clamp: var(--aura-shop-card-lines);
	overflow: hidden;
}

.aura-shop-placeholder {
	padding: var(--aura-shop-space-md);
	border: 1px dashed var(--aura-shop-border);
	border-radius: var(--aura-shop-button-radius);
	color: var(--aura-shop-muted);
	font-size: 0.875rem;
}

@media (prefers-reduced-motion: reduce) {
	.aura-shop *,
	.aura-shop-drawer *,
	.aura-shop-dock * {
		transition-duration: 0.01ms !important; /* Documented exception: honouring a user setting over component transitions. */
		animation-duration: 0.01ms !important;
	}
}