/*!
 * DSI 1.0 — Semantic tokens (purpose-driven).
 * Application components MUST consume this layer.
 * Defaults = Flagship Dark. Retailer brand maps into action/premium roles.
 */

:root {
	/* Brand roles (Identity Manager / Brand Adapter overrides these) */
	--dxp-brand-primary: var(--dxp-foundation-color-ember-500);
	--dxp-brand-primary-contrast: var(--dxp-foundation-color-white);
	--dxp-brand-secondary: var(--dxp-foundation-color-neutral-850);
	--dxp-brand-accent: var(--dxp-foundation-color-gold-500);
	--dxp-brand-premium: var(--dxp-foundation-color-gold-400);
	--dxp-brand-display-font: var(--dxp-foundation-font-display);
	--dxp-brand-body-font: var(--dxp-foundation-font-sans);

	/* Canvas / surfaces */
	--dxp-color-background-canvas: var(--dxp-foundation-color-neutral-950);
	--dxp-color-background-subtle: var(--dxp-foundation-color-neutral-900);
	--dxp-color-surface-primary: var(--dxp-foundation-color-neutral-850);
	--dxp-color-surface-secondary: var(--dxp-foundation-color-neutral-800);
	--dxp-color-surface-elevated: var(--dxp-foundation-color-neutral-750);
	--dxp-color-surface-strong: var(--dxp-foundation-color-neutral-700);
	--dxp-color-surface-glass: rgba(17, 24, 39, 0.78);
	--dxp-color-surface-interactive: color-mix(in srgb, var(--dxp-color-surface-elevated) 88%, var(--dxp-brand-primary) 12%);

	/* Borders / dividers */
	--dxp-color-border-default: rgba(255, 255, 255, 0.10);
	--dxp-color-border-strong: rgba(255, 255, 255, 0.18);
	--dxp-color-divider: rgba(255, 255, 255, 0.08);

	/* Text */
	--dxp-color-text-primary: var(--dxp-foundation-color-neutral-100);
	--dxp-color-text-secondary: var(--dxp-foundation-color-neutral-200);
	--dxp-color-text-muted: var(--dxp-foundation-color-neutral-300);
	--dxp-color-text-disabled: color-mix(in srgb, var(--dxp-color-text-muted) 55%, transparent);
	--dxp-color-text-inverse: var(--dxp-foundation-color-neutral-950);

	/* Actions */
	--dxp-color-action-primary: var(--dxp-brand-primary);
	--dxp-color-action-primary-hover: var(--dxp-foundation-color-ember-600);
	--dxp-color-action-primary-text: var(--dxp-brand-primary-contrast);
	--dxp-color-action-secondary: var(--dxp-color-surface-elevated);
	--dxp-color-action-secondary-text: var(--dxp-color-text-primary);
	--dxp-color-action-destructive: var(--dxp-foundation-color-danger);
	--dxp-color-focus-ring: var(--dxp-brand-primary);
	--dxp-color-selection: color-mix(in srgb, var(--dxp-brand-accent) 35%, transparent);

	/* Status */
	--dxp-color-status-success: var(--dxp-foundation-color-success);
	--dxp-color-status-warning: var(--dxp-foundation-color-warning);
	--dxp-color-status-danger: var(--dxp-foundation-color-danger);
	--dxp-color-status-info: var(--dxp-foundation-color-info);

	/* Merchandising */
	--dxp-color-premium: var(--dxp-brand-premium);
	--dxp-color-promotion: var(--dxp-brand-accent);

	/* Spacing aliases */
	--dxp-space-1: var(--dxp-foundation-space-1);
	--dxp-space-2: var(--dxp-foundation-space-2);
	--dxp-space-3: var(--dxp-foundation-space-3);
	--dxp-space-4: var(--dxp-foundation-space-4);
	--dxp-space-5: var(--dxp-foundation-space-5);
	--dxp-space-6: var(--dxp-foundation-space-6);
	--dxp-space-7: var(--dxp-foundation-space-8);
	--dxp-space-8: var(--dxp-foundation-space-10);

	/* Radius aliases */
	--dxp-radius-sm: var(--dxp-foundation-radius-sm);
	--dxp-radius-md: var(--dxp-foundation-radius-md);
	--dxp-radius-lg: var(--dxp-foundation-radius-lg);
	--dxp-radius-pill: var(--dxp-foundation-radius-pill);

	/* Elevation */
	--dxp-elevation-flat: none;
	--dxp-elevation-raised: var(--dxp-foundation-shadow-sm);
	--dxp-elevation-floating: var(--dxp-foundation-shadow-md);
	--dxp-elevation-overlay: var(--dxp-foundation-shadow-lg);
	--dxp-elevation-modal: var(--dxp-foundation-shadow-lg);

	/* Motion */
	--dxp-motion-instant: var(--dxp-foundation-duration-instant);
	--dxp-motion-fast: var(--dxp-foundation-duration-fast) var(--dxp-foundation-ease-interactive);
	--dxp-motion-standard: var(--dxp-foundation-duration-standard) var(--dxp-foundation-ease-interactive);
	--dxp-motion-deliberate: var(--dxp-foundation-duration-deliberate) var(--dxp-foundation-ease-entrance);

	/* Typography */
	--dxp-font-display: var(--dxp-brand-display-font);
	--dxp-font-body: var(--dxp-brand-body-font);
	--dxp-fs-display-hero: clamp(2.25rem, 5vw, 3.5rem);
	--dxp-fs-display-section: clamp(1.75rem, 3vw, 2.5rem);
	--dxp-fs-h1: clamp(1.75rem, 2.6vw, 2.25rem);
	--dxp-fs-h2: clamp(1.35rem, 2vw, 1.75rem);
	--dxp-fs-h3: 1.25rem;
	--dxp-fs-h4: 1.125rem;
	--dxp-fs-body-lg: 1.125rem;
	--dxp-fs-body: 1rem;
	--dxp-fs-body-sm: 0.875rem;
	--dxp-fs-label: 0.8125rem;
	--dxp-fs-caption: 0.75rem;
	--dxp-fs-overline: 0.7rem;
	--dxp-fs-price: clamp(1.35rem, 2vw, 1.75rem);
	--dxp-fs-metric: 1.25rem;

	/* Layout */
	--dxp-container-max: 1340px;
	--dxp-container-wide: 1400px;
	--dxp-content-max-width: var(--dxp-container-max);
	--dxp-gutter: clamp(1rem, 3vw, 1.5rem);

	/* Bridge legacy --dxp-color-* used throughout dxp.css */
	--dxp-color-bg: var(--dxp-color-background-canvas);
	--dxp-color-surface: var(--dxp-color-surface-primary);
	--dxp-color-white: var(--dxp-color-surface-elevated);
	--dxp-color-text: var(--dxp-color-text-primary);
	--dxp-color-primary: var(--dxp-color-action-primary);
	--dxp-color-primary-strong: var(--dxp-color-action-primary-hover);
	--dxp-color-accent: var(--dxp-brand-accent);
	--dxp-color-dark: var(--dxp-color-background-canvas);
	--dxp-color-ink-900: var(--dxp-color-text-primary);
	--dxp-color-ink-700: var(--dxp-color-text-secondary);
	--dxp-color-ink-500: var(--dxp-color-text-muted);
	--dxp-color-ink-300: var(--dxp-color-text-muted);
	--dxp-color-line: var(--dxp-color-border-default);
	--dxp-color-cream-100: var(--dxp-color-surface-secondary);
	--dxp-color-cream-200: var(--dxp-color-surface-elevated);
	--dxp-color-success: var(--dxp-color-status-success);
	--dxp-color-warning: var(--dxp-color-status-warning);
	--dxp-color-error: var(--dxp-color-status-danger);
	--dxp-color-info: var(--dxp-color-status-info);
	--dxp-color-navy-950: var(--dxp-foundation-color-neutral-950);
	--dxp-color-navy-900: var(--dxp-foundation-color-neutral-900);
	--dxp-shadow-sm: var(--dxp-elevation-raised);
	--dxp-shadow-md: var(--dxp-elevation-floating);
	--dxp-shadow-lg: var(--dxp-elevation-overlay);
	--dxp-transition-fast: var(--dxp-motion-fast);
	--dxp-transition-base: var(--dxp-motion-standard);
	--dxp-font-base: var(--dxp-font-body);
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--dxp-motion-fast: var(--dxp-motion-instant);
		--dxp-motion-standard: var(--dxp-motion-instant);
		--dxp-motion-deliberate: var(--dxp-motion-instant);
		--dxp-transition-fast: var(--dxp-motion-instant);
		--dxp-transition-base: var(--dxp-motion-instant);
		--dxp-foundation-duration-fast: 0.01ms;
		--dxp-foundation-duration-standard: 0.01ms;
		--dxp-foundation-duration-deliberate: 0.01ms;
	}
}
