:root {
    /* Spacing variables */
    --density: 1; /* use density to scale/reduce sizes */
    --space-half: calc(4px * var(--density));
    --space: calc(var(--space-half) * 2);
    --space-x1_5: calc(var(--space) * 1.5);
    --space-x2: calc(var(--space) * 2);
    --space-x2_5: calc(var(--space) * 2.5);
    --space-x3: calc(var(--space) * 3);
    --space-x4: calc(var(--space) * 4);
    --space-x5: calc(var(--space) * 5);
    --space-x6: calc(var(--space) * 6);
    --space-x7: calc(var(--space) * 7);
    --space-x8: calc(var(--space) * 8);
    --space-x9: calc(var(--space) * 9);
    --space-x10: calc(var(--space) * 10);
    --space-x11: calc(var(--space) * 11);
    --space-x12: calc(var(--space) * 12);

    /* Typography variables */
    --theme-font-family-body: var(--settings-font-family-body, "Noto Sans", sans-serif);
    --theme-font-family-headline: var(--settings-font-family-headline, 'fatfrank', sans-serif);
    --theme-font-family-title: var(--settings-font-family-title, 'fatfrank', sans-serif);
    --theme-font-family-label: var(--settings-font-family-label, 'fatfrank', sans-serif);
    --theme-font-size-scale: var(--override-type-scale, 1);
    --theme-font-size-base: var(--override-font-size-base, 16px);
    --theme-line-height-base: 1.5;
    --line-height-scale: 0.9;
    --theme-font-size-plus-1: calc(var(--theme-font-size-base) + 2px);
    --theme-font-size-minus-1: calc(var(--theme-font-size-base) - 2px);
    --theme-font-size-minus-2: calc(var(--theme-font-size-minus-1) - 2px);
    --theme-font-size-plus-1-line-height: calc(var(--theme-line-height-base) * var(--line-height-scale));
    --theme-font-size-minus-1-line-height: calc(var(--theme-line-height-base) / var(--line-height-scale));
    --theme-font-size-minus-2-line-height: calc(var(--theme-font-size-minus-1-line-height) / var(--line-height-scale));
    --theme-font-size-minus-2-letter-spacing: var(--override-font-letter-spacing, 0.24px);
    --theme-font-weight-heavy: calc(var(--theme-font-weight-normal) + 200);
    --theme-font-weight-medium: calc(var(--theme-font-weight-normal) + 100);
    --theme-font-weight-normal: var(--override-font-weight-body, 500);
    --theme-font-weight-light: calc(var(--theme-font-weight-normal) - 100);
    --theme-font-weight-headline: var(--override-font-weight-headline, var(--theme-font-weight-heavy));
    --theme-font-weight-title: var(--override-font-weight-title, var(--theme-font-weight-medium));
    --theme-font-weight-label: var(--override-font-weight-label, var(--theme-font-weight-normal));
    --theme-h2-font-size: calc((var(--theme-font-size-base) * var(--theme-font-size-scale)) + 32px);
    --theme-h2-line-height: 1.17;
    --theme-h2-letter-spacing: var(--override-font-letter-spacing, -2.4px);
    --theme-h2-letter-spacing-mobile: var(--override-font-letter-spacing, -0.96px);
    --theme-h3-font-size: calc((var(--theme-font-size-base) * var(--theme-font-size-scale)) + 16px);
    --theme-h3-line-height: 1.25;
    --theme-h3-letter-spacing: var(--override-font-letter-spacing, -0.64px);
    --theme-h4-font-size: calc((var(--theme-font-size-base) * var(--theme-font-size-scale)) + 9px);
    --theme-h4-line-height: 1.28;
    --theme-h5-font-size: calc((var(--theme-font-size-base) * var(--theme-font-size-scale)) + 3px);
    --theme-h5-line-height: 1.37;
    --theme-h6-font-size: var(--theme-font-size-base);
    --theme-h6-line-height: var(--theme-line-height-base);
    --theme-icon-base-size: calc((var(--theme-font-size-base) * var(--theme-font-size-scale)) + 8px);

    /* Market color variables */
    --market-white: #fff;
    --market-black: #000;
    --market-white-alpha-15: rgba(255, 255, 255, 15%);
    --market-white-alpha-30: rgba(255, 255, 255, 30%);
    --market-white-alpha-55: rgba(255, 255, 255, 55%);
    --market-white-alpha-95: rgba(255, 255, 255, 95%);
    --market-black-alpha-03: rgba(0, 0, 0, 3%);
    --market-black-alpha-05: rgba(0, 0, 0, 5%);
    --market-black-alpha-10: rgba(0, 0, 0, 10%);
    --market-black-alpha-15: rgba(0, 0, 0, 15%);
    --market-black-alpha-30: rgba(0, 0, 0, 30%);
    --market-black-alpha-55: rgba(0, 0, 0, 55%);
    --market-black-alpha-80: rgba(0, 0, 0, 80%);
    --market-black-alpha-90: rgba(0, 0, 0, 90%);
    --market-text-10: var(--market-black-alpha-90);
    --market-text-20: var(--market-black-alpha-55);
    --market-text-30: var(--market-black-alpha-30);
    --market-text-inverse: var(--market-white-alpha-95);
    --market-text-inverse-20: var(--market-white-alpha-55);
    --market-text-black: var(--market-black-alpha-90);
    --market-text-white: var(--market-white);
    --market-fill-10: var(--market-black-alpha-90);
    --market-fill-20: var(--market-black-alpha-30);
    --market-fill-30: var(--market-black-alpha-15);
    --market-fill-35: var(--market-black-alpha-10);
    --market-fill-40: var(--market-black-alpha-05);
    --market-fill-50: var(--market-black-alpha-03);
    --market-fill-inverse: var(--market-white-alpha-95);
    --market-fill-black: var(--market-black-alpha-90);
    --market-fill-white: var(--market-white);
    --market-divider-10: var(--market-black-alpha-30);
    --market-divider-10-inverse: var(--market-white-alpha-30);
    --market-divider-20: var(--market-black-alpha-05);
    --market-divider-20-inverse: var(--market-white-alpha-15);
    --market-light-surface-05: var(--market-white);
    --market-light-surface-10: var(--market-white);
    --market-light-surface-20: var(--market-white);
    --market-light-surface-30: var(--market-white);
    --market-light-surface-inverse: var(--market-black-alpha-90);
    --market-light-surface-overlay: var(--market-black-alpha-80);
    --market-surface-body-overlay: var(--market-white-alpha-15);
    --market-emphasis-fill: #AA182C;
    --market-emphasis-text: #000;
    --market-emphasis-10: #AA182C;
    --market-emphasis-20: #AA182C;
    --market-emphasis-30: #cce1ff;
    --market-emphasis-40: #e5f0ff;
    --market-success-fill: #00b23b;
    --market-success-text: #007d2a;
    --market-success-10: #00802a;
    --market-success-20: #009933;
    --market-success-30: #ccffdd;
    --market-success-40: #e5ffee;
    --market-warning-fill: #ff9f40;
    --market-warning-text: #945c25;
    --market-warning-10: #cc8033;
    --market-warning-20: #e58f39;
    --market-warning-30: #ffe5cc;
    --market-warning-40: #fff2e5;
    --market-critical-fill: #cc0023;
    --market-critical-text: #bf0020;
    --market-critical-10: #99001a;
    --market-critical-20: #b2001e;
    --market-critical-30: #ffccd5;
    --market-critical-40: #ffe5ea;
    --market-radius-100: 6px;
    --market-radius-200: 12px;
    --market-radius-circle: 1000px;

    /* Theme variables */
    --theme-emphasis-text: var(--override-emphasis-text, var(--market-emphasis-text));
    --theme-emphasis-fill: var(--override-emphasis-fill, var(--market-emphasis-fill));
    --theme-emphasis-fill-contrast: var(--override-emphasis-fill-contrast, var(--market-white));
    --theme-emphasis-10: var(--override-emphasis-10, var(--market-emphasis-10));
    --theme-emphasis-20: var(--override-emphasis-20, var(--market-emphasis-20));
    --theme-emphasis-30: var(--override-emphasis-30, var(--market-emphasis-30));
    --theme-emphasis-40: var(--override-emphasis-40, var(--market-emphasis-40));
    --theme-success-text: var(--override-success-text, var(--market-success-text));
    --theme-success-fill: var(--override-success-fill, var(--market-success-fill));
    --theme-success-fill-contrast: var(--override-success-fill-contrast, var(--market-white));
    --theme-success-10: var(--override-success-10, var(--market-success-10));
    --theme-success-20: var(--override-success-20, var(--market-success-20));
    --theme-success-30: var(--override-success-30, var(--market-success-30));
    --theme-success-40: var(--override-success-40, var(--market-success-40));
    --theme-warning-text: var(--override-warning-text, var(--market-warning-text));
    --theme-warning-fill: var(--override-warning-fill, var(--market-warning-fill));
    --theme-warning-fill-contrast: var(--override-warning-fill-contrast, var(--market-white));
    --theme-warning-10: var(--override-warning-10, var(--market-warning-10));
    --theme-warning-20: var(--override-warning-20, var(--market-warning-20));
    --theme-warning-30: var(--override-warning-30, var(--market-warning-30));
    --theme-warning-40: var(--override-warning-40, var(--market-warning-40));
    --theme-critical-text: var(--override-critical-text, var(--market-critical-text));
    --theme-critical-fill: var(--override-critical-fill, var(--market-critical-fill));
    --theme-critical-fill-contrast: var(--override-critical-fill-contrast, var(--market-white));
    --theme-critical-10: var(--override-critical-10, var(--market-critical-10));
    --theme-critical-20: var(--override-critical-20, var(--market-critical-20));
    --theme-critical-30: var(--override-critical-30, var(--market-critical-30));
    --theme-critical-40: var(--override-critical-40, var(--market-critical-40));
    --theme-text-10: var(--override-text-10, var(--market-text-10));
    --theme-text-20: var(--override-text-20, var(--market-text-20));
    --theme-text-30: var(--override-text-30, var(--market-text-30));
    --theme-text-inverse: var(--override-text-inverse, var(--market-text-inverse));
    --theme-text-inverse-20: var(--override-text-inverse-20, var(--market-text-inverse-20));
    --theme-text-black: var(--market-black);
    --theme-text-white: var(--market-white);
    --theme-fill-10: var(--override-fill-10, var(--market-fill-10));
    --theme-fill-20: var(--override-fill-20, var(--market-fill-20));
    --theme-fill-30: var(--override-fill-30, var(--market-fill-30));
    --theme-fill-35: var(--override-fill-35, var(--market-fill-35));
    --theme-fill-40: var(--override-fill-40, var(--market-fill-40));
    --theme-fill-50: var(--override-fill-50, var(--market-fill-50));
    --theme-fill-inverse: var(--override-fill-inverse, var(--market-fill-inverse));
    --theme-fill-inverse-solid: var(--override-fill-inverse-solid, var(--market-white));
    --theme-fill-black: var(--market-black);
    --theme-fill-white: var(--market-white);
    --theme-divider-10: var(--override-divider-10, var(--market-divider-10));
    --theme-divider-10-inverse: var(--override-divider-10-inverse, var(--market-divider-10-inverse));
    --theme-divider-20: var(--override-divider-20, var(--market-divider-20));
    --theme-divider-20-inverse: var(--override-divider-20-inverse, var(--market-divider-20-inverse));
    --theme-surface-05: var(--override-surface-05, var(--market-light-surface-05));
    --theme-surface-10: var(--override-surface-10, var(--market-light-surface-10));
    --theme-body-color: var(--override-surface-20, var(--market-light-surface-20));
    --theme-surface-30: var(--override-surface-30, var(--market-light-surface-30));
    --theme-surface-inverse: var(--override-surface-inverse, var(--market-light-surface-inverse));
    --theme-surface-overlay: var(--override-surface-overlay, var(--market-light-surface-overlay));
    --theme-surface-body-overlay: var(--override-surface-body-overlay, var(--market-surface-body-overlay));
    --theme-elevation-10: 0px 0px 4px 0px var(--theme-fill-35), 0px 1px 2px 0px var(--theme-fill-35);
    --theme-elevation-20: 0px 2px 16px 0px var(--theme-fill-35), 0px 4px 8px 0px var(--theme-fill-35);
    --theme-elevation-30: 0px 4px 32px 0px var(--theme-fill-35), 0px 8px 16px 0px var(--theme-fill-35);

    /* Base color variables */
    --theme-body-color: #f8f4ed;
    --theme-body-text-color: var(--override-color-body-text, var(--theme-text-10));
    --theme-body-text-color-subtle: var(--override-color-body-text-subtle, var(--theme-text-20));
    --theme-body-text-color-contrast: var(--override-color-body-text-contrast, var(--theme-text-inverse));
    --theme-heading-color: var(--override-color-heading, var(--theme-text-10));
    --theme-label-color: var(--override-color-label, var(--theme-text-10));
    --theme-sublabel-color: var(--override-color-sublabel, var(--theme-text-20));
    --theme-link-color: var(--override-emphasis-text, var(--theme-emphasis-text));

    /* Container */
    --theme-max-container: var(--override-container-max-width, 3200px);
    --theme-container-padding: calc(var(--override-container-padding, 0px) + var(--space-x4));

    /* Borders */
    --theme-border-radius-default: var(--override-border-radius-default, var(--market-radius-100));
    --theme-border-radius-default-inner: calc(var(--theme-border-radius-default) - 2px);
    --theme-border-radius-button-small: var(--override-border-radius-button-small, var(--market-radius-100));
    --theme-border-radius-button-medium: var(--override-border-radius-button-medium, var(--market-radius-100));
    --theme-border-radius-button-large: var(--override-border-radius-button-large, var(--market-radius-100));
    --theme-border-radius-button-mobile: var(--override-border-radius-button-mobile, var(--market-radius-100));
    --theme-border-radius-input: var(--override-border-radius-input, var(--market-radius-100));
    --theme-border-radius-input-inner: calc(var(--theme-border-radius-input) - 2px);
    --theme-border-radius-input-small: var(--override-border-radius-input-small, var(--market-radius-100));
    --theme-border-radius-input-small-inner: calc(var(--theme-border-radius-input-small) - 2px);
    --theme-border-radius-input-medium: var(--override-border-radius-input-medium, var(--market-radius-100));
    --theme-border-radius-input-medium-inner: calc(var(--theme-border-radius-input-medium) - 2px);
    --theme-border-radius-input-large: var(--override-border-radius-input-large, var(--market-radius-100));
    --theme-border-radius-input-large-inner: calc(var(--theme-border-radius-input-large) - 2px);
    --theme-border-radius-image: var(--override-border-radius-image, var(--market-radius-200));
    --theme-border-radius-card: var(--override-border-radius-card, var(--market-radius-100));
    --theme-border-radius-dialog: var(--override-border-radius-dialog, var(--market-radius-200));
    --theme-border-radius-badge-pill: var(--override-border-radius-badge-pill, var(--market-radius-circle));
    --theme-border-radius-badge-rounded: var(--override-border-radius-badge-rounded, var(--market-radius-200));

    /* Contextual color variables */
    --theme-pill-normal-fill: var(--override-pill-normal-fill, var(--theme-fill-40));
    --theme-pill-normal-fill-hover: var(--override-pill-normal-fill-hover, var(--theme-fill-30));
    --theme-pill-normal-text: var(--override-pill-normal-text, var(--theme-text-20));
    --theme-pill-emphasis-fill: var(--override-pill-emphasis-fill, var(--theme-emphasis-40));
    --theme-pill-emphasis-fill-hover: var(--override-pill-emphasis-fill-hover, var(--theme-emphasis-30));
    --theme-pill-emphasis-text: var(--override-pill-emphasis-text, var(--theme-emphasis-text));
    --theme-pill-success-fill: var(--override-pill-success-fill, var(--theme-success-40));
    --theme-pill-success-fill-hover: var(--override-pill-success-fill-hover, var(--theme-success-30));
    --theme-pill-success-text: var(--override-pill-success-text, var(--theme-success-text));
    --theme-pill-warning-fill: var(--override-pill-warning-fill, var(--theme-warning-40));
    --theme-pill-warning-fill-hover: var(--override-pill-warning-fill-hover, var(--theme-warning-30));
    --theme-pill-warning-text: var(--override-pill-warning-text, var(--theme-warning-text));
    --theme-pill-critical-fill: var(--override-pill-critical-fill, var(--theme-critical-40));
    --theme-pill-critical-fill-hover: var(--override-pill-critical-fill-hover, var(--theme-critical-30));
    --theme-pill-critical-text: var(--override-pill-critical-text, var(--theme-critical-text));

    /* Footer and Header Logo */
    --theme-logo-font-size: 32px;
    --theme-logo-line-height: 1.25;
    --theme-logo-font-weight: var(--theme-font-weight-heavy);

    /* Scrollbar */
    --theme-scrollbar-width: 8px;
    --theme-scrollbar-color: var(--override-color-scrollbar, var(--theme-body-color));
    --theme-scrollbar-thumb-color: var(--override-color-scrollbar-thumb, var(--theme-text-20));

    /* Z-index */
    --theme-z-index-controls: 1;
    --theme-z-index-hover: 1;
    --theme-z-index-overlay: 10;
    --theme-z-index-megamenu-overlay: 1;
    --theme-z-index-header: 2;
    --theme-z-index-main: 1;
    --theme-z-index-action-bar: 1;

    /* Form */
    --theme-form-small-height: var(--space-x5);
    --theme-form-medium-height: var(--space-x6);
    --theme-form-large-height: var(--space-x7);
    --theme-form-border-width: 1px;
    --theme-form-focus-outline-width: 2px;
    --theme-form-focus-outline-color: var(--theme-emphasis-fill);
    --theme-form-collapsible-icon-size: 10px;

    /* Action bar */
    --theme-action-bar-height: 97px;
}