/**
 * Basic design — shared design tokens.
 *
 * The design foundation for the "Basic" Store Design: the reusable palette,
 * shape, elevation and typography values consumed by admin.css and
 * frontend.css. These are plain CSS custom properties, namespaced with
 * `--olena-food-design-*` so they can never collide with the plugin's own
 * `--olena-food-ordering-*` / `--ofo-*` variables or with the host theme.
 *
 * Loaded in BOTH admin and storefront contexts (shared foundation), before the
 * context-specific override sheet. Defining them on :root is safe: nothing
 * outside the Olena override sheets consumes `--olena-food-design-*`, so this
 * adds no visual change on its own — admin.css / frontend.css map these tokens
 * onto the plugin's existing variables, scoped to the Olena wrappers.
 *
 * This file is the single source of truth for the Basic look. A future design
 * can be produced by copying this folder and editing the values below.
 *
 * This file must be plain CSS (no SCSS/preprocessing).
 */

:root {

	/* ====================================================================
	   Palette
	   ==================================================================== */

	/* Primary (Coral Red) + hover + text-on-primary. Drives every primary
	   action: Add to Cart, Place Order, the floating cart button, selected
	   states, category chips, focus rings, etc. */
	--olena-food-design-primary: #FF4E45;
	--olena-food-design-primary-hover: #E8453D;
	--olena-food-design-on-primary: #FFFFFF;

	/* Soft translucent primary tints, for hover fills / selected backgrounds /
	   focus rings. The plugin renders these through its "accent-1-50" variable. */
	--olena-food-design-primary-soft: rgba(255, 78, 69, 0.10);
	--olena-food-design-primary-softer: rgba(255, 78, 69, 0.06);

	/* Text */
	--olena-food-design-text: #1B2432;
	--olena-food-design-text-secondary: #6F7782;

	/* Surfaces */
	--olena-food-design-surface: #FFFFFF;
	--olena-food-design-background: #F6F2EB;
	/* Warm neutral fill used for secondary chips / muted panels, derived from
	   the warm page background. */
	--olena-food-design-muted: #F1ECE3;
	--olena-food-design-border: #E3E0DA;
	--olena-food-design-border-strong: #D8D3CA;

	/* Prices are shown in green in the references (distinct from the coral
	   actions). Reuses the success hue as the dedicated "money" colour. */
	--olena-food-design-price: #1B2432;

	/* Statuses */
	--olena-food-design-success: #2F8F57;
	--olena-food-design-success-soft: #E7F4EC;
	--olena-food-design-warning: #D98A1A;
	--olena-food-design-error: #D93A32;
	--olena-food-design-error-soft: #FCEAE9;

	/* ====================================================================
	   Shape (border radii)
	   ==================================================================== */
	--olena-food-design-radius-sm: 8px;
	--olena-food-design-radius-md: 10px;
	--olena-food-design-radius-lg: 16px;
	--olena-food-design-radius-pill: 999px;

	/* Semantic aliases used by the override sheets. */
	--olena-food-design-card-radius: 16px;
	--olena-food-design-control-radius: 10px;
	--olena-food-design-chip-radius: 6px;

	/* ====================================================================
	   Elevation (shadows)
	   ==================================================================== */
	--olena-food-design-shadow-card: 0 1px 2px rgba(27, 36, 50, 0.04),
		0 6px 18px rgba(27, 36, 50, 0.06);
	--olena-food-design-shadow-card-hover: 0 4px 10px rgba(27, 36, 50, 0.08),
		0 16px 34px rgba(27, 36, 50, 0.12);
	--olena-food-design-shadow-button: 0 6px 16px rgba(255, 78, 69, 0.28);
	--olena-food-design-shadow-float: 0 8px 22px rgba(255, 78, 69, 0.35);

	/* Focus ring (coral halo around focused controls). */
	--olena-food-design-focus-ring: 0 0 0 3px var(--olena-food-design-primary-soft);

	/* ====================================================================
	   Controls
	   ==================================================================== */
	--olena-food-design-control-height: 44px;
	--olena-food-design-transition: all 0.2s ease;
}