/**
 * 00-tokens.css — River Island Conservancy design tokens (Part 2 renovation, Global section).
 * Names are fixed by the Part 2 plan; values are set here. Colours map to the Elementor kit (395) globals, so a
 * kit colour change flows through; the literal after the comma is the fallback where the kit is absent (login page).
 * Declared on :root (fallback values) and again on body, where Elementor defines the --e-global-* variables
 * (body.elementor-kit-395), so the mapping resolves there.
 * Breakpoints are Elementor's: mobile ≤ 767px, tablet ≤ 1024px (media queries cannot use custom properties).
 */
:root,
body {
	/* Colour */
	--ric-color-primary: var(--e-global-color-primary, #2C5F2D);
	--ric-color-secondary: var(--e-global-color-secondary, #1B3B1A);
	--ric-color-text: var(--e-global-color-text, #1A1A1A);
	--ric-color-accent: var(--e-global-color-accent, #FFB400);
	--ric-color-bg: var(--e-global-color-background, #FFFFFF);
	--ric-color-bg-accent: var(--e-global-color-backgroundAccent, #F0F4F0);
	--ric-color-muted: #5B6670;  /* 5.9:1 on white, 5.3:1 on bg-accent: secondary text */
	--ric-color-border: #69727D; /* 4.8:1 on white: form fields and controls (WCAG 1.4.11 needs 3:1) */
	--ric-color-link: var(--ric-color-primary);       /* 7.5:1 on white */
	--ric-color-link-hover: var(--ric-color-secondary);
	--ric-color-focus: var(--ric-color-secondary);    /* 12.5:1 on white; paired with a white halo on dark bands */
	--ric-color-on-primary: #FFFFFF;                  /* text on primary/secondary fills */

	/* Type */
	--ric-font-heading: "Poppins", "Helvetica Neue", Arial, sans-serif;
	--ric-font-body: "Figtree", "Helvetica Neue", Arial, sans-serif;
	--ric-text-xs: 0.75rem;
	--ric-text-sm: 0.875rem;
	--ric-text-base: 1rem; /* 16px: never smaller for body text or inputs on mobile */
	--ric-text-lg: 1.125rem;
	--ric-text-xl: clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem);
	--ric-text-2xl: clamp(1.5rem, 1.25rem + 1.25vw, 2rem);
	--ric-text-3xl: clamp(2rem, 1.6rem + 2vw, 2.5rem);
	--ric-leading-tight: 1.2;
	--ric-leading-normal: 1.5;

	/* Space */
	--ric-space-1: 4px;
	--ric-space-2: 8px;
	--ric-space-3: 12px;
	--ric-space-4: 16px;
	--ric-space-5: 24px;
	--ric-space-6: 32px;
	--ric-space-7: 48px;
	--ric-space-8: 64px;
	--ric-gutter: 16px;          /* page side padding on phones (≤ 767px) */
	--ric-content-max: 1280px;   /* the kit's boxed container width */

	/* Shape and interaction */
	--ric-radius-sm: 3px;
	--ric-radius-md: 6px;
	--ric-radius-lg: 12px;
	--ric-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.08);
	--ric-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.12);
	--ric-tap-min: 44px;
	--ric-focus-ring: 2px solid var(--ric-color-focus);
}
