/*
 * Fivany design tokens — ported from the Opnar storefront design system
 * (apps/storefront/app/design-tokens.css + components/home/home.css).
 *
 * Scoped to :root because this is a dedicated storefront; Opnar scopes to
 * .opnar-storefront only because its admin shares the same bundle.
 */

:root {
	/* ── Brand accent ──────────────────────────────────────────── */
	--fv-accent: #ff6b00;
	--fv-accent-hover: #e85f00;
	--fv-accent-soft: #fff5ed;
	--fv-accent-tint: oklch(0.96 0.025 50);

	/* ── Cream surface family ──────────────────────────────────────
	 * Cream outer holding white inner slots. Used by header, footer,
	 * product cards — the signature Opnar surface pattern. */
	--fv-cream: #fdf6ee;
	--fv-cream-hover: #fff8f1;
	--fv-surface: #fff;

	/* ── Neutral ink + lines (OKLCH, cool hue 240) ─────────────── */
	--fv-ink: oklch(0.18 0.01 240);
	--fv-ink-2: oklch(0.38 0.01 240);
	--fv-ink-3: oklch(0.58 0.01 240);
	--fv-ink-soft: oklch(0.78 0.008 240);
	--fv-line: oklch(0.9 0.006 240);
	--fv-line-2: oklch(0.82 0.008 240);
	--fv-bg: oklch(0.99 0.003 240);
	--fv-muted: oklch(0.975 0.004 240);

	/* ── Semantic ──────────────────────────────────────────────── */
	--fv-hot: #e6182a;          /* sale prices, urgency */
	--fv-hot-ink: #c41020;
	--fv-good: #0f9d58;
	--fv-warn: #f5a623;
	--fv-gold: #b8860b;

	/* ── Dark bar (footer bottom) ──────────────────────────────── */
	--fv-dark: oklch(0.22 0.012 240);
	--fv-dark-2: oklch(0.28 0.012 240);
	--fv-dark-ink: oklch(0.96 0.004 240);
	--fv-dark-ink-2: oklch(0.75 0.005 240);

	/* ── Radius scale — deliberately near-squared ──────────────── */
	--fv-radius-sm: 0.0625rem;   /* 1px  micro tags        */
	--fv-radius-md: 0.125rem;    /* 2px  buttons, inputs   */
	--fv-radius-lg: 0.1875rem;   /* 3px  cards, badges     */
	--fv-radius-xl: 0.25rem;     /* 4px  hero, modals      */
	--fv-radius-2xl: 0.375rem;   /* 6px  large containers  */
	--fv-radius-full: 9999px;

	/* ── Shadows ───────────────────────────────────────────────── */
	--fv-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04);
	--fv-shadow-md: 0 4px 12px -2px rgba(15, 23, 42, 0.08), 0 2px 4px rgba(15, 23, 42, 0.04);
	--fv-shadow-lg: 0 10px 28px -8px rgba(15, 23, 42, 0.18), 0 4px 8px rgba(15, 23, 42, 0.06);

	/* ── Typography ────────────────────────────────────────────────
	 * Mono carries every numeral — prices, badges, ribbons, counts.
	 * Hind Siliguri covers Bangla glyphs via per-glyph fallback. */
	--fv-font: 'Inter', 'Hind Siliguri', ui-sans-serif, system-ui, -apple-system, sans-serif;
	--fv-mono: 'JetBrains Mono', ui-monospace, Menlo, Monaco, Consolas, monospace;
	--fv-fs-base: 13px;

	/* ── Layout ────────────────────────────────────────────────── */
	--fv-maxw: 1440px;
	--fv-pad-x: 24px;
	--fv-pad-x-mobile: 16px;
}