@font-face{font-family:"AvenirNext LT Pro";src:url("../font/AvenirNext-Regular.otf") format("opentype");font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:"AvenirNext LT Pro Bold";src:url("../font/AvenirNext-Bold.otf") format("opentype");font-style:normal;font-weight:600;font-display:swap}

:root {
	/* Brand, neutral, and semantic colours */
	--color-brand-primary: #A28269;
	--color-brand-accent: #D8B99F;
	--color-brand-accent-secondary: #EE4893;
	--color-text-primary: #1C1C1C;
	--color-text-header: var(--color-text-primary);
	--color-text-footer: #000;
	--color-text-muted: #555555;
	--color-text-muted-dark: #231A17;
	--color-text-inverse: #FFFFFF;
	--color-text-inverse-soft: #FFF4EA;
	--color-text-strikethrough: #8C8C9A;
	--color-white: #FFFFFF;
	--color-black: #000914;
	--color-surface-page: #FFFFFF;
	--color-surface-topbar: #593328;
	--color-surface-footer: #F5F5F4;
	--color-surface-subtle: #F1F1F1;
	--color-surface-feature: #FCE9EB;
	--color-surface-tag: rgba(127, 37, 75, 0.85);
	--color-overlay-default: rgba(0, 0, 0, 0.35);
	--color-border-default: #1D1D1D1A;
	--color-border-strong: #9B9B9B;
	--color-border-subtle: #CFCFCF;
	--color-border-muted: #C0C0C0;
	--color-price-offer: var(--color-brand-primary);
	--color-price-special: #AB004D;
	--color-status-available: #51A245;
	--color-status-sold-out: #B7B8B7;
	--color-status-error: #F70046;
	--color-status-error-muted: #DC2E2E;
	--color-status-error-bright: #EE4B2B;
	--color-accent-purple: #C8A2C8;
	--color-highlight-yellow: #FFFF00;

	/* Font families and typography */
	--font-family-body: "Jost", sans-serif;
	--font-family-heading: "Jost", sans-serif;
	--font-family-display: "Tenor Sans", sans-serif;
	--font-family-avenir: "AvenirNext LT Pro", sans-serif;
	--font-family-avenir-bold: "AvenirNext LT Pro Bold", sans-serif;
	--font-weight-body: 400;
	--font-weight-heading: 500;
	--font-weight-description: 400;
	--font-weight-button: 500;
	--font-weight-header: 400;
	--font-size-body: 14.5px;
	--line-height-body: 1.6;
	--letter-spacing-body: normal;
	--letter-spacing-label: 0.06em;
	--letter-spacing-heading: 0.09em;
	--letter-spacing-navigation: 0.09em;
	--letter-spacing-button: var(--letter-spacing-heading);

	/* Component tokens */
	--button-primary-background: var(--color-brand-primary);
	--button-primary-text: var(--color-text-inverse);
	--button-primary-hover-background: #D4C3A9;
	--button-primary-hover-text: var(--color-text-inverse);
	--button-primary-radius: 0px;
	--product-image-radius: 0px;
	--product-thumbnail-radius: 0px;
	--product-grid-gap: 18px;
	--product-grid-gap-mobile: 10px;
	--grid-column-gap-desktop: 18px;
	--menu-surface-background: var(--color-white);
	--menu-text-primary: var(--color-text-primary);
	--menu-text-inverse: var(--color-text-inverse);
	--menu-icon-color: var(--color-black);
	--menu-action-background: var(--color-brand-primary);
	--menu-link-hover: var(--color-brand-primary);
	--menu-border-default: var(--color-text-primary);
	--menu-border-inverse: var(--color-white);

	/* Checkout */
	--checkout-color-text-primary: #000000;
	--checkout-color-black: #000000;
	--checkout-color-white: #FFFFFF;
	--checkout-color-neutral-100: #DFDFDF;
	--checkout-color-neutral-200: #EFEFEF;
	--checkout-color-border: #DEDEDE;
	--checkout-color-text-disabled: #0000008F;
	--checkout-color-skeleton: #E5E5E5;
	--checkout-surface-collapsible: #F4F4F4;
	--checkout-color-text-secondary: #838383;
	--checkout-color-text-tertiary: #595959;
	--checkout-color-status-error: #F42837;
	--checkout-color-status-info: #0000FF;
	--checkout-font-family: "AvenirNext LT Pro", sans-serif;
	--checkout-font-family-bold: "AvenirNext LT Pro Bold", sans-serif;
	--checkout-spacing-5: 5px;
	--checkout-spacing-10: 10px;
	--checkout-spacing-16: 16px;
	--checkout-spacing-20: 20px;
	--checkout-spacing-32: 32px;
	--checkout-control-height: 56px;

	/* WhatsApp widget */
	--whatsapp-color-text-inverse: var(--color-white);
	--whatsapp-color-text-primary: #000000;
	--whatsapp-color-text-muted: #888888;
	--whatsapp-surface-content: #F1F7FB;
	--whatsapp-surface-content-hover: #EDF1F4;

	/* Shared layout and effects */
	--radius-none: 0px;
	--radius-sm: 5px;
	--radius-md: 8px;
	--radius-lg: 15px;
	--radius-input: 6px;
	--spacing-layout-gap: 0px;
	--effect-text-shadow: none;
}
