:root:root {
    --mc-canal-blue: #051977;
    --mc-press-black: #212529;
    --mc-cream-white: #fcfcfd;
    --mc-soft-grey: #f6f4f2;
    --mc-text-secondary: #63686d;

    --mc-text-caption: 0.625rem;
    --mc-text-caption-lh: 1.5;
    --mc-text-caption-ls: 0.06em;

    --mc-text-body-sm: 0.9375rem;
    --mc-text-body-sm-lh: 1.6;
    --mc-text-body-sm-ls: 0.013em;

    --mc-text-body: 1.25rem;
    --mc-text-body-lh: 1.55;
    --mc-text-body-ls: 0.017em;

    --mc-text-heading-sm: 2.1875rem;
    --mc-text-heading-sm-lh: 1.2;
    --mc-text-heading-sm-ls: 0.04em;

    --mc-text-subheading: 1.875rem;
    --mc-text-subheading-lh: 1.2;
    --mc-text-subheading-ls: 0.03em;

    --mc-text-display: clamp(2.75rem, 1.45rem + 5.3333vw, 6.375rem);
    --mc-text-display-lh: 0.98;
    --mc-text-display-ls: -0.02em;


    --mc-radius: 5px;
    --mc-space-section: 50px;
    --mc-space-card: 30px;
    --mc-space-element: 10px;
    --mc-ease-editorial: cubic-bezier(0.2, 0, 0, 1);

    --mc-container: 1600px;
    --dcm-header-max-width: 1600px;

    --dct--customized-maxSiteWidth: 1600px;
    --dct--customized-radius-xs: var(--mc-radius);
    --dct--customized-radius-sm: var(--mc-radius);
    --dct--customized-radius-md: var(--mc-radius);
    --dct--customized-radius-lg: var(--mc-radius);
    --dct--customized-radius-xl: var(--mc-radius);
    --dct--customized-radius-cards: var(--mc-radius);
    --dct--customized-radius-buttons: var(--mc-radius);
    --dct--customized-radius-tags: var(--mc-radius);
    --dct--customized-colors-buttonsLinks: var(--mc-canal-blue);
    --dct--customized-colors-navBar: var(--mc-cream-white);
    --dct--customized-colors-staffPickTag: var(--mc-canal-blue);
    --dct--customized-colors-discountTag: #8a1c1c;

    --dcm-color-primary: var(--mc-canal-blue);
    --dcm-color-navbar-bg: var(--mc-cream-white);
    --dcm-color-body-bg: var(--mc-cream-white);
    --dcm-color-surface: var(--mc-cream-white);
    --dcm-color-surface-hover: var(--mc-soft-grey);
    --dcm-color-surface-muted: var(--mc-soft-grey);
    --dcm-color-text-primary: var(--mc-press-black);
    --dcm-color-text-secondary: var(--mc-text-secondary);
    --dcm-color-text-inverted: var(--mc-cream-white);
    --dcm-color-border: rgba(5, 25, 119, 0.25);
    --dcm-color-focus: var(--mc-canal-blue);
    --dcm-color-focus-shadow: rgba(5, 25, 119, 0.2);

    --mc-font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

    --dcm-radius-sm: var(--mc-radius);
    --dcm-radius-md: var(--mc-radius);
    --dcm-radius-lg: var(--mc-radius);
    --dcm-radius-buttons: var(--mc-radius);
    --dcm-radius-cards: var(--mc-radius);

    --dcm-header-bg: var(--mc-cream-white);
    --dcm-header-text-color: var(--mc-canal-blue);
    --dcm-header-border-color: var(--mc-canal-blue);
    --dcm-header-shadow: none;
    --dcm-header-divider-color: rgba(5, 25, 119, 0.25);

    --dcm-cart-btn-bg-active: var(--mc-canal-blue);
    --dcm-cart-btn-bg-empty: var(--mc-cream-white);
    --dcm-cart-btn-text-empty: var(--mc-canal-blue);
    --dcm-cart-btn-border-radius: 0;
    --dcm-search-input-border-radius: 0;
    --dcm-popover-border-radius: 0;
    --dcm-banner-border-radius: 0;
    --dcm-brands-card-border-radius: 0;
    --dcm-modal-border-radius: 0;

    --dcm-infobar-bg: var(--mc-canal-blue);
    --dcm-infobar-text-color: var(--mc-cream-white);
    --dcm-infobar-border-color: var(--mc-canal-blue);

    --dcm-footer-bg: var(--mc-canal-blue);
    --dcm-footer-text-color: var(--mc-cream-white);
    --dcm-privacy-footer-bg: var(--mc-canal-blue);
    --dcm-privacy-footer-border-color: rgba(252, 252, 253, 0.25);
    --dcm-privacy-footer-text-color: rgba(252, 252, 253, 0.75);
    --dcm-privacy-footer-text-hover-color: var(--mc-cream-white);

    --dcm-section-title-color: var(--mc-canal-blue);
    --dcm-section-subtitle-color: var(--mc-press-black);

    --dcm-product-name-color: var(--mc-press-black);
    --dcm-product-brand-color: var(--mc-canal-blue);
    --dcm-product-price-color: var(--mc-canal-blue);
    --dcm-product-description-color: var(--mc-press-black);
    --dcm-product-page-bg: var(--mc-cream-white);
    --dcm-product-option-bg: transparent;
    --dcm-product-option-border-color: rgba(5, 25, 119, 0.25);

    --dcm-breadcrumb-link-color: var(--mc-text-secondary);
    --dcm-breadcrumb-active-color: var(--mc-canal-blue);

    --dcm-age-gate-backdrop-color: rgba(5, 25, 119, 0.55);
    --dcm-age-gate-backdrop-blur: 6px;
    --dcm-age-gate-modal-bg: var(--mc-cream-white);
    --dcm-age-gate-modal-text-color: var(--mc-press-black);
    --dcm-age-gate-modal-border-radius: 0;
    --dcm-age-gate-modal-shadow: none;
    --dcm-age-gate-modal-max-width: 460px;
    --dcm-age-gate-modal-padding: 40px;
    --dcm-age-gate-heading-font-size: var(--mc-text-subheading);
    --dcm-age-gate-heading-font-weight: 700;
    --dcm-age-gate-body-color: var(--mc-press-black);
    --dcm-age-gate-body-font-size: var(--mc-text-body-sm);
    --dcm-age-gate-link-color: var(--mc-canal-blue);
    --dcm-age-gate-btn-border-radius: 0;
    --dcm-age-gate-btn-font-size: var(--mc-text-body-sm);
    --dcm-age-gate-btn-height: 48px;
    --dcm-age-gate-cta-btn-font-size: var(--mc-text-body-sm);
    --dcm-age-gate-cta-btn-height: 48px;
    --dcm-age-gate-cta-copy-font-size: var(--mc-text-body-sm);
    --dcm-age-gate-remember-font-size: 0.8125rem;
    --dcm-age-gate-terms-font-size: 0.75rem;

    --dcm-locations-pin-color: var(--mc-canal-blue);
    --dcm-locations-pin-highlight-color: var(--mc-press-black);
    --dcm-locations-marker-label-bg: var(--mc-cream-white);
    --dcm-locations-marker-address-color: var(--mc-text-secondary);
    --dcm-locations-browser-bg: var(--mc-cream-white);
    --dcm-locations-browser-text-color: var(--mc-press-black);
    --dcm-locations-card-bg: var(--mc-cream-white);
    --dcm-locations-card-border-color: rgba(5, 25, 119, 0.25);
    --dcm-locations-card-hover-bg: var(--mc-soft-grey);
    --dcm-locations-card-hover-border-color: var(--mc-canal-blue);
    --dcm-locations-card-text-color: var(--mc-press-black);
    --dcm-locations-heading-color: var(--mc-canal-blue);
    --dcm-locations-link-color: var(--mc-canal-blue);
    --dcm-locations-subtext-color: var(--mc-text-secondary);
    --dcm-locations-text-color: var(--mc-press-black);
    --dcm-locations-scrollbar-color: rgba(5, 25, 119, 0.25);
    --dcm-locations-close-hover-bg: var(--mc-soft-grey);

    --dcm-cart-bg: var(--mc-cream-white);
    --dcm-cart-content-bg: var(--mc-soft-grey);
    --dcm-cart-text-color: var(--mc-press-black);
    --dcm-cart-border-color: rgba(5, 25, 119, 0.25);
    --dcm-cart-item-bg: var(--mc-cream-white);
    --dcm-checkout-heading-color: var(--mc-canal-blue);
    --dcm-checkout-text-color: var(--mc-press-black);
    --dcm-checkout-input-bg: var(--mc-cream-white);
    --dcm-checkout-summary-bg: var(--mc-soft-grey);

    --dcm-account-bg: var(--mc-cream-white);
    --dcm-account-nav-color: var(--mc-canal-blue);
    --dcm-account-label-color: var(--mc-text-secondary);
    --dcm-account-divider-color: rgba(5, 25, 119, 0.25);
    --dcm-account-link-icon-color: var(--mc-canal-blue);
    --dcm-login-nudge-bg: var(--mc-soft-grey);
    --dcm-login-nudge-text-color: var(--mc-press-black);
    --dcm-login-nudge-link-color: var(--mc-canal-blue);
    --dcm-popover-bg: var(--mc-cream-white);
    --dcm-popover-item-color: var(--mc-press-black);
    --dcm-popover-item-hover-bg: var(--mc-soft-grey);
    --dcm-popover-shadow: none;
    --dcm-modal-bg: var(--mc-cream-white);
    --dcm-modal-text-color: var(--mc-press-black);
    --dcm-modal-shadow: none;

    --dcm-skeleton-bg: var(--mc-soft-grey);
    --dcm-skeleton-border-color: rgba(5, 25, 119, 0.25);
    --dcm-filter-heading-color: var(--mc-canal-blue);
    --dcm-filter-text-color: var(--mc-press-black);
    --dcm-filter-border-color: rgba(5, 25, 119, 0.25);
    --dcm-carousel-btn-bg: var(--mc-cream-white);
    --dcm-carousel-btn-hover-bg: var(--mc-soft-grey);
    --dcm-carousel-btn-arrow-color: var(--mc-canal-blue);
    --dcm-categories-card-bg: var(--mc-soft-grey);
    --dcm-categories-card-border-color: rgba(5, 25, 119, 0.25);
    --dcm-categories-card-text-color: var(--mc-canal-blue);
    --dcm-brands-card-bg: var(--mc-cream-white);
    --dcm-brands-card-border-color: rgba(5, 25, 119, 0.25);
    --dcm-brands-card-name-color: var(--mc-canal-blue);
    --dcm-color-status-open: var(--mc-canal-blue);
    --dcm-color-status-closed: #d92c20;
  }

  ::selection {
    background-color: var(--mc-canal-blue);
    color: var(--mc-cream-white);
  }

  html {
    scrollbar-gutter: stable;
    scrollbar-color: color-mix(in srgb, var(--mc-press-black) 22%, transparent) transparent;
    scrollbar-width: thin;
  }

  body {
    scrollbar-color: auto;

    scrollbar-gutter: stable;
    padding-right: 0 !important;
  }

  body {
    background: var(--dcm-color-body-bg);
    color: var(--dcm-color-text-primary);
    scrollbar-color: auto;
    scrollbar-gutter: stable;
    padding-right: 0 !important;
  }