/* Dark theme is primary (:root). Light theme = featured-products section only. */
:root{
--ground:#0A0B0A;
--surface:#141614;
--surface-field:#111311;
--surface-inverse:#EEF0EA;
--hairline:#1C1F1B;
--border:#2A2E28;
--border-strong:#3A4037;
--ink:#F2F4F0;
--ink-soft:#C9CEC6;
--ink-muted:#A3A9A0;
--ink-faint:#7E857B;
--brand:#74C425;
--brand-hover:#8AD83A;
--brand-bright:#9BE04F;
--brand-deep:#3D7A0E;
--brand-text:#74C425;
--on-brand:#0A0B0A;
--on-brand-soft:#1E2A12;
--on-inverse:#0A0B0A;
/* semantic aliases */
--bg-page:var(--ground);
--surface-card:var(--surface);
--surface-input:var(--surface-field);
--surface-row-hover:var(--surface-field);
--line-section:var(--hairline);
--line-field:var(--border);
--line-outline-btn:var(--border-strong);
--text-body:var(--ink);
--text-lead:var(--ink-soft);
--text-secondary:var(--ink-muted);
--text-quiet:var(--ink-faint);
--text-price:var(--brand-text);
--text-eyebrow:var(--brand-text);
--text-link:var(--brand-text);
--text-link-hover:var(--brand-bright);
--focus-ring:var(--brand);
--status-in-stock:var(--brand);
}
/* Light hairline, border, border-strong, ink-soft are derived values — accepted; light theme is used on one section only. */
[data-theme="light"]{
--ground:#EEF0EA;
--surface:#FFFFFF;
--surface-field:#FFFFFF;
--surface-inverse:#0A0B0A;
--hairline:#D5D9CE;
--border:#C3C8BB;
--border-strong:#9AA092;
--ink:#0A0B0A;
--ink-soft:#2E332C;
--ink-muted:#4F554C;
--ink-faint:#5F665B;
--brand-text:#3D7A0E;
--on-inverse:#EEF0EA;
--text-link-hover:var(--brand-deep);
}