/*
 * SuperDeli design tokens. The one place colours, type, spacing, radii and
 * shadows are defined; every slice reads them through var(--sd-*).
 *
 * Brand: the coral header (#ff475f) and the logo are the identity and are
 * not changed here. --sd-primary is a deeper step of the same coral so white
 * text on a button passes WCAG AA (4.6:1); the header keeps its own colour.
 */
body.sd-ui {
	/* Colour */
	--sd-brand: #ff475f;
	--sd-primary: #d92d45;
	--sd-primary-hover: #bf2139;
	--sd-primary-soft: #fff0f2;
	--sd-deal: #0f7a47;
	--sd-deal-soft: #e7f6ee;
	--sd-warn-soft: #fff6e0;
	--sd-warn-line: #f2d48a;
	--sd-ink: #1c1917;
	--sd-ink-2: #44403c;
	--sd-muted: #78716c;
	--sd-line: #ebe5dd;
	--sd-bg: #faf6f0;
	--sd-surface: #ffffff;
	--sd-surface-2: #f5f0e9;
	--sd-focus: #2563eb;

	/* Type */
	/* System fonts: no download on a phone, native look. (The Additional CSS
	   @import of Inter never loads: an @import after other rules is ignored.) */
	--sd-font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--sd-text-xs: 0.75rem;
	--sd-text-sm: 0.875rem;
	--sd-text-md: 1rem;
	--sd-text-lg: 1.125rem;
	--sd-text-xl: 1.375rem;
	--sd-text-2xl: 1.75rem;
	--sd-leading: 1.45;
	--sd-leading-tight: 1.2;

	/* Space (4 px grid) */
	--sd-s1: 4px;
	--sd-s2: 8px;
	--sd-s3: 12px;
	--sd-s4: 16px;
	--sd-s5: 20px;
	--sd-s6: 24px;
	--sd-s8: 32px;

	/* Shape */
	--sd-radius-sm: 8px;
	--sd-radius: 12px;
	--sd-radius-lg: 16px;
	--sd-radius-pill: 999px;
	--sd-shadow-1: 0 1px 2px rgba(28, 25, 23, 0.06), 0 1px 3px rgba(28, 25, 23, 0.08);
	--sd-shadow-2: 0 4px 16px rgba(28, 25, 23, 0.10);
	--sd-shadow-up: 0 -4px 16px rgba(28, 25, 23, 0.10);

	/* Controls */
	--sd-tap: 48px;
	--sd-handheld-bar: 56px;
}