/* Theme variables */

@font-face {
    font-family: Inter;
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    src: url("//keystonethemedemo2.myshopify.com/cdn/fonts/inter/inter_n7.02711e6b374660cfc7915d1afc1c204e633421e4.woff2?h1=a2V5c3RvbmV0aGVtZWRlbW8yLmFjY291bnQubXlzaG9waWZ5LmNvbQ&hmac=e7b598082e75a064f8968d3df3fd3002fb37be64ef16c62e2d47f087051957f6") format("woff2"),
        url("//keystonethemedemo2.myshopify.com/cdn/fonts/inter/inter_n7.6dab87426f6b8813070abd79972ceaf2f8d3b012.woff?h1=a2V5c3RvbmV0aGVtZWRlbW8yLmFjY291bnQubXlzaG9waWZ5LmNvbQ&hmac=8576452750ae307dfbd92f2911f06cd03a12e269016292d7a7955b80d8047c15") format("woff");
}

:root {
    /* Background colors */
    --color__background-body: #ffffff;
    --color__background-overlay-1: #e6e6e6;
    --color__background-overlay-2: #b3b3b3;
    --color__background-overlay-3: #808080;
    --color__background-shade-1: rgba(217, 217, 217, 0.3);
    --color__background-shade-2: rgba(191, 191, 191, 0.3);
    --color__background-shade-3: rgba(128, 128, 128, 0.3);
    --color__background-primary: #f5cb5c;
    --color__background-secondary: #242423;
    --color__background-tertiary: #e8eddf;
    --color__background-neutral: #ffffff;
    --color__background-plain: #e6e6e6;
    --color__shade-primary: #f2bc2c;
    --color__shade-secondary: #3e3e3c;
    --color__shade-tertiary: #d1dbbe;
    --color__shade-neutral: #e6e6e6;
    --color__shade-plain: #cdcdcd;

    /* Foreground colors */
    --color__foreground-primary: #242423;
    --color__foreground-secondary: #ffffff;
    --color__foreground-tertiary: #242423;
    --color__foregound-neutral: #242423;
    --color__foreground-plain: #242423;

    /* Text colors */
    --color__text-light: #242423;
    --color__text-dark: #e8eddf;
    --color__text-link: #f5cb5c;

    /* Border colors */
    --color__border-divider-1: rgba(179, 179, 179, 0.3);
    --color__border-divider-2: rgba(179, 179, 179, 0.6);
    --color__border-divider-3: rgba(179, 179, 179, 0.8);
    --color__border-selected-1: rgba(102, 102, 102, 0.6);
    --color__border-selected-2: rgba(102, 102, 102, 0.8);
    --color__border-primary: #f5cb5c;
    --color__border-secondary: #242423;
    --color__border-tertiary: #e8eddf;
    --color__border-neutral: #ffffff;
    --color__border-plain: #e6e6e6;

    /* Gap sizing */
    --sizes__gap-width: 10px;

    /* Border width */
    --sizes__border-button-width: 1px;
    --sizes__border-input-width: 1px;
    --sizes__border-element-width: 1px;

    /* Border radius */
    --sizes__border-element-radius: 0px;
    --sizes__border-button-radius: 0px;
    --sizes__border-input-radius: 5px;

    --sizes__border-textarea-radius: 5px;

    /* Input width and padding */

    --sizes__border-input-width: 1px;
    --sizes__border-input-width-top: 1px;
    --sizes__border-input-width-left: 1px;
    --sizes__border-input-width-right: 1px;
    --sizes__border-input-width-bottom: 1px;

    --sizes__border-input-width: 0;
    --sizes__border-input-width-top: 0;
    --sizes__border-input-width-left: 0;
    --sizes__border-input-width-right: 0;
    --sizes__border-input-width-bottom: 0;

    --sizes__border-input-padding-left: 1rem;
    --sizes__border-input-padding-right: 1rem;

    /* Typography */
    --type__font-100: calc(var(--type__font-200) / 1.05);
    --type__font-200: calc(var(--type__font-300) / 1.05);
    --type__font-300: 14px;
    --type__font-400: calc(var(--type__font-300) * 1.05);
    --type__font-500: calc(var(--type__font-400) * 1.05);
    --type__font-600: calc(var(--type__font-500) * 1.05);
    --type__font-700: calc(var(--type__font-600) * 1.05);
    --type__font-800: calc(var(--type__font-700) * 1.05);
    --type__font-900: calc(var(--type__font-800) * 1.05);
    --type__font-1000: calc(var(--type__font-900) * 1.05);
    --type__font-1100: calc(var(--type__font-1000) * 1.05);
    --type__font-1200: calc(var(--type__font-1100) * 1.05);
    --type__font-smaller: clamp(var(--type__font-100), 1vw + 0.5rem, var(--type__font-200));
    --type__font-small: clamp(var(--type__font-200), 1vw + 0.5rem, var(--type__font-300));
    --type__font-base: clamp(var(--type__font-300), 1vw + 0.5rem, var(--type__font-400));
    --type__font-big: clamp(var(--type__font-400), 1vw + 0.5rem, var(--type__font-500));
    --type__font-bigger: clamp(var(--type__font-500), 1vw + 0.5rem, var(--type__font-600));
    --type__font-heading-1: clamp(var(--type__font-800), 4vw + 0.5rem, var(--type__font-1100));
    --type__font-heading-2: clamp(var(--type__font-700), 4vw + 0.5rem, var(--type__font-1000));
    --type__font-heading-3: clamp(var(--type__font-600), 4vw + 0.5rem, var(--type__font-900));
    --type__font-heading-4: clamp(var(--type__font-500), 4vw + 0.5rem, var(--type__font-700));
    --type__font-heading-5: clamp(var(--type__font-400), 4vw + 0.5rem, var(--type__font-600));
    --type__font-heading-6: clamp(var(--type__font-300), 4vw + 0.5rem, var(--type__font-500));

    --type__font-heading-line: 1.625;

    --spacing__font-smaller: calc(var(--type__font-smaller) * 1.625);
    --spacing__font-small: calc(var(--type__font-small) * 1.625);
    --spacing__font-base: calc(var(--type__font-base) * 1.625);
    --spacing__font-big: calc(var(--type__font-big) * 1.625);
    --spacing__font-bigger: calc(var(--type__font-bigger) * 1.625);

    --type__font-body-family: "system_ui", -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --type__font-body-style: normal;
    --type__font-body-weight: 400;
    --type__font-header-family: Inter, sans-serif;
    --type__font-header-style: normal;
    --type__font-header-weight: 700;
    --type__font-nav-family: "system_ui", -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --type__font-nav-style: normal;
    --type__font-nav-weight: 400;
    --type__heading-capiliziation: ;
    --type__nav-capiliziation: ;
    --type__button-capiliziation: ;

    /* Inputs */

    --inputs__text: inherit;

    --inputs__border: rgba(179, 179, 179, 0.3) !important;
    --inputs__background: rgba(191, 191, 191, 0.3) !important;
}

/* Animate css classes */

/* Shopify accelerated checkout */
shopify-accelerated-checkout {
    --shopify-accelerated-checkout-button-border-radius: 0px;
    --shopify-accelerated-checkout-skeleton-background-color: #242423;
    --shopify-accelerated-checkout-button-block-size: 44px;
}

shopify-accelerated-checkout-cart {
    --shopify-accelerated-checkout-button-border-radius: 0px;
    --shopify-accelerated-checkout-inline-alignment: flex-start;
    --shopify-accelerated-checkout-row-gap: 1rem;
    --shopify-accelerated-checkout-skeleton-background-color: #f0f0f0;
}