/* Explain: Theme tokens defining the e-commerce site's color and font identity. */
:root {
    --primary-color: #169c7c;
    --primary-hover: #0f7d64;
    --secondary-color: #e3f2ee;
    --accent-color: #dfff54;
    --background-color: #f7f7f8;
    --surface-color: #ffffff;
    --footer-bg: #14181b;
    --text-color: #171720;
    --text-muted: #777681;
    --border-color: #e8e8ed;
    --logo-subtitle-color: #169c7c;
    --button-color: #171720;
    --purple-soft: #e3f2ee;
    --icon-bg: #f4f4f6;
    --field-bg: #f7f7f8;
    --glass-bg: rgba(255, 255, 255, 0.85);
    --glass-border: #e8e8ed;
    --sage-soft: #e3f2ee;
    --sage-dark: #0f7d64;
    --shadow-soft: 0 18px 50px rgba(20, 60, 48, 0.07);
    --shadow-button: 0 16px 36px rgba(22, 156, 124, 0.28);
    --font-heading: 'Cairo', sans-serif;
    --font-body: 'Cairo', sans-serif;
    --font-display: 'Space Grotesk', 'Cairo', sans-serif;
    --font-logo: 'Cairo', sans-serif;
}