/**
 * Rajgir Parent Theme
 *
 * Design System — Color Tokens
 *
 * File:
 * assets/css/tokens/colors.css
 *
 * Responsibility:
 * Centralized semantic color tokens only.
 *
 * Architecture:
 *
 * COLOR ROLE
 *     ↓
 * COLOR TOKEN
 *     ↓
 * COMPONENT
 *     ↓
 * PATTERN
 *     ↓
 * PAGE
 *
 * This file does NOT contain:
 * - component styling
 * - page styling
 * - business logic
 * - state logic
 * - responsive rules
 * - arbitrary component colors
 *
 * @package Rajgir
 */


/* ==========================================================================
   RAJGIR COLOR TOKEN CONTRACT
   ========================================================================== */

:root {

	/* ----------------------------------------------------------------------
	   BRAND
	   ---------------------------------------------------------------------- */

	--rajgir-color-brand-primary:
		var(--wp--preset--color--primary, currentColor);

	--rajgir-color-brand-secondary:
		var(--wp--preset--color--secondary, currentColor);

	--rajgir-color-brand-accent:
		var(--wp--preset--color--accent, currentColor);


	/* ----------------------------------------------------------------------
	   SURFACE
	   ---------------------------------------------------------------------- */

	--rajgir-color-background:
		var(--wp--preset--color--background, Canvas);

	--rajgir-color-surface:
		var(--wp--preset--color--surface, Canvas);

	--rajgir-color-surface-raised:
		var(--wp--preset--color--surface-raised, Canvas);

	--rajgir-color-surface-muted:
		var(--wp--preset--color--surface-muted, Canvas);


	/* ----------------------------------------------------------------------
	   TEXT
	   ---------------------------------------------------------------------- */

	--rajgir-color-text:
		var(--wp--preset--color--text, CanvasText);

	--rajgir-color-text-muted:
		var(--wp--preset--color--text-muted, GrayText);

	--rajgir-color-text-inverse:
		var(--wp--preset--color--text-inverse, Canvas);


	/* ----------------------------------------------------------------------
	   BORDER
	   ---------------------------------------------------------------------- */

	--rajgir-color-border:
		var(--wp--preset--color--border, GrayText);

	--rajgir-color-border-muted:
		var(--wp--preset--color--border-muted, GrayText);

	--rajgir-color-border-strong:
		var(--wp--preset--color--border-strong, GrayText);


	/* ----------------------------------------------------------------------
	   INTERACTIVE
	   ---------------------------------------------------------------------- */

	--rajgir-color-interactive:
		var(
			--wp--preset--color--interactive,
			var(--rajgir-color-brand-primary)
		);

	--rajgir-color-interactive-hover:
		var(
			--wp--preset--color--interactive-hover,
			var(--rajgir-color-interactive)
		);

	--rajgir-color-interactive-active:
		var(
			--wp--preset--color--interactive-active,
			var(--rajgir-color-interactive)
		);

	--rajgir-color-interactive-focus:
		var(
			--wp--preset--color--interactive-focus,
			var(--rajgir-color-interactive)
		);


	/* ----------------------------------------------------------------------
	   SEMANTIC — SUCCESS
	   ---------------------------------------------------------------------- */

	--rajgir-color-success:
		var(--wp--preset--color--success, currentColor);

	--rajgir-color-success-surface:
		var(--wp--preset--color--success-surface, Canvas);

	--rajgir-color-success-text:
		var(--wp--preset--color--success-text, CanvasText);


	/* ----------------------------------------------------------------------
	   SEMANTIC — WARNING
	   ---------------------------------------------------------------------- */

	--rajgir-color-warning:
		var(--wp--preset--color--warning, currentColor);

	--rajgir-color-warning-surface:
		var(--wp--preset--color--warning-surface, Canvas);

	--rajgir-color-warning-text:
		var(--wp--preset--color--warning-text, CanvasText);


	/* ----------------------------------------------------------------------
	   SEMANTIC — ERROR / DANGER
	   ---------------------------------------------------------------------- */

	--rajgir-color-error:
		var(--wp--preset--color--error, currentColor);

	--rajgir-color-error-surface:
		var(--wp--preset--color--error-surface, Canvas);

	--rajgir-color-error-text:
		var(--wp--preset--color--error-text, CanvasText);


	--rajgir-color-danger:
		var(
			--wp--preset--color--danger,
			var(--rajgir-color-error)
		);


	/* ----------------------------------------------------------------------
	   SEMANTIC — INFORMATION
	   ---------------------------------------------------------------------- */

	--rajgir-color-info:
		var(--wp--preset--color--info, currentColor);

	--rajgir-color-info-surface:
		var(--wp--preset--color--info-surface, Canvas);

	--rajgir-color-info-text:
		var(--wp--preset--color--info-text, CanvasText);


	/* ----------------------------------------------------------------------
	   DISABLED
	   ---------------------------------------------------------------------- */

	--rajgir-color-disabled:
		var(--wp--preset--color--disabled, GrayText);

	--rajgir-color-disabled-surface:
		var(--wp--preset--color--disabled-surface, Canvas);

	--rajgir-color-disabled-border:
		var(--wp--preset--color--disabled-border, GrayText);

}


/* ==========================================================================
   TOKEN ALIASES
   ========================================================================== */

:root {

	/*
	 * Backward-compatible semantic aliases.
	 *
	 * These aliases allow components to use the canonical short semantic
	 * roles without creating their own color values.
	 */

	--rajgir-color-primary:
		var(--rajgir-color-brand-primary);

	--rajgir-color-secondary:
		var(--rajgir-color-brand-secondary);

	--rajgir-color-accent:
		var(--rajgir-color-brand-accent);

	--rajgir-color-muted:
		var(--rajgir-color-text-muted);

	--rajgir-color-border-default:
		var(--rajgir-color-border);

}


/* ==========================================================================
   COLOR SCHEME SAFETY
   ========================================================================== */

:root {

	color-scheme:
		light dark;

}


/* ==========================================================================
   TOKEN USAGE RULE
   ========================================================================== */

/*
 * Do not add component-specific HEX/RGB/HSL values here.
 *
 * Correct:
 *
 * color:
 *     var(--rajgir-color-text);
 *
 * background-color:
 *     var(--rajgir-color-surface);
 *
 * border-color:
 *     var(--rajgir-color-border);
 *
 * Incorrect:
 *
 * color:
 *     #000000;
 *
 * background-color:
 *     #ffffff;
 *
 * Component-specific visual values belong to the approved Design System
 * token layer and must not be invented locally.
 */