/*
 * Livhy design tokens. Every colour, size, radius, shadow and duration used by the theme lives here.
 * Breakpoints (mobile-first min-width; CSS variables cannot be used in media queries):
 *   480px small mobile → mobile, 768px tablet, 1024px desktop, 1280px large, 1440px wide.
 */

@font-face {
	font-family: "Poppins";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/poppins-400-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Poppins";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/poppins-400-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Poppins";
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("../fonts/poppins-500-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Poppins";
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url("../fonts/poppins-500-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Poppins";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/poppins-600-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Poppins";
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url("../fonts/poppins-600-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: "Poppins";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/poppins-700-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Poppins";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url("../fonts/poppins-700-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Arial tuned to Poppins metrics so text does not jump when the web font arrives. */
@font-face {
	font-family: "Poppins Fallback";
	src: local("Arial");
	size-adjust: 112%;
	ascent-override: 93.75%;
	descent-override: 31.25%;
	line-gap-override: 8.9%;
}

:root {
	/* Colour */
	--livhy-primary: #8b1018;
	--livhy-primary-dark: #681217;
	--livhy-primary-tint: #fbf1ef;
	--livhy-cream: #f7ece8;
	--livhy-background: #fffbf9;
	--livhy-surface: #ffffff;
	--livhy-text: #171717;
	--livhy-muted: #687280;
	/* #687280 reaches only 4.2:1 on cream; cream surfaces swap in this shade (5.1:1). */
	--livhy-muted-on-cream: #5b6573;
	--livhy-border: #e5e7eb;
	--livhy-success: #16a34a;
	--livhy-sale: #ef4444;
	--livhy-warning: #f59e0b;
	--livhy-charcoal: #1f1f1f;
	/* AA-contrast variants for small white text on status colours. */
	--livhy-success-strong: #15803d;
	--livhy-sale-strong: #dc2626;
	--livhy-overlay: rgb(23 23 23 / 0.5);
	--livhy-focus: var(--livhy-primary);

	/* Typography */
	--livhy-font: "Poppins", "Poppins Fallback", Inter, Arial, sans-serif;
	--livhy-fs-h1: clamp(2rem, 1.36rem + 2.13vw, 3rem);
	--livhy-fs-h2: clamp(1.5rem, 1.18rem + 1.07vw, 2rem);
	--livhy-fs-h3: clamp(1.25rem, 1.09rem + 0.53vw, 1.5rem);
	--livhy-fs-h4: 1.125rem;
	--livhy-fs-body: 1rem;
	--livhy-fs-small: 0.875rem;
	--livhy-fs-caption: 0.75rem;
	--livhy-fw-regular: 400;
	--livhy-fw-medium: 500;
	--livhy-fw-semibold: 600;
	--livhy-fw-bold: 700;
	--livhy-lh-tight: 1.1;
	--livhy-lh-snug: 1.3;
	--livhy-lh-body: 1.6;
	--livhy-tracking-eyebrow: 0.14em;

	/* Space (4px base) */
	--livhy-space-1: 0.25rem;
	--livhy-space-2: 0.5rem;
	--livhy-space-3: 0.75rem;
	--livhy-space-4: 1rem;
	--livhy-space-5: 1.25rem;
	--livhy-space-6: 1.5rem;
	--livhy-space-8: 2rem;
	--livhy-space-10: 2.5rem;
	--livhy-space-12: 3rem;
	--livhy-space-16: 4rem;
	--livhy-section-space: clamp(2rem, 1.2rem + 2.67vw, 4rem);
	--livhy-gutter: clamp(1rem, 0.6rem + 1.33vw, 2rem);
	--livhy-container: 80rem;
	--livhy-container-wide: 90rem;

	/* Shape */
	--livhy-radius-sm: 6px;
	--livhy-radius-md: 8px;
	--livhy-radius-lg: 12px;
	--livhy-radius-xl: 16px;
	--livhy-radius-pill: 999px;
	--livhy-shadow-sm: 0 1px 2px rgb(23 23 23 / 0.06);
	--livhy-shadow-md: 0 6px 20px rgb(23 23 23 / 0.08);
	--livhy-shadow-lg: 0 18px 48px rgb(23 23 23 / 0.18);

	/* Chrome */
	--livhy-announcement-h: 2.25rem;
	--livhy-header-h: 3.5rem;
	--livhy-bottom-nav-h: 4rem;
	--livhy-safe-bottom: env(safe-area-inset-bottom, 0px);
	--livhy-tap: 2.75rem;

	/* Product cards */
	--livhy-card-ratio: 1 / 1;
	--livhy-grid-gap: clamp(0.75rem, 0.45rem + 1vw, 1.5rem);

	/* Layers: stays below the OTP login popup (z-index 9999). */
	--livhy-z-header: 100;
	--livhy-z-bottom-nav: 110;
	--livhy-z-dropdown: 200;
	--livhy-z-toast: 1100;

	/* Motion */
	--livhy-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
	--livhy-dur-fast: 150ms;
	--livhy-dur: 250ms;
}

@media (min-width: 1024px) {
	:root {
		--livhy-header-h: 4.5rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--livhy-dur-fast: 0ms;
		--livhy-dur: 0ms;
	}
}

/* Cream surfaces: muted text uses the darker shade so small text keeps AA contrast. */
.lv-service,
.lv-shop-banner,
.lv-hero,
.lv-promo--cream,
.lv-drawer__promo {
	--livhy-muted: var(--livhy-muted-on-cream);
}