/**
 * VirtualSleepCare Design System canonical design tokens.
 *
 * Component CSS should prefer semantic tokens. Compatibility aliases retain
 * released component behaviour during the Version 1.0 execution phase.
 */

:root {
	/* Primitive colour scale. */
	--vsc-color-purple-050: #f7f3fb;
	--vsc-color-purple-200: #d9cbe8;
	--vsc-color-purple-500: #9e85be;
	--vsc-color-purple-700: #5f3b8c;
	--vsc-color-gold-500: #fdb923;
	--vsc-color-red-600: #df050a;
	--vsc-color-neutral-0: #fdfdfd;
	--vsc-color-neutral-100: #f8f7fb;
	--vsc-color-neutral-500: #5f5967;
	--vsc-color-neutral-900: #333333;

	/* Semantic colour roles. */
	--vsc-color-text-primary: var(--vsc-color-neutral-900);
	--vsc-color-text-secondary: var(--vsc-color-neutral-500);
	--vsc-color-text-inverse: var(--vsc-color-neutral-0);
	--vsc-color-heading: #21152f;
	--vsc-color-link: var(--vsc-color-purple-700);
	--vsc-color-surface-base: var(--vsc-color-neutral-0);
	--vsc-color-surface-subtle: var(--vsc-color-neutral-100);
	--vsc-color-surface-media-overlay: rgba(33, 21, 47, 0.76);
	--vsc-color-border-subtle: #ddd5e4;
	--vsc-color-action-primary: var(--vsc-color-purple-700);
	--vsc-color-action-accent: var(--vsc-color-gold-500);
	--vsc-color-action-on-accent: #21152f;
	--vsc-color-feedback-info: #2f6f9f;
	--vsc-color-feedback-success: #237a45;
	--vsc-color-feedback-warning: #9a6700;
	--vsc-color-feedback-danger: #b42318;

	/* Layout and type scale. */
	--vsc-space-0: 0;
	--vsc-space-xs: 0.5rem;
	--vsc-space-sm: 0.75rem;
	--vsc-space-md: 1rem;
	--vsc-space-lg: 1.5rem;
	--vsc-space-xl: 2rem;
	--vsc-space-2xl: 3rem;
	--vsc-radius-sm: 0.5rem;
	--vsc-radius-md: 0.75rem;
	--vsc-radius-lg: 1rem;
	--vsc-radius-pill: 999px;
	--vsc-font-size-body: 1rem;
	--vsc-font-size-body-lg: 1.125rem;
	--vsc-font-family-heading: Inter, sans-serif;
	--vsc-font-size-page-title: 2.5rem;
	--vsc-font-size-product-title: 2rem;
	--vsc-font-size-h4: 1.25rem;
	--vsc-font-size-h2: clamp(1.75rem, 3vw, 2.5rem);
	--vsc-line-height-body: 1.7;
	--vsc-line-height-heading: 1.15;
	--vsc-width-reading: 50rem;
	--vsc-width-content: 72rem;
	--vsc-width-wide: 90rem;
	--vsc-space-section-spacious: 4rem;
	--vsc-shadow-sm: 0 0.25rem 0.75rem rgba(0, 0, 0, 0.12);
	--vsc-shadow-md: 0 0.5rem 1.25rem rgba(0, 0, 0, 0.16);
	--vsc-motion-fast: 160ms;
	--vsc-motion-normal: 240ms;
	--vsc-focus-ring: 0.1875rem solid var(--vsc-color-neutral-0);

	/* Governed action-system roles. */
	--vsc-action-target-min: 2.75rem;
	--vsc-action-padding-block: var(--vsc-space-sm);
	--vsc-action-padding-inline: var(--vsc-space-lg);
	--vsc-action-compact-padding-block: var(--vsc-space-xs);
	--vsc-action-compact-padding-inline: var(--vsc-space-md);
	--vsc-action-border-width: 0.125rem;
	--vsc-action-primary-background: var(--vsc-color-action-primary);
	--vsc-action-primary-text: var(--vsc-color-text-inverse);
	--vsc-action-secondary-background: var(--vsc-color-action-accent);
	--vsc-action-secondary-text: var(--vsc-color-action-on-accent);
	--vsc-action-outline-border: var(--vsc-color-action-primary);
	--vsc-action-outline-text: var(--vsc-color-action-primary);
	--vsc-action-link-text: var(--vsc-color-link);
	--vsc-action-inverse-background: var(--vsc-color-action-accent);
	--vsc-action-inverse-text: var(--vsc-color-action-on-accent);
	--vsc-action-disabled-opacity: 0.55;


	/* Governed Content Card roles. */
	--vsc-card-background: var(--vsc-color-surface-base);
	--vsc-card-border-color: var(--vsc-color-border-subtle);
	--vsc-card-text: var(--vsc-color-text-primary);
	--vsc-card-title: var(--vsc-color-heading);
	--vsc-card-accent: var(--vsc-color-purple-700);
	--vsc-card-padding: var(--vsc-space-lg);
	--vsc-card-gap: var(--vsc-space-md);
	--vsc-card-radius: var(--vsc-radius-lg);
	--vsc-card-shadow: var(--vsc-shadow-sm);
	--vsc-card-media-radius: var(--vsc-radius-md);
	--vsc-card-service-background: var(--vsc-color-surface-base);
	--vsc-card-resource-background: var(--vsc-color-purple-050);
	--vsc-card-trust-background: linear-gradient(
		135deg,
		var(--vsc-color-neutral-0),
		var(--vsc-color-purple-050)
	);
	--vsc-card-icon-feature-background: var(--vsc-color-surface-subtle);
	--vsc-card-statistic-background: var(--vsc-color-purple-700);
	--vsc-card-statistic-text: var(--vsc-color-text-inverse);
	--vsc-card-informational-background: var(--vsc-color-purple-050);

	/* Compatibility aliases for released components. */
	--vsc-brand: var(--vsc-color-action-primary);
	--vsc-accent: var(--vsc-color-action-accent);
	--vsc-text: var(--vsc-color-text-primary);
	--vsc-heading: var(--vsc-color-heading);
	--vsc-text-secondary: var(--vsc-color-text-secondary);
	--vsc-link: var(--vsc-color-link);
	--vsc-surface-subtle: var(--vsc-color-surface-subtle);
	--vsc-border-subtle: var(--vsc-color-border-subtle);
	--vsc-button-text: var(--vsc-color-action-on-accent);
	--vsc-purple-050: var(--vsc-color-purple-050);
	--vsc-purple-200: var(--vsc-color-purple-200);
	--vsc-purple-700: var(--vsc-color-purple-700);
}