@charset "UTF-8";
:root {
  --colour-white: hsl(32, 70%, 99%);
  --colour-black: hsl(0, 0%, 12%);
  /* Brand */
  --colour-brand-yellow: hsl(49, 93%, 52%);
  --colour-brand-red: #EA482C;
  --colour-brand-red-digi: #d9381c;
  --colour-brand-cream: #FAEAD8;
  /* Shades */
  --colour-shade-0: hsl(32, 45%, 96%);
  --colour-shade-1: hsl(32, 25%, 93%);
  --colour-shade-2: hsl(32, 18%, 90%);
  --colour-shade-3: hsl(32, 15%, 88%);
  --colour-shade-4: hsl(32, 12%, 85%);
  --colour-shade-5: hsl(32, 10%, 78%);
  --colour-shade-6: hsl(32, 8%, 67%);
  --colour-shade-7: hsl(32, 8%, 56%);
  --colour-shade-8: hsl(32, 6%, 46%);
  --colour-shade-9: hsl(32, 6%, 34%);
  /* Background */
  --colour-bg-high-contrast: var(--colour-white);
  --colour-bg-lowered-contrast: var(--colour-shade-0);
  --colour-bg-elevated: var(--colour-white);
  --colour-bg-bold: var(--colour-brand-yellow);
  --colour-bg-muted: var(--colour-brand-cream);
  /* Text */
  --colour-text: var(--colour-black);
  --colour-text-invert: var(--colour-white);
  --colour-text-muted: var(--colour-shade-8);
  --colour-text-disabled: var(--colour-shade-5);
  --colour-text-brand-pop: var(--colour-brand-red);
  --colour-text-error: hsl(285, 65%, 50%);
  --colour-user-text-selection: hsla(32, 30%, 65%, 0.5);
  --colour-text-link-underline: var(--colour-brand-red);
  /* Icon */
  --colour-icon-important: var(--colour-brand-red);
  --colour-icon-hover: var(--colour-shade-3);
  /* Elevation level shadows */
  --colour-elevation-low-subtle: rgba(0, 0, 0, 0.02);
  --colour-elevation-low: rgba(0, 0, 0, 0.05);
  --colour-elevation-middle-1: rgba(57, 32, 0, 0.1);
  --colour-elevation-middle-2: rgba(57, 32, 0, 0.22);
  --colour-elevation-high: rgba(0, 0, 0, 0.25);
  --colour-elevation-high-subtle: rgba(0, 0, 0, 0.12);
  /* UI Components */
  /* - Action */
  --colour-action-fill: var(--colour-white);
  --colour-action-border: var(--colour-shade-3);
  --colour-action-hover: var(--colour-shade-0);
  --colour-action-disabled: var(--colour-shade-2);
  --colour-action-active: var(--colour-brand-yellow);
  --colour-action-text: var(--colour-text);
  --colour-action-text-invert: var(--colour-text-invert);
  /* - Primary action */
  --colour-action-primary: var(--colour-brand-yellow);
  --colour-action-primary-hover: hsl(48, 87%, 49%);
  --colour-action-primary-text:var(--colour-text);
  /* - Raised action */
  --colour-action-raised-fill:var(--colour-white);
  --colour-action-raised-hover:var(--colour-shade-0);
  --colour-action-raised-text:var(--colour-brand-red);
  /* - Ghost action */
  --colour-action-ghost-text:var(--colour-brand-red);
  /* - Favourite button */
  --colour-action-favourite-fill: hsl(0, 0%, 12%, 0.85);
  --colour-action-favourite-fill-hover: var(--colour-black);
  --colour-action-favourite-text: var(--colour-white);
  --colour-action-favourite-icon-fill: var(--colour-brand-red);
  --colour-action-not-favourite-icon-fill: transparent;
  --colour-action-not-favourite-icon-fill-hover: #EA482C80;
  --colour-action-not-favourite-icon-stroke: var(--colour-white);
  /* - Badge */
  --colour-badge-text: var(--colour-text);
  --colour-badge-icon: var(--colour-brand-red);
  --colour-badge-flat-fill: var(--colour-white);
  --colour-badge-subtle-fill: var(--colour-shade-1);
  --colour-badge-strong-fill: var(--colour-shade-9);
  --colour-badge-strong-text: var(--colour-text-invert);
  --colour-badge-important-fill: var(--colour-brand-red);
  --colour-badge-important-text: var(--colour-text-invert);
  --colour-badge-success-fill: hsl(140, 70%, 76%);
  --colour-badge-success-text: var(--colour-text);
  --colour-badge-quantity-fill: var(--colour-brand-yellow);
  --colour-badge-quantity-text: var(--colour-text);
  --colour-badge-vegetarian-fill: hsl(153, 27%, 92%);
  --colour-badge-vegetarian-icon: hsl(153, 54%, 42%);
  --colour-badge-vegan-fill: hsl(87, 26%, 93%);
  --colour-badge-vegan-icon: hsl(90, 46%, 48%);
  --colour-badge-gf-fill: hsl(43, 68%, 93%);
  --colour-badge-gf-icon: hsl(43, 100%, 50%);
  --colour-badge-df-fill: hsl(218, 35%, 94%);
  --colour-badge-df-icon: hsl(215, 54%, 62%);
  --colour-badge-cn-fill: hsl(18, 100%, 95%);
  --colour-badge-cn-icon: hsl(22, 100%, 46%);
  --colour-badge-exclusive-text: var(--colour-black);
  /* - Callout */
  --colour-callout-border: var(--colour-shade-3);
  --colour-callout-border-error: var(--colour-text-error);
  --colour-callout-icon: var(--colour-brand-red);
  /* - Card */
  --colour-card-border: var(--colour-shade-1);
  --colour-card-store-closed: var(--colour-shade-1);
  /* - Chip */
  --colour-chip-hover: hsla(32, 80%, 50%, 0.15);
  --colour-chip-choice-fill: var(--colour-brand-red-digi);
  --colour-chip-choice-text: var(--colour-text);
  --colour-chip-choice-text-active: var(--colour-text-invert);
  --colour-chip-action-fill: var(--colour-brand-cream);
  --colour-chip-action-text: var(--colour-text);
  --colour-chip-action-icon: var(--colour-brand-red);
  --colour-chip-filter-icon: var(--colour-text);
  --colour-chip-filter-text: var(--colour-text);
  /* - Divider */
  --colour-divider: var(--colour-shade-4);
  --colour-divider-with-content: var(--colour-brand-cream);
  --colour-divider-with-content-strong: var(--colour-brand-red-digi);
  --colour-divider-with-content-strong-text: var(--colour-text-invert);
  /* - Text input */
  --colour-text-input-fill: var(--colour-shade-1);
  --colour-text-input-focus-border: var(--colour-shade-7);
  --colour-text-input-focus-underline: var(--colour-brand-yellow);
  --colour-text-input-muted: var(--colour-shade-7);
  --colour-text-input-error: var(--colour-text-error);
  --colour-text-input-icon: var(--colour-brand-red);
  --colour-text-input-on-muted-section-fill: var(--colour-bg-high-contrast);
  /* - Checkbox */
  --colour-checkbox-fill: var(--colour-brand-yellow);
  --colour-checkbox-checkmark: var(--colour-black);
  --colour-checkbox-outline: var(--colour-black);
  /* - Radio */
  --colour-radio-fill: var(--colour-brand-yellow);
  --colour-radio-checkmark: var(--colour-black);
  --colour-radio-outline: var(--colour-black);
  /* - Line item */
  --colour-line-item-secondary-bg: var(--colour-shade-0);
  /* - Modal */
  --colour-modal-shadow: hsla(32, 10%, 51%, 0.8);
  /* - Notice */
  --colour-notice-fill: var(--colour-brand-yellow);
  --colour-notice-text: var(--colour-text);
  --colour-notice-raised-border: hsla(0, 0%, 12%, 0.08);
  --colour-notice-important-fill: hsl(285, 65%, 90%);
  --colour-notice-important-text: var(--colour-text);
  --colour-notice-strong-fill: var(--colour-brand-red-digi);
  --colour-notice-strong-text: var(--colour-text-invert);
  --colour-notice-deal-fill: var(--colour-brand-yellow);
  --colour-notice-deal-text: var(--colour-text);
  /* - Overlay */
  --colour-overlay-menu-shadow: hsla(32, 80%, 4%, 0.7);
  /* - Popover */
  --colour-popover-border: var(--colour-shade-4);
  /* - Link selector */
  --link-selector-hover: var(--colour-shade-1);
  /* - Bottom nav */
  --colour-bottom-nav-text: var(--colour-text-muted);
  --colour-bottom-nav-icon: var(--colour-text-muted);
  --colour-bottom-nav-active: var(--colour-brand-yellow);
  --colour-bottom-nav-text-active: var(--colour-text);
  --colour-bottom-nav-icon-active: var(--colour-text);
  --colour-bottom-nav-tap-highlight: hsla(32, 77%, 91%, 0.6);
  /* - Tree nav */
  --colour-tree-nav-link-hover: var(--colour-shade-1);
  --colour-tree-nav-link-active: var(--colour-brand-yellow);
  --colour-tree-nav-disclosure-button-icon: var(--colour-shade-6);
  --colour-tree-nav-disclosure-button-hover: var(--colour-shade-0);
  --colour-tree-nav-link-text: var(--colour-text);
  --colour-tree-nav-link-text-invert: var(--colour-text);
  /* - Progress bar */
  --colour-progress-bar-bg: rgba(159, 137, 111, 0.2);
  --colour-progress-bar-fill: var(--colour-brand-red);
  --colour-progress-bar-loading-fill: var(--colour-brand-yellow);
  /* - Places autocomplete */
  --colour-places-autocomplete-dimming: hsla(32, 100%, 10%, 0.25);
  --colour-places-autocomplete-option-hover: var(--colour-shade-1);
  /* - Switch */
  --colour-switch-fill: var(--colour-shade-3);
  --colour-switch-active: var(--colour-brand-yellow);
  --colour-switch-toggle: var(--colour-white);
  --colour-switch-value-inactive: var(--colour-shade-8);
  --colour-switch-value-active: var(--colour-black);
  /* - Overflow toggle */
  --colour-overflow-toggle-icon: var(--colour-brand-red);
  /* - Tooltip */
  --colour-tooltip-fill: var(--colour-black);
  /* - Logo */
  --colour-logo-text: var(--colour-brand-red);
  --colour-logo-base: var(--colour-brand-cream);
  --colour-logo-outline: var(--colour-black);
  --colour-logo-mouth-wrinkles: var(--colour-black);
  --colour-logo-body: var(--colour-brand-yellow);
  --colour-logo-tongue: var(--colour-brand-red);
  --colour-logo-speedlines: var(--colour-black);
  /* Content */
  /* - Collapse */
  --colour-collapse-divider: var(--colour-shade-3);
  --colour-collapse-open: var(--colour-shade-0);
  /* Focus */
  --colour-focus-outline: hsla(32, 15%, 50%, 0.3);
  --colour-focus-outline-large: hsla(32, 15%, 50%, 0.3);
  /* Image */
  --colour-image-placeholder: var(--colour-shade-1);
  --colour-image-product-placeholder: linear-gradient(0deg, hsl(32, 25%, 93%) 0%, hsl(32, 25%, 93%) 100%);
  --colour-image-background-fade: hsla(32, 25%, 85%, 0.75);
  --colour-image-background-fill: white;
  /* Gradients & special fills */
  --gradient-primary: linear-gradient(155.6deg, #FF3414 50.63%, #FF6515 95.78%);
  --gradient-exclusive-partner: linear-gradient(35deg, #E7CB68 10%, #F5E384 90%);
}
:root:has(#colour-scheme-dark:checked) {
  --colour-white: hsl(32, 70%, 99%);
  --colour-black: hsl(0, 0%, 12%);
  /* Brand */
  --colour-brand-yellow: hsl(49, 93%, 52%);
  --colour-brand-red: #EA482C;
  --colour-brand-red-digi: #d9381c;
  --colour-brand-cream: #FAEAD8;
  /* Shades */
  --colour-shade-0: hsl(32, 12%, 0%);
  --colour-shade-1: hsl(32, 10%, 4%);
  --colour-shade-2: hsl(32, 8%, 7%);
  --colour-shade-3: hsl(32, 6%, 10%);
  --colour-shade-4: hsl(32, 5%, 17%);
  --colour-shade-5: hsl(32, 4%, 19%);
  --colour-shade-6: hsl(32, 4%, 22%);
  --colour-shade-7: hsl(32, 4%, 33%);
  --colour-shade-8: hsl(32, 4%, 52%);
  --colour-shade-9: hsl(32, 4%, 60%);
  /* Background */
  --colour-bg-high-contrast: var(--colour-black);
  --colour-bg-lowered-contrast: var(--colour-shade-0);
  --colour-bg-elevated: var(--colour-black);
  --colour-bg-bold: var(--colour-brand-yellow);
  --colour-bg-muted: var(--colour-bg-high-contrast);
  /* Text */
  --colour-text: var(--colour-white);
  --colour-text-invert: var(--colour-black);
  --colour-text-muted: var(--colour-shade-8);
  --colour-text-disabled: var(--colour-shade-5);
  --colour-text-brand-pop: var(--colour-brand-red);
  --colour-text-error: hsl(285, 65%, 65%);
  --colour-user-text-selection: hsla(32, 30%, 65%, 0.5);
  --colour-text-link-underline: var(--colour-brand-red);
  /* Icon */
  --colour-icon-important: var(--colour-brand-red);
  --colour-icon-hover: var(--colour-shade-3);
  /* Elevation level shadows */
  --colour-elevation-low-subtle: rgba(0, 0, 0, 0.2);
  --colour-elevation-low: rgba(0, 0, 0, 0.25);
  --colour-elevation-middle-1: rgba(0, 0, 0, 0.2);
  --colour-elevation-middle-2: rgba(0, 0, 0, 0.6);
  --colour-elevation-high: rgba(0, 0, 0, 0.66);
  --colour-elevation-high-subtle: rgba(0, 0, 0, 0.52);
  /* UI Components */
  /* - Action */
  --colour-action-fill: var(--colour-black);
  --colour-action-border: var(--colour-shade-6);
  --colour-action-hover: var(--colour-shade-5);
  --colour-action-disabled: var(--colour-black);
  --colour-action-active: var(--colour-brand-yellow);
  --colour-action-text: var(--colour-text);
  --colour-action-text-invert: var(--colour-text-invert);
  /* - Primary action */
  --colour-action-primary: var(--colour-brand-yellow);
  --colour-action-primary-hover: hsl(48, 87%, 49%);
  --colour-action-primary-text: var(--colour-text-invert);
  /* - Raised action */
  --colour-action-raised-fill: var(--colour-shade-5);
  --colour-action-raised-hover: var(--colour-shade-6);
  --colour-action-raised-text: var(--colour-brand-yellow);
  /* - Ghost action */
  --colour-action-ghost-text: var(--colour-brand-yellow);
  /* - Favourite button */
  --colour-action-favourite-fill: hsl(0, 0%, 12%, 0.85);
  --colour-action-favourite-fill-hover: var(--colour-black);
  --colour-action-favourite-text: var(--colour-white);
  --colour-action-favourite-icon-fill: var(--colour-brand-red);
  --colour-action-not-favourite-icon-fill: transparent;
  --colour-action-not-favourite-icon-fill-hover: #EA482C80;
  --colour-action-not-favourite-icon-stroke: var(--colour-white);
  /* - Badge */
  --colour-badge-text: var(--colour-text);
  --colour-badge-icon: var(--colour-brand-red);
  --colour-badge-flat-fill: var(--colour-black);
  --colour-badge-subtle-fill: var(--colour-shade-5);
  --colour-badge-strong-fill: var(--colour-brand-cream);
  --colour-badge-strong-text: var(--colour-text-invert);
  --colour-badge-important-fill: var(--colour-brand-red-digi);
  --colour-badge-important-text: var(--colour-text);
  --colour-badge-success-fill: hsl(140, 70%, 25%);
  --colour-badge-success-text: var(--colour-text);
  --colour-badge-quantity-fill: var(--colour-brand-yellow);
  --colour-badge-quantity-text: var(--colour-text-invert);
  --colour-badge-vegetarian-fill: hsl(153, 27%, 25%);
  --colour-badge-vegetarian-icon: hsl(153, 54%, 42%);
  --colour-badge-vegan-fill: hsl(87, 26%, 25%);
  --colour-badge-vegan-icon: hsl(90, 46%, 48%);
  --colour-badge-gf-fill: hsl(43, 68%, 20%);
  --colour-badge-gf-icon: hsl(43, 100%, 50%);
  --colour-badge-df-fill: hsl(218, 35%, 25%);
  --colour-badge-df-icon: hsl(215, 54%, 62%);
  --colour-badge-cn-fill: hsl(18, 35%, 24%);
  --colour-badge-cn-icon: hsl(22, 58%, 54%);
  --colour-badge-exclusive-text: var(--colour-black);
  /* - Callout */
  --colour-callout-border: var(--colour-shade-6);
  --colour-callout-border-error: var(--colour-text-error);
  --colour-callout-icon: var(--colour-brand-red);
  /* - Card */
  --colour-card-border: var(--colour-shade-4);
  --colour-card-store-closed: var(--colour-shade-1);
  /* - Chip */
  --colour-chip-hover: hsla(32, 70%, 55%, 0.20);
  --colour-chip-choice-fill: var(--colour-brand-red-digi);
  --colour-chip-choice-text: var(--colour-text);
  --colour-chip-choice-text-active: var(--colour-text);
  --colour-chip-action-fill: var(--colour-shade-5);
  --colour-chip-action-text: var(--colour-brand-cream);
  --colour-chip-action-icon: var(--colour-brand-yellow);
  --colour-chip-filter-icon: var(--colour-text);
  --colour-chip-filter-text: var(--colour-text-invert);
  /* - Divider */
  --colour-divider: var(--colour-shade-6);
  --colour-divider-with-content: var(--colour-shade-5);
  --colour-divider-with-content-strong: var(--colour-brand-red-digi);
  --colour-divider-with-content-strong-text: var(--colour-text);
  /* - Text input */
  --colour-text-input-fill: var(--colour-shade-1);
  --colour-text-input-focus-border: var(--colour-shade-7);
  --colour-text-input-focus-underline: var(--colour-brand-yellow);
  --colour-text-input-muted: var(--colour-shade-7);
  --colour-text-input-error: var(--colour-text-error);
  --colour-text-input-icon: var(--colour-brand-red);
  --colour-text-input-on-muted-section-fill: var(--colour-text-input-fill);
  /* - Checkbox */
  --colour-checkbox-fill: var(--colour-brand-yellow);
  --colour-checkbox-checkmark: var(--colour-black);
  --colour-checkbox-outline: var(--colour-white);
  /* - Radio */
  --colour-radio-fill: var(--colour-brand-yellow);
  --colour-radio-checkmark: var(--colour-black);
  --colour-radio-outline: var(--colour-white);
  /* - Line item */
  --colour-line-item-secondary-bg: var(--colour-shade-2);
  /* - Modal */
  --colour-modal-shadow: hsla(30, 8%, 8%, 0.8);
  /* - Notice */
  --colour-notice-fill: var(--colour-brand-yellow);
  --colour-notice-text: var(--colour-text-invert);
  --colour-notice-raised-border: hsla(0, 0%, 12%, 0.08);
  --colour-notice-important-fill: hsl(285, 25%, 25%);
  --colour-notice-important-text: var(--colour-text);
  --colour-notice-strong-fill: var(--colour-brand-red-digi);
  --colour-notice-strong-text: var(--colour-text);
  --colour-notice-deal-fill: var(--colour-brand-yellow);
  --colour-notice-deal-text: var(--colour-text-invert);
  /* - Overlay */
  --colour-overlay-menu-shadow: hsla(32, 15%, 3%, 0.75);
  /* - Popover */
  --colour-popover-border: var(--colour-shade-6);
  /* - Link selector */
  --link-selector-hover: var(--colour-shade-6);
  /* - Bottom nav */
  --colour-bottom-nav-text: var(--colour-text-muted);
  --colour-bottom-nav-icon: var(--colour-text-muted);
  --colour-bottom-nav-active: var(--colour-brand-yellow);
  --colour-bottom-nav-text-active: var(--colour-text-invert);
  --colour-bottom-nav-icon-active: var(--colour-text);
  --colour-bottom-nav-tap-highlight: hsl(32, 4%, 19%);
  /* - Tree nav */
  --colour-tree-nav-link-hover: var(--colour-shade-6);
  --colour-tree-nav-link-active: var(--colour-brand-yellow);
  --colour-tree-nav-disclosure-button-icon: var(--colour-shade-7);
  --colour-tree-nav-disclosure-button-hover: var(--colour-shade-5);
  --colour-tree-nav-link-text: var(--colour-text);
  --colour-tree-nav-link-text-invert: var(--colour-text-invert);
  /* - Progress bar */
  --colour-progress-bar-bg: rgba(159, 137, 111, 0.4);
  --colour-progress-bar-fill: var(--colour-brand-red);
  --colour-progress-bar-loading-fill: var(--colour-brand-yellow);
  /* - Places autocomplete */
  --colour-places-autocomplete-dimming: hsla(32, 15%, 2%, 0.6);
  --colour-places-autocomplete-option-hover: var(--colour-shade-5);
  /* - Switch */
  --colour-switch-fill: var(--colour-shade-6);
  --colour-switch-active: var(--colour-brand-yellow);
  --colour-switch-toggle: var(--colour-white);
  --colour-switch-value-inactive: var(--colour-shade-8);
  --colour-switch-value-active: var(--colour-white);
  /* - Overflow toggle */
  --colour-overflow-toggle-icon: var(--colour-brand-red);
  /* - Tooltip */
  --colour-tooltip-fill: var(--colour-brand-cream);
  /* - Logo */
  --colour-logo-text: var(--colour-brand-cream);
  --colour-logo-base: var(--colour-brand-cream);
  --colour-logo-outline: var(--colour-black);
  --colour-logo-mouth-wrinkles: var(--colour-black);
  --colour-logo-body: var(--colour-brand-yellow);
  --colour-logo-tongue: var(--colour-brand-red);
  --colour-logo-speedlines: var(--colour-brand-cream);
  /* Content */
  /* - Collapse */
  --colour-collapse-divider: var(--colour-shade-3);
  --colour-collapse-open: var(--colour-shade-0);
  /* Focus */
  --colour-focus-outline: hsla(32, 15%, 50%, 0.3);
  --colour-focus-outline-large: hsla(32, 15%, 50%, 0.3);
  /* Image */
  --colour-image-placeholder: var(--colour-shade-7);
  --colour-image-product-placeholder: linear-gradient(0deg, hsl(32, 25%, 7%) 0%, hsl(32, 25%, 7%) 100%);
  --colour-image-background-fade: hsla(32, 15%, 5%, 0.4);
  --colour-image-background-fill: white;
  /* Gradients & special fills */
  --gradient-primary: linear-gradient(155.6deg, #FF3414 50.63%, #FF6515 95.78%);
  --gradient-exclusive-partner: linear-gradient(35deg, #E7CB68 10%, #F5E384 90%);
}
@media (prefers-color-scheme: dark) {
  :root:not(:has(#colour-scheme-light:checked)) {
    --colour-white: hsl(32, 70%, 99%);
    --colour-black: hsl(0, 0%, 12%);
    /* Brand */
    --colour-brand-yellow: hsl(49, 93%, 52%);
    --colour-brand-red: #EA482C;
    --colour-brand-red-digi: #d9381c;
    --colour-brand-cream: #FAEAD8;
    /* Shades */
    --colour-shade-0: hsl(32, 12%, 0%);
    --colour-shade-1: hsl(32, 10%, 4%);
    --colour-shade-2: hsl(32, 8%, 7%);
    --colour-shade-3: hsl(32, 6%, 10%);
    --colour-shade-4: hsl(32, 5%, 17%);
    --colour-shade-5: hsl(32, 4%, 19%);
    --colour-shade-6: hsl(32, 4%, 22%);
    --colour-shade-7: hsl(32, 4%, 33%);
    --colour-shade-8: hsl(32, 4%, 52%);
    --colour-shade-9: hsl(32, 4%, 60%);
    /* Background */
    --colour-bg-high-contrast: var(--colour-black);
    --colour-bg-lowered-contrast: var(--colour-shade-0);
    --colour-bg-elevated: var(--colour-black);
    --colour-bg-bold: var(--colour-brand-yellow);
    --colour-bg-muted: var(--colour-bg-high-contrast);
    /* Text */
    --colour-text: var(--colour-white);
    --colour-text-invert: var(--colour-black);
    --colour-text-muted: var(--colour-shade-8);
    --colour-text-disabled: var(--colour-shade-5);
    --colour-text-brand-pop: var(--colour-brand-red);
    --colour-text-error: hsl(285, 65%, 65%);
    --colour-user-text-selection: hsla(32, 30%, 65%, 0.5);
    --colour-text-link-underline: var(--colour-brand-red);
    /* Icon */
    --colour-icon-important: var(--colour-brand-red);
    --colour-icon-hover: var(--colour-shade-3);
    /* Elevation level shadows */
    --colour-elevation-low-subtle: rgba(0, 0, 0, 0.2);
    --colour-elevation-low: rgba(0, 0, 0, 0.25);
    --colour-elevation-middle-1: rgba(0, 0, 0, 0.2);
    --colour-elevation-middle-2: rgba(0, 0, 0, 0.6);
    --colour-elevation-high: rgba(0, 0, 0, 0.66);
    --colour-elevation-high-subtle: rgba(0, 0, 0, 0.52);
    /* UI Components */
    /* - Action */
    --colour-action-fill: var(--colour-black);
    --colour-action-border: var(--colour-shade-6);
    --colour-action-hover: var(--colour-shade-5);
    --colour-action-disabled: var(--colour-black);
    --colour-action-active: var(--colour-brand-yellow);
    --colour-action-text: var(--colour-text);
    --colour-action-text-invert: var(--colour-text-invert);
    /* - Primary action */
    --colour-action-primary: var(--colour-brand-yellow);
    --colour-action-primary-hover: hsl(48, 87%, 49%);
    --colour-action-primary-text: var(--colour-text-invert);
    /* - Raised action */
    --colour-action-raised-fill: var(--colour-shade-5);
    --colour-action-raised-hover: var(--colour-shade-6);
    --colour-action-raised-text: var(--colour-brand-yellow);
    /* - Ghost action */
    --colour-action-ghost-text: var(--colour-brand-yellow);
    /* - Favourite button */
    --colour-action-favourite-fill: hsl(0, 0%, 12%, 0.85);
    --colour-action-favourite-fill-hover: var(--colour-black);
    --colour-action-favourite-text: var(--colour-white);
    --colour-action-favourite-icon-fill: var(--colour-brand-red);
    --colour-action-not-favourite-icon-fill: transparent;
    --colour-action-not-favourite-icon-fill-hover: #EA482C80;
    --colour-action-not-favourite-icon-stroke: var(--colour-white);
    /* - Badge */
    --colour-badge-text: var(--colour-text);
    --colour-badge-icon: var(--colour-brand-red);
    --colour-badge-flat-fill: var(--colour-black);
    --colour-badge-subtle-fill: var(--colour-shade-5);
    --colour-badge-strong-fill: var(--colour-brand-cream);
    --colour-badge-strong-text: var(--colour-text-invert);
    --colour-badge-important-fill: var(--colour-brand-red-digi);
    --colour-badge-important-text: var(--colour-text);
    --colour-badge-success-fill: hsl(140, 70%, 25%);
    --colour-badge-success-text: var(--colour-text);
    --colour-badge-quantity-fill: var(--colour-brand-yellow);
    --colour-badge-quantity-text: var(--colour-text-invert);
    --colour-badge-vegetarian-fill: hsl(153, 27%, 25%);
    --colour-badge-vegetarian-icon: hsl(153, 54%, 42%);
    --colour-badge-vegan-fill: hsl(87, 26%, 25%);
    --colour-badge-vegan-icon: hsl(90, 46%, 48%);
    --colour-badge-gf-fill: hsl(43, 68%, 20%);
    --colour-badge-gf-icon: hsl(43, 100%, 50%);
    --colour-badge-df-fill: hsl(218, 35%, 25%);
    --colour-badge-df-icon: hsl(215, 54%, 62%);
    --colour-badge-cn-fill: hsl(18, 35%, 24%);
    --colour-badge-cn-icon: hsl(22, 58%, 54%);
    --colour-badge-exclusive-text: var(--colour-black);
    /* - Callout */
    --colour-callout-border: var(--colour-shade-6);
    --colour-callout-border-error: var(--colour-text-error);
    --colour-callout-icon: var(--colour-brand-red);
    /* - Card */
    --colour-card-border: var(--colour-shade-4);
    --colour-card-store-closed: var(--colour-shade-1);
    /* - Chip */
    --colour-chip-hover: hsla(32, 70%, 55%, 0.20);
    --colour-chip-choice-fill: var(--colour-brand-red-digi);
    --colour-chip-choice-text: var(--colour-text);
    --colour-chip-choice-text-active: var(--colour-text);
    --colour-chip-action-fill: var(--colour-shade-5);
    --colour-chip-action-text: var(--colour-brand-cream);
    --colour-chip-action-icon: var(--colour-brand-yellow);
    --colour-chip-filter-icon: var(--colour-text);
    --colour-chip-filter-text: var(--colour-text-invert);
    /* - Divider */
    --colour-divider: var(--colour-shade-6);
    --colour-divider-with-content: var(--colour-shade-5);
    --colour-divider-with-content-strong: var(--colour-brand-red-digi);
    --colour-divider-with-content-strong-text: var(--colour-text);
    /* - Text input */
    --colour-text-input-fill: var(--colour-shade-1);
    --colour-text-input-focus-border: var(--colour-shade-7);
    --colour-text-input-focus-underline: var(--colour-brand-yellow);
    --colour-text-input-muted: var(--colour-shade-7);
    --colour-text-input-error: var(--colour-text-error);
    --colour-text-input-icon: var(--colour-brand-red);
    --colour-text-input-on-muted-section-fill: var(--colour-text-input-fill);
    /* - Checkbox */
    --colour-checkbox-fill: var(--colour-brand-yellow);
    --colour-checkbox-checkmark: var(--colour-black);
    --colour-checkbox-outline: var(--colour-white);
    /* - Radio */
    --colour-radio-fill: var(--colour-brand-yellow);
    --colour-radio-checkmark: var(--colour-black);
    --colour-radio-outline: var(--colour-white);
    /* - Line item */
    --colour-line-item-secondary-bg: var(--colour-shade-2);
    /* - Modal */
    --colour-modal-shadow: hsla(30, 8%, 8%, 0.8);
    /* - Notice */
    --colour-notice-fill: var(--colour-brand-yellow);
    --colour-notice-text: var(--colour-text-invert);
    --colour-notice-raised-border: hsla(0, 0%, 12%, 0.08);
    --colour-notice-important-fill: hsl(285, 25%, 25%);
    --colour-notice-important-text: var(--colour-text);
    --colour-notice-strong-fill: var(--colour-brand-red-digi);
    --colour-notice-strong-text: var(--colour-text);
    --colour-notice-deal-fill: var(--colour-brand-yellow);
    --colour-notice-deal-text: var(--colour-text-invert);
    /* - Overlay */
    --colour-overlay-menu-shadow: hsla(32, 15%, 3%, 0.75);
    /* - Popover */
    --colour-popover-border: var(--colour-shade-6);
    /* - Link selector */
    --link-selector-hover: var(--colour-shade-6);
    /* - Bottom nav */
    --colour-bottom-nav-text: var(--colour-text-muted);
    --colour-bottom-nav-icon: var(--colour-text-muted);
    --colour-bottom-nav-active: var(--colour-brand-yellow);
    --colour-bottom-nav-text-active: var(--colour-text-invert);
    --colour-bottom-nav-icon-active: var(--colour-text);
    --colour-bottom-nav-tap-highlight: hsl(32, 4%, 19%);
    /* - Tree nav */
    --colour-tree-nav-link-hover: var(--colour-shade-6);
    --colour-tree-nav-link-active: var(--colour-brand-yellow);
    --colour-tree-nav-disclosure-button-icon: var(--colour-shade-7);
    --colour-tree-nav-disclosure-button-hover: var(--colour-shade-5);
    --colour-tree-nav-link-text: var(--colour-text);
    --colour-tree-nav-link-text-invert: var(--colour-text-invert);
    /* - Progress bar */
    --colour-progress-bar-bg: rgba(159, 137, 111, 0.4);
    --colour-progress-bar-fill: var(--colour-brand-red);
    --colour-progress-bar-loading-fill: var(--colour-brand-yellow);
    /* - Places autocomplete */
    --colour-places-autocomplete-dimming: hsla(32, 15%, 2%, 0.6);
    --colour-places-autocomplete-option-hover: var(--colour-shade-5);
    /* - Switch */
    --colour-switch-fill: var(--colour-shade-6);
    --colour-switch-active: var(--colour-brand-yellow);
    --colour-switch-toggle: var(--colour-white);
    --colour-switch-value-inactive: var(--colour-shade-8);
    --colour-switch-value-active: var(--colour-white);
    /* - Overflow toggle */
    --colour-overflow-toggle-icon: var(--colour-brand-red);
    /* - Tooltip */
    --colour-tooltip-fill: var(--colour-brand-cream);
    /* - Logo */
    --colour-logo-text: var(--colour-brand-cream);
    --colour-logo-base: var(--colour-brand-cream);
    --colour-logo-outline: var(--colour-black);
    --colour-logo-mouth-wrinkles: var(--colour-black);
    --colour-logo-body: var(--colour-brand-yellow);
    --colour-logo-tongue: var(--colour-brand-red);
    --colour-logo-speedlines: var(--colour-brand-cream);
    /* Content */
    /* - Collapse */
    --colour-collapse-divider: var(--colour-shade-3);
    --colour-collapse-open: var(--colour-shade-0);
    /* Focus */
    --colour-focus-outline: hsla(32, 15%, 50%, 0.3);
    --colour-focus-outline-large: hsla(32, 15%, 50%, 0.3);
    /* Image */
    --colour-image-placeholder: var(--colour-shade-7);
    --colour-image-product-placeholder: linear-gradient(0deg, hsl(32, 25%, 7%) 0%, hsl(32, 25%, 7%) 100%);
    --colour-image-background-fade: hsla(32, 15%, 5%, 0.4);
    --colour-image-background-fill: white;
    /* Gradients & special fills */
    --gradient-primary: linear-gradient(155.6deg, #FF3414 50.63%, #FF6515 95.78%);
    --gradient-exclusive-partner: linear-gradient(35deg, #E7CB68 10%, #F5E384 90%);
  }
}
:root {
  color-scheme: light;
}
:root:has(#colour-scheme-dark:checked) {
  color-scheme: dark;
}
:root:has(#colour-scheme-auto:checked) {
  color-scheme: light dark;
}
html {
  box-sizing: border-box;
}
body {
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-high-contrast);
  overflow-x: hidden;
}
body,
fieldset,
textarea {
  margin: 0px;
}
fieldset {
  padding: 0px;
}
hr,
fieldset {
  border: 0px;
}
*,
*:before,
*:after {
  box-sizing: inherit;
}
@media (hover: none) {
  *:not(input):not(textarea):not([contenteditable]) {
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
  }
}
::-moz-selection {
  background-color: hsla(32, 30%, 65%, 0.5);
  background-color: var(--colour-user-text-selection);
}
::selection {
  background-color: hsla(32, 30%, 65%, 0.5);
  background-color: var(--colour-user-text-selection);
}
button,
input,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  font-feature-settings: inherit;
  color: inherit;
}
input {
  margin: 0;
}
button,
[type=submit] {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}
form.is-hidden,
form.button_to {
  display: contents;
}
.grecaptcha-badge {
  visibility: hidden;
}
@font-face {
  font-family: "JT Olifer";
  src: url("/assets/static/delivereasy-ui/fonts/JTOlifer-Bold-0fa317d1.woff2");
  font-weight: bold;
  text-rendering: optimizeLegibility;
  font-feature-settings: normal;
}
@font-face {
  font-family: "Arial black (Display heading)";
  src: local("Arial black");
  font-style: bold;
  size-adjust: 86%;
  ascent-override: 83%;
  descent-override: 22%;
}
@font-face {
  font-family: "Founders Grotesk";
  src: url("/assets/static/delivereasy-ui/fonts/founders-grotesk-regular-d066e6e6.woff2");
  font-weight: normal;
  ascent-override: 84%;
  descent-override: 16%;
}
@font-face {
  font-family: "Founders Grotesk";
  src: url("/assets/static/delivereasy-ui/fonts/founders-grotesk-medium-e255f799.woff2");
  font-weight: 500;
  ascent-override: 84%;
  descent-override: 16%;
}
@font-face {
  font-family: "Founders Grotesk";
  src: url("/assets/static/delivereasy-ui/fonts/founders-grotesk-bold-d734b58e.woff2");
  font-weight: 600;
  ascent-override: 84%;
  descent-override: 16%;
}
body {
  font-family: "Founders Grotesk", sans-serif;
  color: hsl(0, 0%, 12%);
  color: var(--colour-text);
  font-size: 1.125rem;
}
h1, h2, h3, h4, h5 {
  font-weight: normal;
}
h1 {
  font-size: 2.875rem;
  margin: 1.5rem 0;
}
h2 {
  font-size: 2.25rem;
  margin: 1rem 0;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  h2 {
    font-size: 2.875rem;
  }
}
h3 {
  font-size: 1.75rem;
  margin: 1rem 0;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  h3 {
    font-size: 2.25rem;
  }
}
h4 {
  font-size: 1.375rem;
  margin: 1rem 0;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  h4 {
    font-size: 1.75rem;
  }
}
h5 {
  font-size: 1.25rem;
  margin: 0.5rem 0;
  font-weight: 500;
}
p {
  max-width: 65ch;
  line-height: 1.35;
  margin-top: 0;
}
p.has-short-line-length {
  max-width: 40ch;
}
ul {
  padding-inline-start: 1em;
  display: flex;
  flex-direction: column;
  gap: 1rem;
  line-height: 1.4;
}
ul.has-emoji-markers {
  list-style: none;
  padding-inline-start: 2em;
}
ul.has-emoji-markers li {
  position: relative;
}
ul.has-emoji-markers li::before {
  content: attr(data-marker);
  position: absolute;
  right: calc(100% + 1em);
}
b {
  font-weight: 500;
}
.content-formatted a, a.has-underline {
  text-decoration: none;
  border-bottom: 1px solid #EA482C;
  border-bottom: 1px solid var(--colour-text-link-underline);
}
@media (hover: hover) {
  .content-formatted a:hover, a.has-underline:hover {
    border-color: var(--color-text);
    text-decoration: none;
  }
}
a {
  color: inherit;
  text-decoration: none;
}
@media (hover: hover) {
  a:hover {
    text-decoration: underline;
    cursor: pointer;
  }
}
a.has-underline.is-normal-underline {
  border-color: hsl(0, 0%, 12%);
  border-color: var(--colour-text);
}
a.has-underline.is-muted-text {
  border-color: hsl(32, 6%, 46%);
  border-color: var(--colour-text-muted);
}
.is-display-heading {
  font-family: "JT Olifer", "Arial black (Display heading)", system-ui, sans-serif;
  color: #EA482C;
  color: var(--colour-text-brand-pop);
  text-transform: uppercase;
  letter-spacing: -0.02em;
  font-weight: bold;
  overflow-wrap: break-word;
}
.is-display-heading > .icon {
  vertical-align: middle;
  margin-block-end: 0.25em;
  margin-inline-end: 0.5em;
}
.is-hero-display-heading {
  font-family: "JT Olifer", "Arial black (Display heading)", system-ui, sans-serif;
  text-transform: uppercase;
  font-size: 6.8vmin;
  max-width: 20ch;
  font-weight: normal;
  line-height: 1;
  margin-bottom: 2rem;
  color: #EA482C;
  color: var(--colour-text-brand-pop);
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .is-hero-display-heading {
    margin-bottom: 2.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  :not(aside.column) .is-hero-display-heading {
    font-size: 5.8vmin;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  section.cover.is-two-columns :not(aside.column) .is-hero-display-heading {
    font-size: 3.2vmax;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  aside.column .is-hero-display-heading {
    font-size: 2.6vw;
  }
}
.category-section-heading {
  font-size: 1.375rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .category-section-heading {
    font-size: 2.25rem;
  }
}
.content-formatted [id] {
  scroll-margin-top: 5.25rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .content-formatted [id] {
    scroll-margin-top: 7.125rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .content-formatted [id] {
    scroll-margin-top: 7.125rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .content-formatted [id] {
    scroll-margin-top: 9.375rem;
  }
}
.container > :first-child, section > :first-child {
  margin-top: 0px;
}
.container > :last-child, section > :last-child {
  margin-bottom: 0px;
}
section {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  section {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  section {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  section {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  body > section, body > turbo-frame > section {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
section:not(.cover, .bold-section, .muted-section, .media-section) + section:not(.bold-section, .muted-section), header + section:not(.bold-section, .muted-section) {
  padding-top: 0px;
}
section:not(.bold-section, .muted-section).has-space-top {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  section:not(.bold-section, .muted-section).has-space-top {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  section:not(.bold-section, .muted-section).has-space-top {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  section:not(.bold-section, .muted-section).has-space-top {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  body > section:not(.bold-section, .muted-section).has-space-top, body > turbo-frame > section:not(.bold-section, .muted-section).has-space-top {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
section:not(.bold-section, .muted-section).has-space-top-above-tablet {
  padding-top: 0px;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  section:not(.bold-section, .muted-section).has-space-top-above-tablet {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 3/4) and (min-width: 768px) {
  section:not(.bold-section, .muted-section).has-space-top-above-tablet {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  section:not(.bold-section, .muted-section).has-space-top-above-tablet {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  section:not(.bold-section, .muted-section).has-space-top-above-tablet {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  body > section:not(.bold-section, .muted-section).has-space-top-above-tablet, body > turbo-frame > section:not(.bold-section, .muted-section).has-space-top-above-tablet {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
section:not(.bold-section, .muted-section).has-space-top-above-desktop {
  padding-top: 0px;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  section:not(.bold-section, .muted-section).has-space-top-above-desktop {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) and (min-aspect-ratio: 3/4) and (min-width: 768px) {
  section:not(.bold-section, .muted-section).has-space-top-above-desktop {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) and (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  section:not(.bold-section, .muted-section).has-space-top-above-desktop {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) and (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  section:not(.bold-section, .muted-section).has-space-top-above-desktop {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) and (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  body > section:not(.bold-section, .muted-section).has-space-top-above-desktop, body > turbo-frame > section:not(.bold-section, .muted-section).has-space-top-above-desktop {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
.container {
  width: 100%;
  box-sizing: border-box;
}
.container {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .container {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .container {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .container {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  :where(body, .app-view, header, .overlay:where(.is-menu, .is-sidebar)) > .container, :where(body, .app-view) > :where(section, turbo-frame, .cover, details.required-choice) > .container, :where(body, .app-view) > :where(turbo-frame, .restaurant-header, section#catalog) > section > .container, :where(body, .app-view) > section :where(.grid.has-aside, .column) > .container, :where(body, .app-view) > .cover > :where(.cover-content, header) > .container, :where(body, .app-view) > section .column > section > .container, :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > .container, :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > :where(a, .overlay-header) > .container {
    padding-left: 4.375rem;
    padding-right: 4.375rem;
  }
}
section.is-raised,
.container.is-raised {
  box-shadow: 0px 4px 28px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 4px 28px var(--colour-elevation-high);
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-elevated);
}
section.has-gradient,
.container.has-gradient {
  background: linear-gradient(rgba(255, 255, 255, 0), hsl(32, 70%, 99%));
  background: linear-gradient(rgba(255, 255, 255, 0), var(--colour-bg-high-contrast));
}
section.has-gradient-reversed,
.container.has-gradient-reversed {
  background: linear-gradient(hsl(32, 70%, 99%), rgba(255, 255, 255, 0));
  background: linear-gradient(var(--colour-bg-high-contrast), rgba(255, 255, 255, 0));
}
section.has-lowered-contrast,
.container.has-lowered-contrast {
  background-color: hsl(32, 45%, 96%);
  background-color: var(--colour-bg-lowered-contrast);
}
body > section.has-lowered-contrast,
body > .container.has-lowered-contrast {
  position: relative;
}
body > section.has-lowered-contrast::before,
body > .container.has-lowered-contrast::before {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 0px;
  box-shadow: 0px 0px 0px 100vh hsl(32, 45%, 96%);
  box-shadow: 0px 0px 0px 100vh var(--colour-bg-lowered-contrast);
  z-index: -1;
}
section.has-lowered-contrast-above-tablet,
.container.has-lowered-contrast-above-tablet {
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-high-contrast);
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  section.has-lowered-contrast-above-tablet,
  .container.has-lowered-contrast-above-tablet {
    background-color: hsl(32, 45%, 96%);
    background-color: var(--colour-bg-lowered-contrast);
  }
  body > section.has-lowered-contrast-above-tablet,
  body > .container.has-lowered-contrast-above-tablet {
    position: relative;
  }
  body > section.has-lowered-contrast-above-tablet::before,
  body > .container.has-lowered-contrast-above-tablet::before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 0px;
    box-shadow: 0px 0px 0px 100vh hsl(32, 45%, 96%);
    box-shadow: 0px 0px 0px 100vh var(--colour-bg-lowered-contrast);
    z-index: -1;
  }
}
section.has-lowered-contrast-above-desktop,
.container.has-lowered-contrast-above-desktop {
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-high-contrast);
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  section.has-lowered-contrast-above-desktop,
  .container.has-lowered-contrast-above-desktop {
    background-color: hsl(32, 45%, 96%);
    background-color: var(--colour-bg-lowered-contrast);
  }
  body > section.has-lowered-contrast-above-desktop,
  body > .container.has-lowered-contrast-above-desktop {
    position: relative;
  }
  body > section.has-lowered-contrast-above-desktop::before,
  body > .container.has-lowered-contrast-above-desktop::before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 0px;
    box-shadow: 0px 0px 0px 100vh hsl(32, 45%, 96%);
    box-shadow: 0px 0px 0px 100vh var(--colour-bg-lowered-contrast);
    z-index: -1;
  }
}
section.has-lowered-contrast-below-mobile,
.container.has-lowered-contrast-below-mobile {
  background-color: hsl(32, 45%, 96%);
  background-color: var(--colour-bg-lowered-contrast);
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  section.has-lowered-contrast-below-mobile,
  .container.has-lowered-contrast-below-mobile {
    background-color: hsl(32, 70%, 99%);
    background-color: var(--colour-bg-high-contrast);
  }
}
section.has-lowered-contrast-below-tablet,
.container.has-lowered-contrast-below-tablet {
  background-color: hsl(32, 45%, 96%);
  background-color: var(--colour-bg-lowered-contrast);
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  section.has-lowered-contrast-below-tablet,
  .container.has-lowered-contrast-below-tablet {
    background-color: hsl(32, 70%, 99%);
    background-color: var(--colour-bg-high-contrast);
  }
}
.fixed-bottom-element {
  position: fixed;
  bottom: 0;
  z-index: 5;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.fixed-whole-screen {
  position: fixed;
  width: 100%;
  height: 100%;
}
.width-constraint-wide, .width-constraint-extra-narrow, .width-constraint-narrow, .width-constraint {
  margin: 0 auto;
  width: 100%;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .width-constraint {
    max-width: 1200px;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .width-constraint-narrow {
    max-width: 65ch;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .width-constraint-extra-narrow {
    max-width: 45ch;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .width-constraint-wide {
    max-width: 1600px;
  }
}
header {
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-high-contrast);
}
header {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  header {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  header {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  header {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  body > header, body > turbo-frame > header {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}
header > .container {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  row-gap: 1.25rem;
}
header > .container > .logo {
  order: -1;
}
header > .container > .mini-tagline {
  margin-left: 1.5rem;
  font-size: 1.125rem;
}
header > .container > .mini-tagline b {
  color: #EA482C;
  color: var(--colour-text-brand-pop);
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  header > .container > .mini-tagline {
    margin-left: 2rem;
    font-size: 1.25rem;
  }
}
header .nav.has-title {
  display: flex;
  align-items: center;
  flex-grow: 1;
  min-width: 0;
}
header .nav.has-title > *:not(:last-child) {
  margin-right: 1rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  header .nav.has-title > *:not(:last-child) {
    margin-right: 1.5rem;
  }
}
header .nav.has-title > h1 {
  order: 2;
  margin: 0px;
  font-size: 1.75rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.25;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  header .nav.has-title > h1 {
    font-size: 2.25rem;
  }
}
header .nav.has-title .popover-sheet {
  order: 3;
}
header .nav.has-title .vertical-bar {
  width: 1px;
  align-self: stretch;
  background-color: hsl(32, 12%, 85%);
  background-color: var(--colour-divider);
}
header .nav.has-title .logo {
  display: none;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  header .nav.has-title .logo {
    display: inline-flex;
  }
}
header .popover-sheet.has-fulfilment-options {
  order: 6;
  width: 100%;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  header .popover-sheet.has-fulfilment-options {
    width: auto;
    order: 3;
    margin-left: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  header .popover-sheet.has-fulfilment-options {
    margin-left: 4.375rem;
  }
}
header .menu-and-search {
  order: 4;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-basis: min-content;
  flex-grow: 1;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  header .menu-and-search {
    gap: 1.5rem;
    margin-left: 1.5rem;
  }
}
header .menu-and-search .popover-sheet {
  max-width: 35ch;
}
@media (max-aspect-ratio: 1/1), (max-width: 1599.98px) {
  header .signin-button {
    display: none;
  }
}
header.is-sticky {
  position: sticky;
  top: 0px;
  z-index: 7;
}
header.is-muted {
  background-color: #FAEAD8;
  background-color: var(--colour-bg-muted);
}
header.has-divider {
  border-bottom: 1px solid hsl(32, 12%, 85%);
  border-bottom: 1px solid var(--colour-divider);
}
.stack {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.stack:where(:empty) {
  display: none !important;
}
.stack.has-gap-xs {
  gap: 0.5rem;
}
.stack.has-gap-md {
  gap: 1.5rem;
}
.stack.has-gap-lg {
  gap: 2rem;
}
.stack.has-gap-xl {
  gap: 2.5rem;
}
.grid {
  display: grid;
  padding: 0px;
}
.grid .column > section:first-of-type {
  padding-top: 0px;
}
.grid .column.has-section-dividers > section:not(:last-of-type) {
  border-bottom: 1px solid hsl(32, 12%, 85%);
  border-bottom: 1px solid var(--colour-divider);
}
.grid .column.has-section-dividers-below-mobile > section:not(:last-of-type) {
  border-bottom: 1px solid hsl(32, 12%, 85%);
  border-bottom: 1px solid var(--colour-divider);
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .grid .column.has-section-dividers-below-mobile > section:not(:last-of-type) {
    border-bottom: revert;
  }
}
.grid .column.has-container-spacing-top {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .grid .column.has-container-spacing-top {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .grid .column.has-container-spacing-top {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .grid .column.has-container-spacing-top {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  body > .grid .column.has-container-spacing-top, body > turbo-frame > .grid .column.has-container-spacing-top {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
.grid .column.has-container-spacing-top-above-tablet {
  padding-top: 0px;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .grid .column.has-container-spacing-top-above-tablet {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .grid .column.has-container-spacing-top-above-tablet {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .grid .column.has-container-spacing-top-above-tablet {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .grid .column.has-container-spacing-top-above-tablet {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  body > .grid .column.has-container-spacing-top-above-tablet, body > turbo-frame > .grid .column.has-container-spacing-top-above-tablet {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .grid .column.has-container-spacing-top-above-tablet {
    padding-top: 4.375rem;
  }
}
.grid .column.has-container-spacing-top-above-desktop {
  padding-top: 0px;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .grid .column.has-container-spacing-top-above-desktop {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) and (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .grid .column.has-container-spacing-top-above-desktop {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) and (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .grid .column.has-container-spacing-top-above-desktop {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) and (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .grid .column.has-container-spacing-top-above-desktop {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) and (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  body > .grid .column.has-container-spacing-top-above-desktop, body > turbo-frame > .grid .column.has-container-spacing-top-above-desktop {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .grid .column.has-container-spacing-top-above-desktop {
    padding-top: 4.375rem;
  }
}
.grid.has-2-breaking-columns {
  grid-template-columns: 1fr;
  gap: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .grid.has-2-breaking-columns.has-reversed-order-above-tablet > :last-child {
    order: -1;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .grid.has-2-breaking-columns {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 1.5rem;
    gap: 1.5rem;
  }
}
.grid.has-3-breaking-columns {
  grid-template-columns: 1fr;
  gap: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .grid.has-3-breaking-columns {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 1.5rem;
    gap: 1.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .grid.has-3-breaking-columns {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 1.5rem;
    gap: 1.5rem;
  }
}
.grid.has-4-breaking-columns {
  grid-template-columns: 1fr;
  gap: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .grid.has-4-breaking-columns {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 1.5rem;
    gap: 1.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .grid.has-4-breaking-columns {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 1.5rem;
    gap: 1.5rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .grid.has-4-breaking-columns {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 1.5rem;
    gap: 1.5rem;
  }
}
.grid.has-5-breaking-columns {
  grid-template-columns: 1fr;
  gap: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .grid.has-5-breaking-columns {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 1.5rem;
    gap: 1.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .grid.has-5-breaking-columns {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 1.5rem;
    gap: 1.5rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .grid.has-5-breaking-columns {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 1.5rem;
    gap: 1.5rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 2048px) {
  .grid.has-5-breaking-columns {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-gap: 2rem;
    gap: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .grid.has-wide-gutters {
    -moz-column-gap: 2rem;
         column-gap: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .grid.has-wide-gutters {
    -moz-column-gap: 4.375rem;
         column-gap: 4.375rem;
  }
}
.grid.has-aside {
  grid-template-columns: 1fr;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .grid.has-aside {
    grid-template-columns: 2fr minmax(380px, 1fr);
  }
  .grid.has-aside.has-container-spacing {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) and (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .grid.has-aside.has-container-spacing {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) and (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .grid.has-aside.has-container-spacing {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) and (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .grid.has-aside.has-container-spacing {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) and (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  :where(body, .app-view, header, .overlay:where(.is-menu, .is-sidebar)) > .grid.has-aside.has-container-spacing, :where(body, .app-view) > :where(section, turbo-frame, .cover, details.required-choice) > .grid.has-aside.has-container-spacing, :where(body, .app-view) > :where(turbo-frame, .restaurant-header, section#catalog) > section > .grid.has-aside.has-container-spacing, :where(body, .app-view) > section :where(.grid.has-aside, .column) > .grid.has-aside.has-container-spacing, :where(body, .app-view) > .cover > :where(.cover-content, header) > .grid.has-aside.has-container-spacing, :where(body, .app-view) > section .column > section > .grid.has-aside.has-container-spacing, :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > .grid.has-aside.has-container-spacing, :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > :where(a, .overlay-header) > .grid.has-aside.has-container-spacing {
    padding-left: 4.375rem;
    padding-right: 4.375rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .grid.has-aside.has-aside--left {
    grid-template-columns: minmax(380px, 1fr) 2fr;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .grid.has-aside .column > .is-sticky-column {
    position: sticky;
    top: 0;
  }
  .grid.has-aside .column > .is-sticky-column {
    padding-top: 1.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) and (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .grid.has-aside .column > .is-sticky-column {
    padding-top: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) and (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .grid.has-aside .column > .is-sticky-column {
    padding-top: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) and (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .grid.has-aside .column > .is-sticky-column {
    padding-top: 2.5rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .grid.has-aside .column > .is-sticky-column {
    padding-block-start: 4.375rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .grid.has-aside.has-grid-gutters {
    gap: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .grid.has-aside.has-grid-gutters {
    gap: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .grid.has-aside.has-grid-gutters {
    gap: 4.375rem;
  }
}
.product-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 0.25rem;
  gap: 0.25rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .product-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 0.5rem;
  }
  .product-grid {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .product-grid {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .product-grid {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .product-grid {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  :where(body, .app-view, header, .overlay:where(.is-menu, .is-sidebar)) > .product-grid, :where(body, .app-view) > :where(section, turbo-frame, .cover, details.required-choice) > .product-grid, :where(body, .app-view) > :where(turbo-frame, .restaurant-header, section#catalog) > section > .product-grid, :where(body, .app-view) > section :where(.grid.has-aside, .column) > .product-grid, :where(body, .app-view) > .cover > :where(.cover-content, header) > .product-grid, :where(body, .app-view) > section .column > section > .product-grid, :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > .product-grid, :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > :where(a, .overlay-header) > .product-grid {
    padding-left: 4.375rem;
    padding-right: 4.375rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .product-grid {
    grid-template-columns: repeat(5, 1fr);
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 2048px) {
  .product-grid {
    grid-template-columns: repeat(6, 1fr);
  }
}
@media (max-aspect-ratio: 3/4), (max-width: 767.98px) {
  .product-grid.is-category-preview > :nth-child(n+7) {
    display: none;
  }
}
@media (max-aspect-ratio: 1/1), (max-width: 1599.98px) {
  .product-grid.is-category-preview > :nth-child(n+9) {
    display: none;
  }
}
@media (max-aspect-ratio: 1/1), (max-width: 2047.98px) {
  .product-grid.is-category-preview > :nth-child(n+11) {
    display: none;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 2048px) {
  .product-grid.is-category-preview > :nth-child(n+13) {
    display: none;
  }
}
.grid.has-gapped-rows {
  gap: 0.75rem;
}
.grid.has-gapped-rows-tiny {
  gap: 0.25rem;
}
.grid.has-gapped-rows-medium {
  gap: 1.5rem;
}
.breadcrumbs {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.breadcrumbs > .icon {
  font-size: 0.625rem;
}
.breadcrumbs > a, .breadcrumbs > span {
  text-wrap: nowrap;
  padding-block: 0.4375rem;
}
.logo {
  display: inline-block;
  text-decoration: none;
  height: 1.875rem;
  width: 11.125rem;
  max-width: 100%;
}
.logo > img,
.logo > svg {
  height: 1.875rem;
  width: 11.125rem;
  max-width: 100%;
}
.logo > svg path {
  shape-rendering: geometricPrecision;
}
.logo > svg.delivereasy-horizontal-rgb-optical-cut > .logo-text {
  fill: #EA482C;
  fill: var(--colour-logo-text);
}
.logo > svg.delivereasy-horizontal-rgb-optical-cut > .logo-base {
  fill: #FAEAD8;
  fill: var(--colour-logo-base);
}
.logo > svg.delivereasy-horizontal-rgb-optical-cut > .logo-outline {
  fill: hsl(0, 0%, 12%);
  fill: var(--colour-logo-outline);
}
.logo > svg.delivereasy-horizontal-rgb-optical-cut > .logo-mouth-wrinkles {
  fill: hsl(0, 0%, 12%);
  fill: var(--colour-logo-mouth-wrinkles);
}
.logo > svg.delivereasy-horizontal-rgb-optical-cut > .logo-body {
  fill: hsl(49, 93%, 52%);
  fill: var(--colour-logo-body);
}
.logo > svg.delivereasy-horizontal-rgb-optical-cut > .logo-tongue {
  fill: #EA482C;
  fill: var(--colour-logo-tongue);
}
.logo > svg.delivereasy-horizontal-rgb-optical-cut > .logo-speedlines {
  fill: hsl(0, 0%, 12%);
  fill: var(--colour-logo-speedlines);
}
.icon {
  flex-shrink: 0;
}
.icon.has-fill-important {
  color: #EA482C;
  color: var(--colour-icon-important);
}
.streamline-icon,
.custom-icon > svg {
  width: 1em;
  height: 1em;
  fill: currentColor;
  line-height: 1em;
}
.streamline-icon.is-medium,
.custom-icon.is-medium {
  font-size: 1.75rem !important;
}
.streamline-icon.is-large,
.custom-icon.is-large {
  font-size: 2.875rem !important;
}
.streamline-icon.is-hero,
.custom-icon.is-hero {
  font-size: 5rem !important;
}
.custom-icon {
  display: inline-block;
}
.custom-icon > svg {
  display: block;
}
.custom-icon svg.animated-scooter {
  font-size: 1.25em;
}
:where(img, svg).responsive-image {
  max-width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
:where(img, svg).responsive-image[style*="--object-position"] {
  -o-object-position: var(--object-position);
     object-position: var(--object-position);
}
:where(img, svg).responsive-image[style*="--aspect-ratio"] {
  aspect-ratio: var(--aspect-ratio);
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  :where(img, svg).responsive-image[style*="--aspect-ratio-tablet"] {
    aspect-ratio: var(--aspect-ratio-tablet);
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  :where(img, svg).responsive-image[style*="--aspect-ratio-desktop"] {
    aspect-ratio: var(--aspect-ratio-desktop);
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  :where(img, svg).responsive-image[style*="--aspect-ratio-desktop-wide"] {
    aspect-ratio: var(--aspect-ratio-desktop-wide);
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 2048px) {
  :where(img, svg).responsive-image[style*="--aspect-ratio-desktop-super-wide"] {
    aspect-ratio: var(--aspect-ratio-desktop-super-wide);
  }
}
:where(img, svg).is-rounded {
  border-radius: 12px;
}
:where(img, svg, .thumbnail-image).is-circle {
  border-radius: 50%;
}
:where(img, svg).is-full-width {
  width: 100%;
}
.thumbnail-image {
  width: 40px;
  height: 40px;
  background-size: cover;
}
.thumbnail-image.is-grayscale {
  filter: grayscale(60%);
}
.button {
  width: 100%;
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-action-fill);
  color: hsl(0, 0%, 12%);
  color: var(--colour-action-text);
  font-weight: 500;
  font-size: 1.125rem;
  padding: 0.9375rem 1.5rem;
  min-width: 13ch;
  line-height: 1;
  border: 1px solid hsl(32, 15%, 88%);
  border: 1px solid var(--colour-action-border);
  border-radius: 5px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  vertical-align: top;
  gap: 0.75em;
  transition-property: all;
  transition-duration: 0.1s;
  transition-timing-function: ease-in-out;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .button {
    width: auto;
  }
}
@media (hover: hover) {
  .button {
    cursor: pointer;
  }
  .button:not(.is-loading):hover {
    background-color: hsl(32, 45%, 96%);
    background-color: var(--colour-action-hover);
    transform: translateY(-2px);
    text-decoration: none;
  }
  .button:not(.is-loading):active {
    transform: translateY(0px);
  }
}
.button.has-auto-width {
  width: auto;
}
.button.is-justified-left {
  justify-content: flex-start;
  padding: 1em;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .button.is-justified-left {
    justify-content: center;
    padding: 0.9375rem 1.5rem;
  }
}
.button.has-space-between {
  justify-content: space-between;
  text-align: left;
}
.button.is-full-width {
  width: 100%;
  transform: none;
}
@media (hover: none) {
  .button {
    cursor: default;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-touch-callout: none;
  }
}
.button:focus-visible {
  outline: 4px solid hsla(32, 15%, 50%, 0.3);
  outline: 4px solid var(--colour-focus-outline);
  outline-offset: 3px;
}
@supports not selector(:focus-visible) {
  .button:focus {
    outline: 4px solid hsla(32, 15%, 50%, 0.3);
    outline: 4px solid var(--colour-focus-outline);
    outline-offset: 3px;
  }
}
.button.is-primary {
  background-color: hsl(49, 93%, 52%);
  background-color: var(--colour-action-primary);
  border-color: hsl(49, 93%, 52%);
  border-color: var(--colour-action-primary);
  color: hsl(0, 0%, 12%);
  color: var(--colour-action-primary-text);
}
@media (hover: hover) {
  .button.is-primary:not(.is-loading):hover {
    background-color: hsl(48, 87%, 49%);
    background-color: var(--colour-action-primary-hover);
    border-color: hsl(48, 87%, 49%);
    border-color: var(--colour-action-primary-hover);
  }
}
.button.is-raised {
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-action-raised-fill);
  border-color: hsl(32, 70%, 99%);
  border-color: var(--colour-action-raised-fill);
  color: #EA482C;
  color: var(--colour-action-raised-text);
  box-shadow: 0px 4px 4px;
  box-shadow: 0px 0px 10px 0px rgba(57, 32, 0, 0.1), 0px 4px 6px 0px rgba(57, 32, 0, 0.22);
  box-shadow: 0px 0px 10px 0px var(--colour-elevation-middle-1), 0px 4px 6px 0px var(--colour-elevation-middle-2);
}
@media (hover: hover) {
  .button.is-raised:hover {
    background-color: hsl(32, 45%, 96%);
    background-color: var(--colour-action-raised-hover);
    border-color: hsl(32, 45%, 96%);
    border-color: var(--colour-action-raised-hover);
  }
}
.button.is-green {
  background-color: #97EDB4;
}
.button.is-compact {
  min-width: revert;
}
.button.is-icon-only {
  min-width: revert;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 50%;
  padding: 0;
  font-size: 0.875rem;
  flex-shrink: 0;
}
.button.is-icon-only.is-ghost {
  background-color: transparent;
  border-color: transparent;
  color: #EA482C;
  color: var(--colour-action-ghost-text);
  box-shadow: none;
}
@media (hover: hover) {
  .button.is-icon-only.is-ghost:hover {
    background-color: hsl(32, 45%, 96%);
    background-color: var(--colour-action-hover);
    border-color: hsl(32, 15%, 88%);
    border-color: var(--colour-action-border);
    color: hsl(0, 0%, 12%);
    color: var(--colour-text);
  }
}
@media (hover: hover) {
  .button.is-icon-only.is-ghost.is-raised:hover {
    background-color: hsl(32, 70%, 99%);
    background-color: var(--colour-action-raised-fill);
    border-color: hsl(32, 70%, 99%);
    border-color: var(--colour-action-raised-fill);
    box-shadow: 0px 4px 4px;
    box-shadow: 0px 0px 10px 0px rgba(57, 32, 0, 0.1), 0px 4px 6px 0px rgba(57, 32, 0, 0.22);
    box-shadow: 0px 0px 10px 0px var(--colour-elevation-middle-1), 0px 4px 6px 0px var(--colour-elevation-middle-2);
  }
}
.button.is-icon-only.has-large-icon {
  font-size: 1.125rem;
}
.button.is-icon-only.has-plain-icon {
  color: inherit;
}
.button.is-icon-only.is-tiny {
  font-size: 0.625rem;
  position: relative;
  border: none;
  background-color: transparent;
  background-color: initial;
}
.button.is-icon-only.is-tiny::before,
.button.is-icon-only.is-tiny .icon {
  transform: translateY(0px);
}
.button.is-icon-only.is-tiny::before {
  content: "";
  position: absolute;
  border-radius: inherit;
  width: 1.5rem;
  height: 1.5rem;
  border: 1px solid transparent;
}
.button.is-icon-only.is-tiny[disabled]:not(.is-loading)::before, .button.is-icon-only.is-tiny[disabled].is-loading.is-visually-disabled::before {
  background-color: hsl(32, 18%, 90%) !important;
  background-color: var(--colour-action-disabled) !important;
}
.button.is-icon-only.is-tiny:not(:is(.is-primary, .is-ghost))::before {
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-action-fill);
  border-color: hsl(32, 15%, 88%);
  border-color: var(--colour-action-border);
}
@media (hover: hover) {
  .button.is-icon-only.is-tiny:not(:is(.is-primary, .is-ghost)):not(.is-loading):hover::before {
    background-color: hsl(32, 45%, 96%);
    background-color: var(--colour-action-hover);
  }
}
.button.is-icon-only.is-tiny.is-primary {
  background-color: transparent;
  background-color: initial;
}
.button.is-icon-only.is-tiny.is-primary::before {
  background-color: hsl(49, 93%, 52%);
  background-color: var(--colour-action-primary);
  border-color: hsl(49, 93%, 52%);
  border-color: var(--colour-action-primary);
  color: hsl(0, 0%, 12%);
  color: var(--colour-action-primary-text);
}
@media (hover: hover) {
  .button.is-icon-only.is-tiny.is-primary:not(.is-loading):hover::before {
    background-color: hsl(48, 87%, 49%);
    background-color: var(--colour-action-primary-hover);
    border-color: hsl(48, 87%, 49%);
    border-color: var(--colour-action-primary-hover);
  }
}
.button.is-icon-only.is-tiny.is-raised {
  box-shadow: none;
}
.button.is-icon-only.is-tiny.is-raised::before {
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.05), 0px -2px 26px rgba(0, 0, 0, 0.05);
  box-shadow: 0px 4px 4px var(--colour-elevation-low), 0px -2px 26px var(--colour-elevation-low);
}
.button.is-icon-only.is-tiny.is-ghost {
  background-color: transparent;
  background-color: initial;
}
@media (hover: hover) {
  .button.is-icon-only.is-tiny.is-ghost:hover::before {
    background-color: hsl(32, 45%, 96%);
    background-color: var(--colour-action-hover);
    border-color: hsl(32, 15%, 88%);
    border-color: var(--colour-action-border);
    color: hsl(0, 0%, 12%);
    color: var(--colour-text);
  }
}
@media (hover: hover) {
  .button.is-icon-only.is-tiny::before,
  .button.is-icon-only.is-tiny .icon {
    transition-property: all;
    transition-duration: 0.1s;
    transition-timing-function: ease-in-out;
  }
  .button.is-icon-only.is-tiny:not(.is-loading):hover {
    transform: none;
  }
  .button.is-icon-only.is-tiny:not(.is-loading):hover::before, .button.is-icon-only.is-tiny:not(.is-loading):hover .icon {
    transform: translateY(-2px);
  }
  .button.is-icon-only.is-tiny:not(.is-loading):active::before, .button.is-icon-only.is-tiny:not(.is-loading):active .icon {
    transform: translateY(0px);
  }
}
.button.is-loading .icon {
  height: 1rem;
  display: flex;
  align-items: center;
}
.button.is-loading .hide-while-loading {
  display: none;
}
.button:not(.is-loading) .show-while-loading {
  display: none;
}
.button[disabled] {
  cursor: not-allowed;
  transform: none !important;
}
.button[disabled]:not(.is-loading), .button[disabled].is-loading.is-visually-disabled {
  color: hsl(32, 6%, 46%) !important;
  color: var(--colour-text-muted) !important;
  border-color: hsl(32, 15%, 88%) !important;
  border-color: var(--colour-action-border) !important;
}
.button[disabled]:not(.is-loading):not(.is-tiny):not(.is-favourite), .button[disabled].is-loading.is-visually-disabled:not(.is-tiny):not(.is-favourite) {
  background-color: hsl(32, 18%, 90%) !important;
  background-color: var(--colour-action-disabled) !important;
}
.button-group {
  display: inline-flex;
  width: 100%;
  gap: 0.5rem;
}
.button-group form, .button-group .popover-sheet {
  display: contents;
}
.is-floating-button {
  position: sticky;
  top: 0;
  padding: 0.75rem 0;
  z-index: 3;
  width: -moz-fit-content;
  width: fit-content;
}
.is-floating-button.is-floating-left {
  padding-left: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .is-floating-button.is-floating-left {
    padding-left: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .is-floating-button.is-floating-left {
    padding-left: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .is-floating-button.is-floating-left {
    padding-left: 2.5rem;
  }
}
.is-floating-button.is-floating-right {
  margin-left: auto;
}
.is-floating-button.is-floating-right {
  padding-right: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .is-floating-button.is-floating-right {
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .is-floating-button.is-floating-right {
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .is-floating-button.is-floating-right {
    padding-right: 2.5rem;
  }
}
.image-button > img {
  transition-property: all;
  transition-duration: 0.1s;
  transition-timing-function: ease-in-out;
}
.image-button:hover {
  text-decoration: none;
}
@media (hover: hover) {
  .image-button:hover > img {
    transform: translateY(-2px);
  }
  .image-button:active > img {
    transform: translateY(0px);
  }
}
.button.is-favourite {
  border: none;
  font-size: 1.125rem;
  white-space: nowrap;
}
.button.is-favourite.favourite {
  display: grid;
  grid-template-areas: "stack";
  background-color: hsl(0, 0%, 12%, 0.85);
  background-color: var(--colour-action-favourite-fill);
  color: hsl(32, 70%, 99%);
  color: var(--colour-action-favourite-text);
  height: 2.25rem;
  padding: 0.375rem 0.625rem;
  border-radius: 9999px;
  box-shadow: 0px 4px 28px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 4px 28px var(--colour-elevation-high);
}
.button.is-favourite.favourite > div {
  grid-area: stack;
  display: flex;
  gap: 0.5rem;
  overflow: hidden;
}
.button.is-favourite.favourite > div span {
  flex-grow: 1;
  align-content: center;
}
.button.is-favourite.favourite .icon {
  color: #EA482C;
  color: var(--colour-action-favourite-icon-fill);
}
.button.is-favourite:not(.favourite) {
  background-color: hsl(0, 0%, 12%, 0.85);
  background-color: var(--colour-action-favourite-fill);
  min-width: 2.25rem;
  width: 0;
  height: 2.25rem;
  border-radius: 50%;
  padding: 0;
  flex-shrink: 0;
}
.button.is-favourite:not(.favourite) > .icon {
  color: transparent;
  color: var(--colour-action-not-favourite-icon-fill);
  stroke: hsl(32, 70%, 99%);
  stroke: var(--colour-action-not-favourite-icon-stroke);
  stroke-width: 3px;
}
.button.is-favourite:hover:not([disabled]) {
  background-color: hsl(0, 0%, 12%);
  background-color: var(--colour-action-favourite-fill-hover);
  transform: none;
  transform: initial;
}
.button.is-favourite:hover:not([disabled]):not(.favourite) > .icon {
  color: #EA482C80;
  color: var(--colour-action-not-favourite-icon-fill-hover);
}
.button.is-favourite[disabled] {
  color: hsl(32, 70%, 99%) !important;
  color: var(--colour-action-favourite-text) !important;
}
.badge.is-quantity, .badge.is-large {
  font-size: 1.125rem;
}
.badge.is-quantity, .badge.is-dietary-choice-dairy-free, .badge.is-dietary-choice-contains-nuts, .badge.is-dietary-choice-gluten-free, .badge.is-dietary-choice-vegan, .badge.is-dietary-choice-vegetarian, .badge.is-exclusive-partner, .badge.is-success, .badge.is-important, .badge.is-strong, .badge.is-subtle, .badge.is-flat {
  padding: 0.375rem 0.625rem;
  border-radius: 9999px;
}
.badge.is-quantity:where(:empty), .badge.is-dietary-choice-dairy-free:where(:empty), .badge.is-dietary-choice-contains-nuts:where(:empty), .badge.is-dietary-choice-gluten-free:where(:empty), .badge.is-dietary-choice-vegan:where(:empty), .badge.is-dietary-choice-vegetarian:where(:empty), .badge.is-exclusive-partner:where(:empty), .badge.is-success:where(:empty), .badge.is-important:where(:empty), .badge.is-strong:where(:empty), .badge.is-subtle:where(:empty), .badge.is-flat:where(:empty) {
  display: none !important;
}
.badge {
  font-size: 1rem;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: hsl(0, 0%, 12%);
  color: var(--colour-badge-text);
  font-weight: normal;
}
.badge > .icon {
  color: #EA482C;
  color: var(--colour-badge-icon);
}
.badge.is-flat {
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-badge-flat-fill);
}
.badge.is-flat > .icon {
  color: inherit;
}
.badge.is-subtle {
  background-color: hsl(32, 25%, 93%);
  background-color: var(--colour-badge-subtle-fill);
}
.badge.is-subtle > .icon {
  color: inherit;
}
.badge.is-strong {
  background-color: hsl(32, 6%, 34%);
  background-color: var(--colour-badge-strong-fill);
  color: hsl(32, 70%, 99%);
  color: var(--colour-badge-strong-text);
}
.badge.is-strong > .icon {
  color: inherit;
}
.badge.is-important {
  background-color: #EA482C;
  background-color: var(--colour-badge-important-fill);
  color: hsl(32, 70%, 99%);
  color: var(--colour-badge-important-text);
}
.badge.is-important > .icon {
  color: inherit;
}
.badge.is-success {
  background-color: hsl(140, 70%, 76%);
  background-color: var(--colour-badge-success-fill);
  color: hsl(0, 0%, 12%);
  color: var(--colour-badge-success-text);
}
.badge.is-success > .icon {
  color: inherit;
}
.badge.is-exclusive-partner {
  background: linear-gradient(35deg, #E7CB68 10%, #F5E384 90%);
  background: var(--gradient-exclusive-partner);
  color: hsl(0, 0%, 12%);
  color: var(--colour-badge-exclusive-text);
  font-weight: 500;
}
.badge.is-exclusive-partner:not(.is-large) > svg {
  width: 1rem;
  height: 1rem;
}
.badge.is-exclusive-partner.is-large {
  padding: 0.5rem 0.875rem;
}
.badge.is-dietary-choice-vegetarian {
  background-color: hsl(153, 27%, 92%);
  background-color: var(--colour-badge-vegetarian-fill);
}
.badge.is-dietary-choice-vegetarian > .icon {
  color: hsl(153, 54%, 42%);
  color: var(--colour-badge-vegetarian-icon);
}
.badge.is-dietary-choice-vegan {
  background-color: hsl(87, 26%, 93%);
  background-color: var(--colour-badge-vegan-fill);
}
.badge.is-dietary-choice-vegan > .icon {
  color: hsl(90, 46%, 48%);
  color: var(--colour-badge-vegan-icon);
}
.badge.is-dietary-choice-vegan ~ .badge.is-dietary-choice-vegetarian {
  display: none !important;
}
.badge.is-dietary-choice-gluten-free {
  background-color: hsl(43, 68%, 93%);
  background-color: var(--colour-badge-gf-fill);
}
.badge.is-dietary-choice-gluten-free > .icon {
  color: hsl(43, 100%, 50%);
  color: var(--colour-badge-gf-icon);
}
.badge.is-dietary-choice-contains-nuts {
  background-color: hsl(18, 100%, 95%);
  background-color: var(--colour-badge-cn-fill);
}
.badge.is-dietary-choice-contains-nuts > .icon {
  color: hsl(22, 100%, 46%);
  color: var(--colour-badge-cn-icon);
}
.badge.is-dietary-choice-dairy-free {
  background-color: hsl(218, 35%, 94%);
  background-color: var(--colour-badge-df-fill);
}
.badge.is-dietary-choice-dairy-free > .icon {
  color: hsl(215, 54%, 62%);
  color: var(--colour-badge-df-icon);
}
.badge.is-quantity {
  background-color: hsl(49, 93%, 52%);
  background-color: var(--colour-badge-quantity-fill);
  color: hsl(0, 0%, 12%);
  color: var(--colour-badge-quantity-text);
  padding: 0.25rem 0.625rem;
  gap: 0.25rem;
}
.badge.is-quantity:not(:empty):not(.is-round)::before {
  content: "×";
}
.badge.is-quantity:where(:empty) {
  display: none !important;
}
.badge.is-quantity > .icon {
  color: #EA482C;
  color: var(--colour-badge-icon);
}
.badge.is-round {
  font-size: 1rem;
  min-width: 1.875rem;
  height: 1.875rem;
  border-radius: 50%;
  justify-content: center;
  padding: 0;
}
.badge.is-round.is-tiny {
  min-width: 1.5rem;
  height: 1.5rem;
}
a.badge:where(:focus, :hover) {
  background-color: hsl(32, 25%, 93%);
  background-color: var(--link-selector-hover);
  box-shadow: 0px 0px 0px 8px hsl(32, 25%, 93%);
  box-shadow: 0px 0px 0px 8px var(--link-selector-hover);
  border-radius: 3px;
}
@media (hover: none) {
  a.badge {
    cursor: default;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-touch-callout: none;
  }
}
a.badge:hover {
  text-decoration: none;
}
:root {
  --bottom-nav-height: 4.75rem;
}
@keyframes menu-item-tap {
  0% {
    background-color: transparent;
    transform: translate(-50%, -50%) scale(0.5);
  }
  50% {
    background-color: hsla(32, 77%, 91%, 0.6);
    background-color: var(--colour-bottom-nav-tap-highlight);
  }
  100% {
    background-color: transparent;
    transform: translate(-50%, -50%) scale(1);
  }
}
menu.bottom-nav {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(0px, 100%), 1fr));
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  background: hsl(32, 70%, 99%);
  background: var(--colour-bg-high-contrast);
  block-size: 4.75rem;
  block-size: var(--bottom-nav-height);
  list-style: none;
  overflow: hidden;
  position: fixed;
  inset-inline: 0;
  inset-block-end: 0;
  z-index: 7;
  box-shadow: 0px 4px 28px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 4px 28px var(--colour-elevation-high);
}
menu.bottom-nav li {
  --evenly-divisible-pixels: 2px;
  inline-size: round(100%, 2px);
  inline-size: round(100%, var(--evenly-divisible-pixels));
}
menu.bottom-nav li a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  block-size: 100%;
  text-decoration: none;
  font-size: 0.875rem;
  position: relative;
  border-radius: 5px;
  gap: 4px;
}
@media (hover: none) {
  menu.bottom-nav li a {
    cursor: default;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-touch-callout: none;
  }
}
menu.bottom-nav li a > * {
  z-index: 1;
}
menu.bottom-nav li a .icon {
  font-size: 1.125rem;
  color: hsl(32, 6%, 46%);
  color: var(--colour-bottom-nav-icon);
  transition: color 0.1s;
}
menu.bottom-nav li a > div {
  position: relative;
}
menu.bottom-nav li a > div .badge.is-quantity.is-tiny {
  position: absolute;
  inset-inline-end: -0.875rem;
  inset-block-start: -0.75rem;
  min-width: 1.25rem;
  height: 1.25rem;
}
menu.bottom-nav li a > span {
  padding-block: 0.1875rem;
  padding-inline: 0.4375rem;
  color: hsl(32, 6%, 46%);
  color: var(--colour-bottom-nav-text);
  transition: background-color 0.1s;
  border-radius: 9999px;
}
menu.bottom-nav li a::before {
  content: "";
  position: absolute;
  block-size: 140%;
  inset-block-start: 50%;
  inset-inline-start: 50%;
  background-color: transparent;
  transform: translate(-50%, -50%) scale(0.5);
  aspect-ratio: 1/1;
  border-radius: 9999px;
}
menu.bottom-nav li a:hover::before {
  animation: 0.32s menu-item-tap ease-out;
}
menu.bottom-nav li a:active::before {
  transition-duration: 0.32s;
  transition-timing-function: ease-out;
  transition-property: background-color, transform;
  background-color: hsla(32, 77%, 91%, 0.6);
  background-color: var(--colour-bottom-nav-tap-highlight);
  transform: translate(-50%, -50%) scale(1);
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  menu.bottom-nav {
    display: none;
  }
}
@media (max-aspect-ratio: 3/4), (max-width: 1023.98px) {
  body:has(menu.bottom-nav) .fixed-bottom-element {
    bottom: 4.75rem;
    bottom: var(--bottom-nav-height);
  }
}
.app-view {
  overflow-y: auto;
  overscroll-behavior-y: contain;
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-high-contrast);
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .app-view:not(#cart) {
    display: none;
  }
  .app-view[style*="--cart-height-offset-desktop"] {
    max-height: calc(100vh - 0 * 1px);
    max-height: calc(100vh - var(--cart-height-offset-desktop, 0) * 1px);
  }
}
@media (max-aspect-ratio: 3/4), (max-width: 1023.98px) {
  .app-view {
    position: fixed;
    inset-block-start: 0;
    inset-block-end: 4.75rem;
    inset-block-end: var(--bottom-nav-height);
    inset-inline: 0;
    display: flex;
    flex-direction: column;
    z-index: 7;
    box-shadow: 0 4.75rem 0 0 hsl(32, 70%, 99%);
    box-shadow: 0 var(--bottom-nav-height) 0 0 var(--colour-bg-high-contrast);
  }
  .app-view:has(.popover-sheet.is-active) {
    z-index: 9;
  }
  body:has(menu.bottom-nav) section.catalog {
    padding-bottom: 4.75rem;
    padding-bottom: var(--bottom-nav-height);
  }
  body:not(:has(menu.bottom-nav)) .app-view {
    inset: 0;
  }
  body:not([data-active-bottom-nav-view=shop]) .app-view#shop:not(.is-active) {
    display: none;
  }
  body[data-active-bottom-nav-view=shop] menu a[data-view-name=shop] .icon {
    color: hsl(0, 0%, 12%);
    color: var(--colour-bottom-nav-icon-active);
  }
  body[data-active-bottom-nav-view=shop] menu a[data-view-name=shop] > span {
    color: hsl(0, 0%, 12%);
    color: var(--colour-bottom-nav-text-active);
    background-color: hsl(49, 93%, 52%);
    background-color: var(--colour-bottom-nav-active);
  }
  body:not([data-active-bottom-nav-view=categories]) .app-view#categories:not(.is-active) {
    display: none;
  }
  body[data-active-bottom-nav-view=categories] menu a[data-view-name=categories] .icon {
    color: hsl(0, 0%, 12%);
    color: var(--colour-bottom-nav-icon-active);
  }
  body[data-active-bottom-nav-view=categories] menu a[data-view-name=categories] > span {
    color: hsl(0, 0%, 12%);
    color: var(--colour-bottom-nav-text-active);
    background-color: hsl(49, 93%, 52%);
    background-color: var(--colour-bottom-nav-active);
  }
  body:not([data-active-bottom-nav-view=search]) .app-view#search:not(.is-active) {
    display: none;
  }
  body[data-active-bottom-nav-view=search] menu a[data-view-name=search] .icon {
    color: hsl(0, 0%, 12%);
    color: var(--colour-bottom-nav-icon-active);
  }
  body[data-active-bottom-nav-view=search] menu a[data-view-name=search] > span {
    color: hsl(0, 0%, 12%);
    color: var(--colour-bottom-nav-text-active);
    background-color: hsl(49, 93%, 52%);
    background-color: var(--colour-bottom-nav-active);
  }
  body:not([data-active-bottom-nav-view=cart]) .app-view#cart:not(.is-active) {
    display: none;
  }
  body[data-active-bottom-nav-view=cart] menu a[data-view-name=cart] .icon {
    color: hsl(0, 0%, 12%);
    color: var(--colour-bottom-nav-icon-active);
  }
  body[data-active-bottom-nav-view=cart] menu a[data-view-name=cart] > span {
    color: hsl(0, 0%, 12%);
    color: var(--colour-bottom-nav-text-active);
    background-color: hsl(49, 93%, 52%);
    background-color: var(--colour-bottom-nav-active);
  }
}
.chip.is-action, .chip.is-choice {
  display: inline-flex;
  align-items: center;
  border-radius: 2em;
  text-decoration: none;
}
@media (hover: hover) {
  .chip.is-action:hover, .chip.is-choice:hover {
    text-decoration: none;
    box-shadow: inset 0 0 1em 1em hsla(32, 80%, 50%, 0.15);
    box-shadow: inset 0 0 1em 1em var(--colour-chip-hover);
  }
}
.chip.is-choice {
  font-size: 1.25rem;
}
.chip.is-choice > label {
  cursor: pointer;
  color: hsl(0, 0%, 12%);
  color: var(--colour-chip-choice-text);
  border-radius: inherit;
  padding: 0.5rem 1rem;
  line-height: 1;
  white-space: nowrap;
}
@media (hover: none) {
  .chip.is-choice > label {
    cursor: default;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-touch-callout: none;
  }
}
.chip.is-choice > input[type=radio] {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.chip.is-choice > input[type=radio]:checked + label {
  background-color: #d9381c;
  background-color: var(--colour-chip-choice-fill);
  color: hsl(32, 70%, 99%);
  color: var(--colour-chip-choice-text-active);
}
.chip.is-choice > input[type=radio]:active + label {
  box-shadow: inset 0 0 1em 1em hsla(0, 0%, 50%, 0.45);
}
@media (hover: hover) {
  .chip.is-choice input[type=radio]:focus-visible + label {
    outline: 4px solid hsla(32, 15%, 50%, 0.3);
    outline: 4px solid var(--colour-focus-outline);
    outline-offset: 3px;
  }
  @supports not selector(:focus-visible) {
    .chip.is-choice input[type=radio]:focus + label {
      outline: 4px solid hsla(32, 15%, 50%, 0.3);
      outline: 4px solid var(--colour-focus-outline);
      outline-offset: 3px;
    }
  }
}
.chip.is-action {
  font-size: 1rem;
  padding: 0.5rem 0.75rem;
  background-color: #FAEAD8;
  background-color: var(--colour-chip-action-fill);
  color: hsl(0, 0%, 12%);
  color: var(--colour-chip-action-text);
  line-height: 1;
}
.chip.is-action :not(:last-child) {
  margin-right: 0.5em;
}
.chip.is-action > .icon {
  color: #EA482C;
  color: var(--colour-chip-action-icon);
}
@media (hover: none) {
  .chip.is-action {
    cursor: default;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
  }
}
.chip.is-action:focus-visible {
  outline: 4px solid hsla(32, 15%, 50%, 0.3);
  outline: 4px solid var(--colour-focus-outline);
  outline-offset: 3px;
}
@supports not selector(:focus-visible) {
  .chip.is-action:focus {
    outline: 4px solid hsla(32, 15%, 50%, 0.3);
    outline: 4px solid var(--colour-focus-outline);
    outline-offset: 3px;
  }
}
.chip.is-filter,
.chip.is-filter-illustrated {
  display: inline-flex;
  position: relative;
}
.chip.is-filter label,
.chip.is-filter-illustrated label {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  padding: 0.625rem 1.25rem;
  border: 1px solid hsl(32, 15%, 88%);
  border: 1px solid var(--colour-action-border);
  border-radius: 6px;
  line-height: 1;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .chip.is-filter label,
  .chip.is-filter-illustrated label {
    padding: 0.75rem 1.5rem;
  }
}
@media (hover: hover) {
  .chip.is-filter label,
  .chip.is-filter-illustrated label {
    cursor: pointer;
  }
  .chip.is-filter label:hover,
  .chip.is-filter-illustrated label:hover {
    background-color: hsl(32, 45%, 96%);
    background-color: var(--colour-action-hover);
  }
}
.chip.is-filter input,
.chip.is-filter-illustrated input {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.chip.is-filter input:not([type=radio]) ~ label::before, .chip.is-filter input:not([type=radio]) ~ label::after,
.chip.is-filter-illustrated input:not([type=radio]) ~ label::before,
.chip.is-filter-illustrated input:not([type=radio]) ~ label::after {
  content: "";
  display: block;
  position: absolute;
  right: 0.5rem;
  height: 1rem;
  width: 1rem;
}
.chip.is-filter input:not([type=radio]) ~ label::before,
.chip.is-filter-illustrated input:not([type=radio]) ~ label::before {
  background-color: hsla(0, 100%, 16%, 0.38);
  border-radius: 9999px;
}
.chip.is-filter input:not([type=radio]) ~ label::after,
.chip.is-filter-illustrated input:not([type=radio]) ~ label::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 8 8'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%23fff' d='M.146 7.146a.5.5 0 0 0 .708.707L3.94 4.766a.083.083 0 0 1 .118 0l3.087 3.088a.5.5 0 0 0 .708-.707L4.767 4.06a.083.083 0 0 1 0-.118L7.854.853a.5.5 0 1 0-.708-.707L4.06 3.233a.083.083 0 0 1-.118 0L.854.146a.5.5 0 1 0-.708.707l3.087 3.088a.083.083 0 0 1 0 .118L.146 7.146Z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h8v8H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
  transform: scale(0.5);
}
.chip.is-filter input:checked ~ label,
.chip.is-filter-illustrated input:checked ~ label {
  background-color: hsl(49, 93%, 52%);
  background-color: var(--colour-action-active);
  border-color: hsl(49, 93%, 52%);
  border-color: var(--colour-action-active);
  color: hsl(0, 0%, 12%);
  color: var(--colour-chip-filter-text);
}
.chip.is-filter input:not(:checked) ~ label::before, .chip.is-filter input:not(:checked) ~ label::after,
.chip.is-filter-illustrated input:not(:checked) ~ label::before,
.chip.is-filter-illustrated input:not(:checked) ~ label::after {
  opacity: 0;
  visibility: hidden;
}
@media (hover: hover) {
  .chip.is-filter input:focus-visible + label,
  .chip.is-filter-illustrated input:focus-visible + label {
    border-color: transparent;
    outline: 4px solid hsla(32, 15%, 50%, 0.3);
    outline: 4px solid var(--colour-focus-outline);
    outline-offset: 3px;
  }
  @supports not selector(:focus-visible) {
    .chip.is-filter input:focus + label,
    .chip.is-filter-illustrated input:focus + label {
      outline: 4px solid hsla(32, 15%, 50%, 0.3);
      outline: 4px solid var(--colour-focus-outline);
      outline-offset: 3px;
    }
  }
}
@media (hover: hover) {
  button.chip.is-filter, .chip.is-filter-illustrated {
    outline: none;
  }
  button.chip.is-filter:focus-visible > label, .chip.is-filter-illustrated:focus-visible > label {
    border-color: transparent;
    outline: 4px solid hsla(32, 15%, 50%, 0.3);
    outline: 4px solid var(--colour-focus-outline);
    outline-offset: 3px;
  }
  @supports not selector(:focus-visible) {
    button.chip.is-filter:focus > label, .chip.is-filter-illustrated:focus > label {
      outline: 4px solid hsla(32, 15%, 50%, 0.3);
      outline: 4px solid var(--colour-focus-outline);
      outline-offset: 3px;
    }
  }
}
.chip.is-filter label > span {
  transition: transform 0.07s ease-in;
}
.chip.is-filter label::before, .chip.is-filter label::after {
  transition: opacity 0.075s ease-in, visibility 0.075s ease-in;
}
.chip.is-filter input:checked ~ label > span {
  transform: translateX(-0.625rem);
}
.chip.is-filter-illustrated label {
  width: 6.25rem;
  font-size: 0.875rem;
  flex-direction: column;
  white-space: nowrap;
}
.chip.is-filter-illustrated label img,
.chip.is-filter-illustrated label .image {
  width: 3.375rem;
  height: 3.375rem;
}
.chip.is-filter-illustrated label::before, .chip.is-filter-illustrated label::after {
  top: 0.5rem;
  left: 0.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .chip.is-filter-illustrated label {
    width: 8rem;
    font-size: 1rem;
  }
  .chip.is-filter-illustrated label img,
  .chip.is-filter-illustrated label .image {
    width: 5rem;
    height: 5rem;
  }
}
.chip.is-filter-illustrated.is-full-width, .chip.is-filter-illustrated.is-full-width label {
  width: 100%;
}
.chip.is-filter-illustrated.is-reset label::before,
.chip.is-filter-illustrated.is-reset label::after {
  content: normal;
  content: initial;
}
.chip.is-filter-illustrated.is-reset .image {
  color: hsl(0, 0%, 12%);
  color: var(--colour-chip-filter-icon);
  display: flex;
  align-items: center;
  justify-content: center;
}
.chip.is-filter-illustrated.is-reset .image > .icon {
  width: 1rem;
  height: 1rem;
}
.text-overflow-toggle label {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: hsl(0, 0%, 12%);
  color: var(--colour-text);
  padding: 1rem 0px;
  border-radius: 6px;
  cursor: pointer;
}
.text-overflow-toggle label .icon {
  font-size: 0.8em;
  color: #EA482C;
  color: var(--colour-overflow-toggle-icon);
}
.text-overflow-toggle p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: none;
  -webkit-line-clamp: var(--line-clamp, none);
  overflow: hidden;
}
.text-overflow-toggle input {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.text-overflow-toggle input:checked ~ p {
  -webkit-line-clamp: unset !important;
}
.text-overflow-toggle input:checked ~ label > span {
  display: none !important;
}
.text-overflow-toggle input:checked ~ label::after {
  content: "Collapse";
  content: var(--collapse-label, "Collapse");
}
@media (hover: hover) {
  .text-overflow-toggle input:focus-visible ~ label {
    border-color: transparent;
    outline: 4px solid hsla(32, 15%, 50%, 0.3);
    outline: 4px solid var(--colour-focus-outline);
    outline-offset: 3px;
  }
  @supports not selector(:focus-visible) {
    .text-overflow-toggle input:focus ~ label {
      outline: 4px solid hsla(32, 15%, 50%, 0.3);
      outline: 4px solid var(--colour-focus-outline);
      outline-offset: 3px;
    }
  }
}
fieldset legend, .textarea label, .select label, .text-input label, .quantity-input label {
  display: flex;
  padding-bottom: 0.5rem;
}
.textarea, .select, .text-input, .quantity-input {
  display: flex;
  flex-direction: column;
  font-size: 1.125rem;
  margin-bottom: 1.5rem;
  position: relative;
}
.textarea input, .select input, .text-input input, .quantity-input input,
.textarea textarea,
.select textarea,
.text-input textarea,
.quantity-input textarea,
.textarea select,
.select select,
.text-input select,
.quantity-input select {
  padding: 0.375rem 0.75rem;
  box-sizing: content-box;
  box-sizing: initial;
  border-width: 1px;
  border-radius: 5px;
  border-style: solid;
  border-color: transparent;
  outline: none;
  background-color: hsl(32, 25%, 93%);
  background-color: var(--colour-text-input-fill);
  box-shadow: inset 0px -1000px 0 -998px transparent;
  text-overflow: ellipsis;
  box-sizing: border-box;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  transition-property: border, background-color, box-shadow;
  transition-duration: 0.1s;
  transition-timing-function: ease-in-out;
}
section.muted-section .textarea input, section.muted-section .select input, section.muted-section .text-input input, section.muted-section .quantity-input input,
section.muted-section .textarea textarea,
section.muted-section .select textarea,
section.muted-section .text-input textarea,
section.muted-section .quantity-input textarea,
section.muted-section .textarea select,
section.muted-section .select select,
section.muted-section .text-input select,
section.muted-section .quantity-input select {
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-text-input-on-muted-section-fill);
}
.textarea input:focus, .select input:focus, .text-input input:focus, .quantity-input input:focus,
.textarea textarea:focus,
.select textarea:focus,
.text-input textarea:focus,
.quantity-input textarea:focus,
.textarea select:focus,
.select select:focus,
.text-input select:focus,
.quantity-input select:focus {
  border-color: hsl(32, 8%, 56%);
  border-color: var(--colour-text-input-focus-border);
}
.textarea input::-moz-placeholder, .select input::-moz-placeholder, .text-input input::-moz-placeholder, .quantity-input input::-moz-placeholder, .textarea textarea::-moz-placeholder, .select textarea::-moz-placeholder, .text-input textarea::-moz-placeholder, .quantity-input textarea::-moz-placeholder, .textarea select::-moz-placeholder, .select select::-moz-placeholder, .text-input select::-moz-placeholder, .quantity-input select::-moz-placeholder {
  color: hsl(32, 8%, 56%);
  color: var(--colour-text-input-muted);
  text-overflow: ellipsis;
}
.textarea input::placeholder, .select input::placeholder, .text-input input::placeholder, .quantity-input input::placeholder,
.textarea textarea::placeholder,
.select textarea::placeholder,
.text-input textarea::placeholder,
.quantity-input textarea::placeholder,
.textarea select::placeholder,
.select select::placeholder,
.text-input select::placeholder,
.quantity-input select::placeholder {
  color: hsl(32, 8%, 56%);
  color: var(--colour-text-input-muted);
  text-overflow: ellipsis;
}
.textarea > span, .select > span, .text-input > span, .quantity-input > span {
  position: relative;
}
.textarea > span input, .select > span input, .text-input > span input, .quantity-input > span input,
.textarea > span textarea,
.select > span textarea,
.text-input > span textarea,
.quantity-input > span textarea,
.textarea > span select,
.select > span select,
.text-input > span select,
.quantity-input > span select {
  width: 100%;
}
.has-error.textarea input, .has-error.select input, .has-error.text-input input, .has-error.quantity-input input,
.has-error.textarea textarea,
.has-error.select textarea,
.has-error.text-input textarea,
.has-error.quantity-input textarea,
.has-error.textarea select,
.has-error.select select,
.has-error.text-input select,
.has-error.quantity-input select {
  border-color: hsl(285, 65%, 50%);
  border-color: var(--colour-text-input-error);
}
.has-error.textarea input::-moz-selection, .has-error.select input::-moz-selection, .has-error.text-input input::-moz-selection, .has-error.quantity-input input::-moz-selection, .has-error.textarea textarea::-moz-selection, .has-error.select textarea::-moz-selection, .has-error.text-input textarea::-moz-selection, .has-error.quantity-input textarea::-moz-selection, .has-error.textarea select::-moz-selection, .has-error.select select::-moz-selection, .has-error.text-input select::-moz-selection, .has-error.quantity-input select::-moz-selection {
  background-color: hsl(285, 65%, 50%);
  background-color: var(--colour-text-input-error);
  color: hsl(32, 70%, 99%);
  color: var(--colour-text-invert);
}
.has-error.textarea input::selection, .has-error.select input::selection, .has-error.text-input input::selection, .has-error.quantity-input input::selection,
.has-error.textarea textarea::selection,
.has-error.select textarea::selection,
.has-error.text-input textarea::selection,
.has-error.quantity-input textarea::selection,
.has-error.textarea select::selection,
.has-error.select select::selection,
.has-error.text-input select::selection,
.has-error.quantity-input select::selection {
  background-color: hsl(285, 65%, 50%);
  background-color: var(--colour-text-input-error);
  color: hsl(32, 70%, 99%);
  color: var(--colour-text-invert);
}
.has-error.textarea input:focus, .has-error.select input:focus, .has-error.text-input input:focus, .has-error.quantity-input input:focus,
.has-error.textarea textarea:focus,
.has-error.select textarea:focus,
.has-error.text-input textarea:focus,
.has-error.quantity-input textarea:focus,
.has-error.textarea select:focus,
.has-error.select select:focus,
.has-error.text-input select:focus,
.has-error.quantity-input select:focus {
  box-shadow: inset 0px -1000px 0 -998px hsl(285, 65%, 50%);
  box-shadow: inset 0px -1000px 0 -998px var(--colour-text-input-error);
}
.has-hidden-label.textarea label, .has-hidden-label.select label, .has-hidden-label.text-input label, .has-hidden-label.quantity-input label {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.has-max-width.textarea span, .has-max-width.select span, .has-max-width.text-input span, .has-max-width.quantity-input span,
.has-max-width.textarea input,
.has-max-width.select input,
.has-max-width.text-input input,
.has-max-width.quantity-input input,
.has-max-width.textarea select,
.has-max-width.select select,
.has-max-width.text-input select,
.has-max-width.quantity-input select {
  max-width: 65ch;
}
.text-input input, .quantity-input input {
  line-height: 2;
}
.text-input input:focus, .quantity-input input:focus {
  box-shadow: inset 0px -1000px 0 -998px hsl(49, 93%, 52%);
  box-shadow: inset 0px -1000px 0 -998px var(--colour-text-input-focus-underline);
}
.text-input input[data-action*=clearInput], .quantity-input input[data-action*=clearInput] {
  transition-property: all;
  transition-duration: 0.1s;
  transition-timing-function: ease-in-out;
}
.text-input input[required]:not(:valid) + .input-controls [data-action*=clearInput], .quantity-input input[required]:not(:valid) + .input-controls [data-action*=clearInput] {
  opacity: 0;
  visibility: hidden;
}
.text-input input[type=search]::-ms-clear, .quantity-input input[type=search]::-ms-clear, .text-input input[type=search]::-ms-reveal, .quantity-input input[type=search]::-ms-reveal {
  display: none;
  width: 0;
  height: 0;
}
.text-input input[type=search]::-webkit-search-decoration, .quantity-input input[type=search]::-webkit-search-decoration, .text-input input[type=search]::-webkit-search-cancel-button, .quantity-input input[type=search]::-webkit-search-cancel-button, .text-input input[type=search]::-webkit-search-results-button, .quantity-input input[type=search]::-webkit-search-results-button, .text-input input[type=search]::-webkit-search-results-decoration, .quantity-input input[type=search]::-webkit-search-results-decoration {
  -webkit-appearance: none;
  appearance: none;
}
.text-input input[style*="--input-control-character-offset"], .quantity-input input[style*="--input-control-character-offset"] {
  padding-right: calc(var(--input-control-character-offset) * 1ch + 0.375rem * 2 + 1rem * 2);
}
.text-input.is-ghost input:not(:hover):not(:focus), .quantity-input input:not(:hover):not(:focus) {
  background-color: transparent;
  border-color: transparent;
}
.text-input.is-ghost input:focus, .quantity-input input:focus {
  box-shadow: none;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .text-input.is-inline, .is-inline.quantity-input {
    display: inline-block;
  }
}
.text-input.is-inline.has-large-initial-width input, .is-inline.has-large-initial-width.quantity-input input {
  width: 100%;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .text-input.is-inline.has-large-initial-width, .is-inline.has-large-initial-width.quantity-input {
    width: 100%;
    max-width: 45ch;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .text-input.is-inline.has-large-initial-width, .is-inline.has-large-initial-width.quantity-input {
    max-width: 65ch;
  }
}
.text-input .input-controls, .quantity-input .input-controls {
  position: absolute;
  bottom: 0;
  right: 0;
  height: calc(2em + 0.375rem * 2 + 2px);
  display: flex;
  align-items: center;
  padding: 0.375rem;
  gap: 0.375rem;
  pointer-events: none;
}
.text-input .input-controls > *, .quantity-input .input-controls > * {
  pointer-events: auto;
}
.text-input .input-controls .button, .quantity-input .input-controls .button {
  min-width: revert;
  max-height: 100%;
  padding-left: 1rem;
  padding-right: 1rem;
  border-radius: 9999px;
}
.text-input .helper, .quantity-input .helper,
.text-input .error,
.quantity-input .error {
  line-height: 1.25;
  margin-top: 0.5rem;
  text-align: left;
}
.text-input .helper, .quantity-input .helper {
  color: hsl(32, 6%, 46%);
  color: var(--colour-text-muted);
}
.text-input .error, .quantity-input .error {
  color: hsl(285, 65%, 50%);
  color: var(--colour-text-input-error);
  display: none;
}
.text-input.has-error .error, .has-error.quantity-input .error {
  display: block;
}
.text-input .StripeElement, .quantity-input .StripeElement {
  padding: 0.375rem 0.75rem;
  border-width: 1px;
  border-radius: 5px;
  border-style: solid;
  border-color: transparent;
  background-color: hsl(32, 25%, 93%);
  background-color: var(--colour-text-input-fill);
  box-shadow: inset 0px -1000px 0 -998px transparent;
  transition-property: all;
  transition-duration: 0.1s;
  transition-timing-function: ease-in-out;
}
.text-input .StripeElement--focus, .quantity-input .StripeElement--focus {
  border-color: hsl(32, 8%, 56%);
  border-color: var(--colour-text-input-focus-border);
  box-shadow: inset 0px -1000px 0 -998px hsl(49, 93%, 52%);
  box-shadow: inset 0px -1000px 0 -998px var(--colour-text-input-focus-underline);
}
.text-input .StripeElement--invalid, .quantity-input .StripeElement--invalid {
  border-color: hsl(285, 65%, 50%);
  border-color: var(--colour-text-input-error);
}
.text-input.has-max-width .StripeElement, .has-max-width.quantity-input .StripeElement {
  max-width: 65ch;
}
.select select {
  line-height: 2;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .select.is-inline {
    display: inline-block;
  }
}
.select .helper,
.select .error {
  line-height: 1.25;
  margin-top: 0.5rem;
  text-align: left;
}
.select .helper {
  color: hsl(32, 6%, 46%);
  color: var(--colour-text-muted);
}
.select .error {
  color: hsl(285, 65%, 50%);
  color: var(--colour-text-input-error);
  display: none;
}
.select.has-error .error {
  display: block;
}
.text-input.has-prefix-icon span, .has-prefix-icon.quantity-input span,
.select.has-prefix-icon span,
.text-input.has-end-icon span,
.has-end-icon.quantity-input span,
.select.has-end-icon span {
  position: relative;
  display: flex;
}
.text-input.has-prefix-icon span input, .has-prefix-icon.quantity-input span input,
.text-input.has-prefix-icon span textarea,
.has-prefix-icon.quantity-input span textarea,
.text-input.has-prefix-icon span select,
.has-prefix-icon.quantity-input span select,
.select.has-prefix-icon span input,
.select.has-prefix-icon span textarea,
.select.has-prefix-icon span select,
.text-input.has-end-icon span input,
.has-end-icon.quantity-input span input,
.text-input.has-end-icon span textarea,
.has-end-icon.quantity-input span textarea,
.text-input.has-end-icon span select,
.has-end-icon.quantity-input span select,
.select.has-end-icon span input,
.select.has-end-icon span textarea,
.select.has-end-icon span select {
  width: 100%;
}
.text-input.has-prefix-icon span > svg, .has-prefix-icon.quantity-input span > svg,
.select.has-prefix-icon span > svg,
.text-input.has-end-icon span > svg,
.has-end-icon.quantity-input span > svg,
.select.has-end-icon span > svg {
  font-size: 1.125rem;
  align-self: center;
  position: absolute;
  pointer-events: none;
  color: #EA482C;
  color: var(--colour-text-input-icon);
}
.text-input.has-prefix-icon.is-muted-icon span > svg, .has-prefix-icon.is-muted-icon.quantity-input span > svg,
.select.has-prefix-icon.is-muted-icon span > svg,
.text-input.has-end-icon.is-muted-icon span > svg,
.has-end-icon.is-muted-icon.quantity-input span > svg,
.select.has-end-icon.is-muted-icon span > svg {
  color: hsl(32, 8%, 56%);
  color: var(--colour-text-input-muted);
}
.text-input.has-prefix-icon span input, .has-prefix-icon.quantity-input span input,
.text-input.has-prefix-icon span textarea,
.has-prefix-icon.quantity-input span textarea,
.text-input.has-prefix-icon span select,
.has-prefix-icon.quantity-input span select,
.select.has-prefix-icon span input,
.select.has-prefix-icon span textarea,
.select.has-prefix-icon span select {
  padding-left: 2.625rem;
}
.text-input.has-prefix-icon svg:first-of-type, .has-prefix-icon.quantity-input svg:first-of-type,
.select.has-prefix-icon svg:first-of-type {
  left: 0.75rem;
}
.text-input.has-end-icon span input, .has-end-icon.quantity-input span input,
.text-input.has-end-icon span textarea,
.has-end-icon.quantity-input span textarea,
.text-input.has-end-icon span select,
.has-end-icon.quantity-input span select,
.select.has-end-icon span input,
.select.has-end-icon span textarea,
.select.has-end-icon span select {
  padding-right: 3.125rem;
}
.text-input.has-end-icon svg:last-of-type, .has-end-icon.quantity-input svg:last-of-type,
.select.has-end-icon svg:last-of-type {
  right: 1rem;
}
.quantity-input {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  gap: 0.25rem;
}
.quantity-input label {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.quantity-input input[type=number] {
  width: 2ch;
  display: inline-block;
  box-sizing: content-box;
  text-align: center;
  text-overflow: initial;
  -webkit-appearance: textfield;
     -moz-appearance: textfield;
          appearance: textfield;
  padding-left: 0.375rem;
  padding-right: 0.375rem;
}
.quantity-input input[type=number]::-webkit-inner-spin-button, .quantity-input input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
}
.quantity-input .button {
  vertical-align: baseline;
  vertical-align: initial;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .quantity-input {
    gap: 0.5rem;
  }
  .quantity-input input[type=number] {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}
.textarea textarea {
  max-width: 65ch;
  min-height: 5em;
  line-height: 1.5;
  resize: none;
}
.textarea.is-resizable textarea {
  resize: vertical;
}
.textarea .helper,
.textarea .error {
  line-height: 1.25;
  margin-top: 0.5rem;
  text-align: left;
}
.textarea .helper {
  color: hsl(32, 6%, 46%);
  color: var(--colour-text-muted);
}
.textarea .error {
  color: hsl(285, 65%, 50%);
  color: var(--colour-text-input-error);
  display: none;
}
.textarea.has-error .error {
  display: block;
}
.input-group {
  display: flex;
  flex-wrap: wrap;
}
.input-group > :not(:first-child) {
  margin-left: 1rem;
}
.input-group .text-input, .input-group .quantity-input {
  flex-grow: 1;
}
.checkbox {
  margin-bottom: 0.5rem;
}
.checkbox label {
  position: relative;
  display: inline-block;
  line-height: 1.5;
  padding-left: 0.5rem;
  padding-bottom: 0.5rem;
  margin-left: 1rem;
}
.checkbox label::before, .checkbox label::after {
  content: "";
  width: 1rem;
  height: 1rem;
  position: absolute;
  right: 100%;
  top: calc(50% - (0.25rem) - (0.5rem));
  box-sizing: border-box;
}
.checkbox label::before {
  border: 0.125rem solid hsl(0, 0%, 12%);
  border: 0.125rem solid var(--colour-checkbox-outline);
  border-radius: 0.125rem;
}
.checkbox label::after {
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ctitle%3Echeck%3C/title%3E%3Cpath d='M23.146,5.4,20.354,2.6a.5.5,0,0,0-.708,0L7.854,14.4a.5.5,0,0,1-.708,0L4.354,11.6a.5.5,0,0,0-.708,0L.854,14.4a.5.5,0,0,0,0,.707L7.146,21.4a.5.5,0,0,0,.708,0L23.146,6.1A.5.5,0,0,0,23.146,5.4Z'/%3E%3C/svg%3E");
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ctitle%3Echeck%3C/title%3E%3Cpath d='M23.146,5.4,20.354,2.6a.5.5,0,0,0-.708,0L7.854,14.4a.5.5,0,0,1-.708,0L4.354,11.6a.5.5,0,0,0-.708,0L.854,14.4a.5.5,0,0,0,0,.707L7.146,21.4a.5.5,0,0,0,.708,0L23.146,6.1A.5.5,0,0,0,23.146,5.4Z'/%3E%3C/svg%3E");
  background-color: hsl(0, 0%, 12%);
  background-color: var(--colour-checkbox-checkmark);
  background-size: calc(100% - 0.125rem);
  background-position: center;
  background-repeat: no-repeat;
  visibility: hidden;
  opacity: 0;
}
.checkbox input {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.checkbox input:checked + label::before {
  background-color: hsl(49, 93%, 52%);
  background-color: var(--colour-checkbox-fill);
  border-color: hsl(49, 93%, 52%);
  border-color: var(--colour-checkbox-fill);
}
.checkbox input:checked + label::after {
  visibility: visible;
  opacity: 1;
}
.checkbox input:focus-visible + label::before {
  outline: 4px solid hsla(32, 15%, 50%, 0.3);
  outline: 4px solid var(--colour-focus-outline);
  outline-offset: 3px;
}
@supports not selector(:focus-visible) {
  .checkbox input:focus + label::before {
    outline: 4px solid hsla(32, 15%, 50%, 0.3);
    outline: 4px solid var(--colour-focus-outline);
    outline-offset: 3px;
  }
}
.radio {
  margin-bottom: 0.5rem;
}
.radio label {
  position: relative;
  display: inline-flex;
  align-items: center;
  line-height: 1.5em;
  padding-left: 0.5rem;
  padding-bottom: 0.5rem;
  margin-left: 1rem;
}
.radio label::before, .radio label::after {
  content: "";
  width: 1rem;
  height: 1rem;
  position: absolute;
  top: calc(50% - (0.25rem) - (0.5rem));
  right: 100%;
  border-radius: 1rem;
  box-sizing: border-box;
}
.radio label::before {
  border: 0.125rem solid hsl(0, 0%, 12%);
  border: 0.125rem solid var(--colour-radio-outline);
}
.radio label::after {
  background-color: hsl(0, 0%, 12%);
  background-color: var(--colour-radio-checkmark);
  transform: scale(0.5);
  visibility: hidden;
  opacity: 0;
}
.radio input {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.radio input:checked + label::before {
  background-color: hsl(49, 93%, 52%);
  background-color: var(--colour-radio-fill);
  border-color: hsl(49, 93%, 52%);
  border-color: var(--colour-radio-fill);
}
.radio input:checked + label::after {
  visibility: visible;
  opacity: 1;
}
.radio input:focus-visible + label::before {
  outline: 4px solid hsla(32, 15%, 50%, 0.3);
  outline: 4px solid var(--colour-focus-outline);
  outline-offset: 3px;
}
@supports not selector(:focus-visible) {
  .radio input:focus + label::before {
    outline: 4px solid hsla(32, 15%, 50%, 0.3);
    outline: 4px solid var(--colour-focus-outline);
    outline-offset: 3px;
  }
}
.radio.has-credit-card-icon label .icon {
  width: 2em;
  height: 2em;
  margin-right: 0.5rem;
}
.radio.is-button label {
  width: 100%;
  margin-left: 0px;
  padding: 1.5rem 1.5rem 1.5rem calc(1rem + 1.5rem + 0.5rem);
  border-radius: 5px;
  border: 1px solid hsl(32, 15%, 88%);
  border: 1px solid var(--colour-action-border);
  cursor: pointer;
}
.radio.is-button label::before, .radio.is-button label::after {
  top: calc(50% - 0.5rem);
  left: 1rem;
}
.radio.is-button input:checked + label {
  background: hsl(32, 15%, 88%);
  background: var(--colour-action-border);
}
.checkbox input:disabled + label,
.radio input:disabled + label {
  color: hsl(32, 10%, 78%);
  color: var(--colour-text-disabled);
  cursor: not-allowed;
}
.checkbox input:disabled + label::before,
.radio input:disabled + label::before {
  opacity: 0.25;
}
fieldset {
  margin-bottom: 1rem;
}
fieldset legend {
  font-weight: 500;
  padding-bottom: 1rem;
}
fieldset > *:last-child {
  margin-bottom: 0px;
}
fieldset:not(.has-visible-legend) legend {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
fieldset .helper,
fieldset .error {
  line-height: 1.25;
  margin-top: 0.5rem;
  text-align: left;
}
fieldset .helper {
  color: hsl(32, 6%, 46%);
  color: var(--colour-text-muted);
}
fieldset .error {
  color: hsl(285, 65%, 50%);
  color: var(--colour-text-input-error);
  display: none;
}
fieldset.has-error .error {
  display: block;
}
fieldset .helper.auto-appearance {
  font-size: 1rem;
}
:root:not(:has(#colour-scheme-auto:checked)) fieldset .helper.auto-appearance {
  display: none !important;
}
.switch {
  display: flex;
  align-items: flex-start;
}
.switch > input {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.switch > input:focus-visible ~ label {
  outline: 4px solid hsla(32, 15%, 50%, 0.3);
  outline: 4px solid var(--colour-focus-outline);
  outline-offset: 3px;
}
@supports not selector(:focus-visible) {
  .switch > input:focus ~ label {
    outline: 4px solid hsla(32, 15%, 50%, 0.3);
    outline: 4px solid var(--colour-focus-outline);
    outline-offset: 3px;
  }
}
.switch > label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  line-height: 2.125rem;
  border-radius: 9999px;
}
.switch:not(.has-two-values) > label {
  flex-grow: 1;
}
.switch:not(.has-two-values) > input:checked ~ label > .switch-control {
  background-color: hsl(49, 93%, 52%);
  background-color: var(--colour-switch-active);
}
.switch .switch-control {
  display: inline-flex;
  flex-shrink: 0;
  border: none;
  padding: 0.3125rem;
  width: 3.9375rem;
  background-color: hsl(32, 15%, 88%);
  background-color: var(--colour-switch-fill);
  transition: background-color 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  border-radius: 9999px;
}
@media (hover: none) {
  .switch .switch-control {
    cursor: default;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
  }
}
.switch .switch-control > span {
  width: 1.5rem;
  height: 1.5rem;
  background: hsl(32, 70%, 99%);
  background: var(--colour-switch-toggle);
  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.15);
  transition: transform 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  transform-origin: left;
  border-radius: 9999px;
}
.switch > input:active ~ label > .switch-control > span,
.switch > label:active > .switch-control > span {
  transform: scaleX(1.125);
}
.switch > input:checked ~ label > .switch-control > span {
  transform: translateX(1.8125rem);
  transform-origin: right;
}
.switch > input:checked:active ~ label > .switch-control > span,
.switch > input:checked ~ label:active > .switch-control > span {
  transform: scaleX(1.125) translateX(1.625rem);
}
.switch.has-two-values > button {
  font-size: 1.125rem;
  background: none;
  display: inline-flex;
  border: none;
  padding-block: calc((2.125rem - 1em) * 0.5);
  transition: color 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
@media (hover: none) {
  .switch.has-two-values > button {
    cursor: default;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
  }
}
.switch.has-two-values > button:first-of-type {
  padding-inline-end: 0.5rem;
  order: 1;
}
.switch.has-two-values > button:last-of-type {
  padding-inline-start: 0.5rem;
  order: 3;
}
.switch.has-two-values > label {
  order: 2;
}
.switch.has-two-values input ~ button:first-of-type {
  color: hsl(0, 0%, 12%);
  color: var(--colour-switch-value-active);
}
.switch.has-two-values input ~ button:last-of-type {
  color: hsl(32, 6%, 46%);
  color: var(--colour-switch-value-inactive);
}
.switch.has-two-values input:checked ~ button:first-of-type {
  color: hsl(32, 6%, 46%);
  color: var(--colour-switch-value-inactive);
}
.switch.has-two-values input:checked ~ button:last-of-type {
  color: hsl(0, 0%, 12%);
  color: var(--colour-switch-value-active);
}
.switch.has-two-values.is-colour-scheme-toggle > button {
  font-size: 1.375rem;
}
.pac-container {
  border: none;
  border-radius: 5px;
  margin-top: 0.25rem;
  font-family: inherit;
  font-feature-settings: inherit;
  font-size: 1.125rem;
  padding: 0.5rem 0px;
  box-sizing: content-box;
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-high-contrast);
  box-shadow: 0px 4px 4px;
  box-shadow: 0px 0px 10px 0px rgba(57, 32, 0, 0.1), 0px 4px 6px 0px rgba(57, 32, 0, 0.22);
  box-shadow: 0px 0px 10px 0px var(--colour-elevation-middle-1), 0px 4px 6px 0px var(--colour-elevation-middle-2);
}
.pac-icon, .hdpi .pac-icon {
  grid-area: icon;
  margin: 0.125rem 0px 0px 0px;
  width: 1.125rem;
  height: 1.125rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23FF3312'%3E%3Ctitle%3Epin%3C/title%3E%3Cpath d='M12,0A8.009,8.009,0,0,0,4,8c0,3.51,5,12.025,7.148,15.524A1,1,0,0,0,12,24a.991.991,0,0,0,.852-.477C15,20.026,20,11.514,20,8A8.009,8.009,0,0,0,12,0Zm0,11.5A3.5,3.5,0,1,1,15.5,8,3.5,3.5,0,0,1,12,11.5Z'/%3E%3C/svg%3E");
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
}
.pac-item {
  border: none;
  padding: 0.75rem;
  font-size: 1rem;
  box-sizing: border-box;
  display: grid;
  grid-template-columns: 1.125rem minmax(0, 1fr);
  grid-gap: 0.25rem 0.75rem;
  gap: 0.25rem 0.75rem;
  color: hsl(32, 6%, 46%);
  color: var(--colour-text-muted);
  grid-template-areas: "icon address" "icon location";
}
@media (hover: hover) {
  .pac-item:hover, .pac-item-selected {
    background-color: hsl(32, 25%, 93%);
    background-color: var(--colour-places-autocomplete-option-hover);
  }
}
.pac-item > span {
  line-height: 1.3;
}
.pac-item-query {
  grid-area: address;
  font-size: 1.125rem;
  overflow: hidden;
  text-overflow: ellipsis;
  color: hsl(0, 0%, 12%);
  color: var(--colour-text);
}
.pac-item :last-child {
  grid-area: location;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pac-matched {
  font-weight: normal;
}
.pac-logo:after {
  height: 0px;
  padding: calc(0.75rem + 18px) 0px 0px 0px;
  background-position: 1rem 0.75rem;
}
:root:has(#colour-scheme-dark:checked) .pac-logo:after {
  filter: invert(1) saturate(0) brightness(100);
}
@media (prefers-color-scheme: dark) {
  :root:not(:has(#colour-scheme-light:checked)) .pac-logo:after {
    filter: invert(1) saturate(0) brightness(100);
  }
}
.text-input.has-places-autocomplete {
  z-index: 3;
}
.text-input.has-places-autocomplete input {
  transition-property: all;
  transition-duration: 0.1s;
  transition-timing-function: ease-in-out;
}
.text-input.has-places-autocomplete:focus-within {
  z-index: 9;
}
.text-input.has-places-autocomplete:focus-within input:focus {
  box-shadow: 0px 0px 0px 200vh hsla(32, 100%, 10%, 0.25);
  box-shadow: 0px 0px 0px 200vh var(--colour-places-autocomplete-dimming);
}
.option-bar {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 1rem;
}
.option-bar > svg.icon {
  font-size: 1rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .option-bar {
    gap: 1.5rem;
  }
  .option-bar > svg.icon {
    font-size: 1.125rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .option-bar > svg.icon {
    font-size: 1.25rem;
  }
}
.option-bar.is-tiny {
  gap: 0.5rem;
}
.option-bar.is-tiny > svg.icon {
  font-size: 0.875rem;
}
.link-selector {
  padding: 0.375rem 0;
  outline: none;
  cursor: pointer;
  background: none;
  transition-property: all;
  transition-duration: 0.1s;
  transition-timing-function: ease-in-out;
}
@media (hover: none) {
  .link-selector {
    cursor: default;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-touch-callout: none;
  }
}
.link-selector:hover {
  text-decoration: none;
}
.link-selector > span {
  display: flex;
  align-items: center;
  font-size: 1.125rem;
  padding-left: 0.1875rem;
  padding-right: 0.1875rem;
  gap: 0.5rem;
  transition-property: all;
  transition-duration: 0.1s;
  transition-timing-function: ease-in-out;
}
.link-selector > span > span {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1;
  padding: 0.1875rem 0;
}
.link-selector .icon {
  color: #EA482C;
  color: var(--colour-text-input-icon);
}
.link-selector.has-plain-icon .icon {
  color: hsl(0, 0%, 12%);
  color: var(--colour-text);
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .link-selector {
    padding: 0;
  }
  .link-selector > span {
    font-size: 1.375rem;
  }
  .link-selector > span > span {
    padding: 0.25rem 0;
  }
  .link-selector > span > svg:last-of-type:not(:first-of-type) {
    margin-left: 0.5rem;
  }
}
.link-selector:focus > span, .link-selector:hover > span {
  background-color: hsl(32, 25%, 93%);
  background-color: var(--link-selector-hover);
  box-shadow: 0px 0px 0px 4px hsl(32, 25%, 93%);
  box-shadow: 0px 0px 0px 4px var(--link-selector-hover);
  border-radius: 3px;
}
.link-selector.will-shrink {
  max-width: 100%;
  min-width: 0px;
}
.option-bar.is-tiny .link-selector {
  padding: 0.25rem 0;
}
.option-bar.is-tiny .link-selector > span {
  font-size: 1rem;
}
.option-bar.is-tiny .link-selector > span > span {
  padding: 0.375rem 0;
}
.card, .card.is-restaurant {
  display: inline-flex;
  flex-direction: column;
  width: 100%;
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-high-contrast);
}
.card:hover {
  text-decoration: none;
}
.card > a:hover {
  text-decoration: none;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .card .title {
    font-size: 2.25rem;
  }
}
.fixed-bottom-element > .card {
  background: linear-gradient(rgba(255, 255, 255, 0), hsl(32, 70%, 99%));
  background: linear-gradient(rgba(255, 255, 255, 0), var(--colour-bg-high-contrast));
  clip-path: none;
  display: block;
}
.fixed-bottom-element > .card {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .fixed-bottom-element > .card {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .fixed-bottom-element > .card {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .fixed-bottom-element > .card {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
.fixed-bottom-element > .card {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .fixed-bottom-element > .card {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .fixed-bottom-element > .card {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .fixed-bottom-element > .card {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
.fixed-bottom-element > .card > * {
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-high-contrast);
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0px 4px 28px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 4px 28px var(--colour-elevation-high);
}
.fixed-bottom-element > .card + .notice-container {
  margin-bottom: 0;
}
.fixed-bottom-element > .card > a {
  display: block;
}
.fixed-bottom-element > .card > a:hover {
  text-decoration: none;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .fixed-bottom-element > .card {
    padding: 0px;
  }
  .fixed-bottom-element > .card + .notice-container {
    margin-bottom: 1.5rem;
  }
  .fixed-bottom-element > .card > * {
    border-radius: 0px;
  }
}
.card.is-restaurant {
  background-color: transparent;
  position: relative;
}
.card.is-restaurant > * {
  margin-bottom: 1rem;
}
.card.is-restaurant .title {
  font-size: 1.25rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .card.is-restaurant .title {
    font-size: 1.75rem;
  }
}
.card.is-restaurant .title .exclusive-gem {
  display: flex;
  transition-property: all;
  transition-duration: 0.1s;
  transition-timing-function: ease-in-out;
}
.card.is-restaurant .title .exclusive-gem:hover {
  background-color: hsl(32, 15%, 88%);
  background-color: var(--colour-icon-hover);
  box-shadow: 0px 0px 0px 4px hsl(32, 15%, 88%);
  box-shadow: 0px 0px 0px 4px var(--colour-icon-hover);
  border-radius: 9999px;
}
.card.is-restaurant .image {
  border-radius: 6px;
  width: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  background-position: center center;
  background-color: hsl(32, 25%, 93%);
  background-color: var(--colour-image-placeholder);
  background-image: url("/assets/static/images/restaurant-card-placeholder2-55922548.svg");
  aspect-ratio: 5/3;
  overflow: hidden;
}
.card.is-restaurant .image.is-loading {
  background-image: url("/assets/static/images/restaurant-card-loading2-912cc3ad.svg");
}
.card.is-restaurant .image > .badge {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
}
.card.is-restaurant .image > .badge.is-exclusive-partner {
  left: 0.5rem;
  right: auto;
  right: initial;
}
.card.is-restaurant p {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  font-size: 1rem;
  color: hsl(32, 6%, 46%);
  color: var(--colour-text-muted);
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .card.is-restaurant p {
    font-size: 1.125rem;
  }
}
.choice-strip > .card.is-restaurant p {
  -webkit-line-clamp: 2;
}
.card.is-restaurant .attributes {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}
.card.is-restaurant > .anchor {
  position: absolute;
  top: -33.3333333333vh;
  left: 0px;
}
.card.is-restaurant.is-closed .title {
  opacity: 0.6;
}
.card.is-restaurant.is-closed .attributes {
  filter: saturate(0%);
}
.card.is-restaurant.is-closed .image {
  filter: saturate(35%);
}
.card.is-restaurant.is-closed .image::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  opacity: 0.8;
  background-color: hsl(32, 25%, 93%);
  background-color: var(--colour-card-store-closed);
}
.card.is-restaurant.is-closed .image:not([style*=background-image])::before {
  opacity: 0.4;
}
.card.is-info, .card.is-raised {
  clip-path: none;
  border-radius: 12px;
  width: auto;
  color: hsl(0, 0%, 12%);
  color: var(--colour-text);
  border: 1px solid hsl(32, 25%, 93%);
  border: 1px solid var(--colour-card-border);
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.05), 0px -2px 26px rgba(0, 0, 0, 0.05);
  box-shadow: 0px 4px 4px var(--colour-elevation-low), 0px -2px 26px var(--colour-elevation-low);
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .card.is-info, .card.is-raised {
    border-radius: 16px;
  }
}
.card.is-info {
  align-items: center;
  flex-grow: 1;
  gap: 1.5rem;
}
.card.is-info {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .card.is-info {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .card.is-info {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .card.is-info {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
.card.is-info {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .card.is-info {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .card.is-info {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .card.is-info {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
.card.is-info > * {
  margin: 0;
}
.card.is-info p {
  max-width: 32ch;
  font-size: 1rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .card.is-info p {
    font-size: 1.125rem;
  }
}
.card.is-info.has-full-width-text p {
  max-width: none;
  max-width: initial;
}
.modal {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  z-index: 9;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  transition: all 0.1s cubic-bezier(0.46, 0.03, 0.52, 0.96);
}
.modal .card {
  transform: translateY(60px) scale(0.94);
  transition: all 0.1s cubic-bezier(0.46, 0.03, 0.52, 0.96);
}
.modal .card {
  width: 100%;
  height: 100%;
  max-height: 100%;
  overflow: auto;
  overscroll-behavior: none;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .modal .card[style*="--cart-height-offset-desktop"] {
    max-height: calc(100vh - 0 * 1px);
    max-height: calc(100vh - var(--cart-height-offset-desktop, 0) * 1px);
  }
}
.modal .card > form {
  display: contents;
}
.modal .card > .controls {
  position: sticky;
  top: 0;
  padding: 0.75rem 0;
  z-index: 3;
  width: 100%;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 1rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .modal .card > .controls {
    justify-content: space-between;
  }
  .modal .card > .controls > :first-child {
    margin-right: auto;
  }
  .modal .card > .controls > :last-child {
    margin-left: auto;
  }
}
.modal .card > .controls > .badge {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.modal .card > .controls {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .modal .card > .controls {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .modal .card > .controls {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .modal .card > .controls {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
.modal.is-active {
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}
.modal.is-active .card {
  transform: translateY(0) scale(1);
  transition-delay: 0s;
}
.modal .is-floating-button > a {
  z-index: 7;
}
.modal .modal-header {
  width: 100%;
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-elevated);
  z-index: 7;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .modal .modal-header + section {
    padding-top: 1.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .modal .modal-header + section {
    padding-top: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .modal .modal-header + section {
    padding-top: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .modal .modal-header + section {
    padding-top: 2.5rem;
  }
}
.modal .product-details {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.modal .product-details .title {
  font-size: 1.375rem;
  font-weight: normal;
}
.modal .product-details .description {
  font-size: 1rem;
  color: hsl(32, 6%, 46%);
  color: var(--colour-text-muted);
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .modal .product-details .description {
    font-size: 1.125rem;
  }
}
.modal .product-details .description:where(:empty) {
  display: none !important;
}
.modal .product-details .description > p {
  -webkit-line-clamp: 8;
  white-space: pre-line;
  word-wrap: break-word;
  word-break: break-word;
  margin-block-end: 0;
}
.modal .product-details .price {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  font-size: 1.25rem;
}
.modal .product-details .price :first-child {
  font-weight: 500;
}
.modal .product-details .price:has(* + *) :first-child {
  font-size: 1.75rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .modal {
    padding: 2rem;
    -webkit-backdrop-filter: blur(4px);
            backdrop-filter: blur(4px);
    background-color: hsla(32, 10%, 51%, 0.8);
    background-color: var(--colour-modal-shadow);
  }
  .modal .card {
    max-width: 800px;
    height: auto;
  }
}
.modal:not(.is-active) .product-details .description > p {
  visibility: visible;
  pointer-events: none;
}
.grid.has-aside .modal:not(.is-forced) {
  flex-direction: column;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .grid.has-aside .modal:not(.is-forced) {
    opacity: 1;
    visibility: visible;
    transition-delay: 0s;
    display: contents;
  }
  .grid.has-aside .modal:not(.is-forced) .card {
    transform: translateY(0) scale(1);
    transition-delay: 0s;
  }
  .grid.has-aside .modal:not(.is-forced) .card {
    height: auto;
  }
  .grid.has-aside .modal:not(.is-forced) .is-back-button-spacer,
  .grid.has-aside .modal:not(.is-forced) .modal-header {
    display: none;
  }
}
.overlay {
  width: 100%;
  display: flex;
  position: fixed;
  top: 0px;
  z-index: 9;
  transform: translate(0px, -100%);
  box-shadow: 0px 0px 0px 100vh transparent;
  visibility: hidden;
  transition: all 0.28s cubic-bezier(0.79, 0.14, 0.15, 0.86);
}
.overlay .card {
  transition: all 0.28s cubic-bezier(0.79, 0.14, 0.15, 0.86);
}
.overlay:not(.is-menu, .is-sidebar) .overlay-header {
  margin-bottom: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .overlay:not(.is-menu, .is-sidebar) .overlay-header {
    margin-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .overlay:not(.is-menu, .is-sidebar) .overlay-header {
    margin-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .overlay:not(.is-menu, .is-sidebar) .overlay-header {
    margin-bottom: 2.5rem;
  }
}
.overlay.is-active {
  visibility: visible;
  transform: translate(0px, 0px);
  box-shadow: 0px 0px 0px 100vh hsla(32, 80%, 4%, 0.7);
  box-shadow: 0px 0px 0px 100vh var(--colour-overlay-menu-shadow);
}
.overlay:where(.is-menu, .is-sidebar) {
  height: 100%;
  right: 0;
  transform: translate(100%, 0px);
  box-shadow: 0px 0px 0px 100vw transparent;
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  body > .overlay:where(.is-menu, .is-sidebar) .overlay-header, body > turbo-frame > .overlay:where(.is-menu, .is-sidebar) .overlay-header {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}
.overlay:where(.is-menu, .is-sidebar) nav {
  overflow-y: auto;
  overscroll-behavior: none;
}
.overlay:where(.is-menu, .is-sidebar) .is-nav-footer {
  flex-grow: 1;
}
.overlay:where(.is-menu, .is-sidebar) .is-nav-footer > .shielded-button > a {
  display: flex;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .overlay:where(.is-menu, .is-sidebar) .is-nav-footer {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    gap: none;
  }
  .overlay:where(.is-menu, .is-sidebar) .is-nav-footer > li {
    display: flex;
    align-items: center;
  }
  .overlay:where(.is-menu, .is-sidebar) .is-nav-footer > li:not(:last-of-type):not(:nth-last-of-type(2)):after {
    content: "·";
    display: inline;
    margin-left: 0.5rem;
  }
  .overlay:where(.is-menu, .is-sidebar) .is-nav-footer > li.shielded-button {
    margin-left: auto;
  }
  .overlay:where(.is-menu, .is-sidebar) .is-nav-footer > li.shielded-button > a {
    padding-left: 0.625rem;
    padding-right: 0.625rem;
  }
}
.overlay:where(.is-menu, .is-sidebar) .is-nav-footer:last-child {
  padding-bottom: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .overlay:where(.is-menu, .is-sidebar) .is-nav-footer:last-child {
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .overlay:where(.is-menu, .is-sidebar) .is-nav-footer:last-child {
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .overlay:where(.is-menu, .is-sidebar) .is-nav-footer:last-child {
    padding-bottom: 2.5rem;
  }
}
.overlay:where(.is-menu, .is-sidebar).is-active {
  transform: translate(0px, 0px);
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .overlay:where(.is-menu, .is-sidebar) {
    max-width: 25.9375rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .overlay:where(.is-menu, .is-sidebar) {
    max-width: 30.625rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 2048px) {
  .overlay:where(.is-menu, .is-sidebar) {
    max-width: 34.375rem;
  }
}
.overlay.is-menu.is-active {
  box-shadow: 0px 0px 0px 100vw hsla(32, 80%, 4%, 0.7);
  box-shadow: 0px 0px 0px 100vw var(--colour-overlay-menu-shadow);
}
.overlay.is-sidebar {
  box-shadow: 0px 4px 28px rgba(0, 0, 0, 0.12);
  box-shadow: 0px 4px 28px var(--colour-elevation-high-subtle);
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .overlay.is-modal {
    height: 100%;
    align-items: center;
    justify-content: center;
    transform: none;
    opacity: 0;
    visibility: hidden;
    transition: all 0.1s cubic-bezier(0.46, 0.03, 0.52, 0.96);
    -webkit-backdrop-filter: blur(4px);
            backdrop-filter: blur(4px);
    background-color: hsla(32, 10%, 51%, 0.8);
    background-color: var(--colour-modal-shadow);
  }
  .overlay.is-modal .card {
    width: auto;
    height: auto;
    min-width: 600px;
  }
  .overlay.is-modal .overlay-header {
    display: none;
  }
  .overlay.is-modal .card {
    transform: translateY(60px) scale(0.94);
    transition: all 0.1s cubic-bezier(0.46, 0.03, 0.52, 0.96);
  }
  .overlay.is-modal.is-active {
    box-shadow: none;
    opacity: 1;
    visibility: visible;
    transition-delay: 0s;
  }
  .overlay.is-modal.is-active .card {
    transform: translateY(0) scale(1);
    transition-delay: 0s;
  }
}
.popover-sheet {
  max-width: 100%;
  flex-basis: min-content;
}
.popover-sheet > .surface {
  display: flex;
  flex-direction: column;
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  border-radius: 6px 6px 0 0;
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-high-contrast);
  transition: transform 0.25s cubic-bezier(0.79, 0.14, 0.15, 0.86);
  z-index: 9;
  max-height: calc(100vh - 3rem);
  overflow: hidden;
}
.popover-sheet > .surface > .content {
  max-height: calc(100vh - 3rem);
  overflow-y: auto;
  overscroll-behavior: none;
}
.popover-sheet > .surface > .content section {
  padding-block-end: 1.5rem;
}
.popover-sheet > .surface > .content section:not(section + section) {
  padding-block-start: 1.5rem;
}
.popover-sheet > .surface > .content .container {
  padding-inline: 1.5rem;
}
.popover-sheet > .surface > .content > section,
.popover-sheet > .surface > .content > .container {
  padding: 1.5rem;
}
@media (hover: hover) {
  .popover-sheet > .surface > .content {
    -ms-overflow-style: auto;
    scrollbar-color: transparent transparent;
    scrollbar-width: thin;
  }
  .popover-sheet > .surface > .content::-webkit-scrollbar-thumb {
    background-color: transparent;
    border-radius: 7px;
  }
  .popover-sheet > .surface > .content::-webkit-scrollbar-track {
    background-color: transparent;
  }
  .popover-sheet > .surface > .content::-webkit-scrollbar {
    width: 7px;
    height: 7px;
  }
  .popover-sheet > .surface > .content:hover {
    scrollbar-color: hsla(0, 0%, 40%, 0.5) transparent;
    transition-delay: 0s;
  }
  .popover-sheet > .surface > .content:hover::-webkit-scrollbar-thumb {
    background-color: hsla(0, 0%, 40%, 0.5);
  }
}
@media (hover: none) {
  .popover-sheet > .surface > .content {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .popover-sheet > .surface > .content::-webkit-scrollbar {
    display: none;
  }
}
.popover-sheet > .shim {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background-color: hsla(32, 80%, 4%, 0.7);
  background-color: var(--colour-overlay-menu-shadow);
  transition: all 0.25s cubic-bezier(0.79, 0.14, 0.15, 0.86);
  z-index: 9;
}
.popover-sheet:not(:where(.is-active, .is-active-on-focus:focus-within)) > .surface {
  transform: translateY(100%);
}
.popover-sheet:not(:where(.is-active, .is-active-on-focus:focus-within)) > .shim {
  opacity: 0;
  visibility: hidden;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .popover-sheet:not(.is-floating-above-desktop) {
    display: flex;
    justify-content: center;
    position: relative;
  }
  .popover-sheet:not(.is-floating-above-desktop) > .shim {
    display: none;
  }
  .popover-sheet:not(.is-floating-above-desktop) > .surface {
    position: absolute;
    left: auto;
    top: calc(100% + 0.5rem + 0.625rem);
    width: -moz-max-content;
    width: max-content;
    height: -moz-max-content;
    height: max-content;
    min-width: 22.5rem;
    max-width: 25rem;
    border: 1px solid hsl(32, 12%, 85%);
    border: 1px solid var(--colour-popover-border);
    border-radius: 6px;
    transition: transform 0.1s ease-in-out, opacity 0.1s ease-in-out, visibility 0.1s ease-in-out;
    box-shadow: 0px 4px 28px rgba(0, 0, 0, 0.12);
    box-shadow: 0px 4px 28px var(--colour-elevation-high-subtle);
  }
  .popover-sheet:not(.is-floating-above-desktop) > .surface > .content {
    max-height: 75vh;
  }
  .popover-sheet:not(.is-floating-above-desktop) > .surface::after {
    content: "";
    align-self: center;
    position: absolute;
    bottom: calc(100% - 0.3125rem);
    width: 0.625rem;
    height: 0.625rem;
    transform: rotate(45deg);
    background-color: hsl(32, 70%, 99%);
    background-color: var(--colour-bg-high-contrast);
    border-top: 1px solid #DADADA;
    border-left: 1px solid #DADADA;
    border-radius: 2px 0 0 0;
    box-sizing: content-box;
  }
  .popover-sheet:not(.is-floating-above-desktop):not(:where(.is-active, .is-active-on-focus:focus-within)) > .surface {
    transform: none;
    opacity: 0;
    visibility: hidden;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .popover-sheet.is-floating-above-desktop > .shim {
    display: none;
  }
  .popover-sheet.is-floating-above-desktop > .surface {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(0.95);
    width: auto;
    height: -moz-fit-content;
    height: fit-content;
    min-width: 28.75rem;
    max-width: 50rem;
    max-height: calc(100vh - 0.15625rem * 2);
    border-radius: 6px;
    transition: transform 0.1s ease-in-out, opacity 0.1s ease-in-out, visibility 0.1s ease-in-out;
    box-shadow: 0px 4px 28px rgba(0, 0, 0, 0.12);
    box-shadow: 0px 4px 28px var(--colour-elevation-high-subtle);
  }
  .popover-sheet.is-floating-above-desktop.is-active > .surface {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(1);
  }
  .popover-sheet.is-floating-above-desktop:not(.is-active) > .surface {
    opacity: 0;
    visibility: hidden;
  }
}
.popover-sheet.is-floating-above-desktop.is-modal > .shim {
  display: inline;
  display: initial;
}
.popover-sheet.is-full-height-below-mobile > .surface {
  height: 100%;
}
.popover-sheet.is-full-height-below-mobile > .surface .content {
  height: 100%;
  display: flex;
  flex-direction: column;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .popover-sheet.is-full-height-below-mobile > .surface {
    height: -moz-max-content;
    height: max-content;
  }
  .popover-sheet.is-full-height-below-mobile > .surface .content {
    height: auto;
    height: initial;
    display: inline;
    display: initial;
    flex-direction: initial;
  }
}
.popover-sheet.is-full-screen-below-mobile > .surface {
  height: 100%;
  max-height: none;
  max-height: initial;
}
@media (max-aspect-ratio: 3/4), (max-width: 1023.98px) {
  .popover-sheet.is-full-screen-below-mobile > .surface {
    border-radius: 0;
    border-radius: initial;
  }
  .popover-sheet.is-full-screen-below-mobile > .surface .content {
    height: 100%;
    max-height: none;
    max-height: initial;
    display: flex;
    flex-direction: column;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .popover-sheet.is-full-screen-below-mobile > .surface {
    height: -moz-max-content;
    height: max-content;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .popover-sheet.has-fulfilment-options > .surface {
    min-width: 26.25rem;
    max-width: 28.75rem;
  }
}
.popover-sheet.has-fulfilment-options .content {
  max-height: none;
  max-height: initial;
}
.choice-strip {
  overflow-x: auto;
  display: flex;
  transition: scrollbar-color 0.2s ease-in-out 1s;
  max-width: 100vw;
}
.choice-strip:not(.has-one-visible) > :last-child {
  position: relative;
}
.choice-strip:not(.has-one-visible) > :last-child::after {
  content: "";
  display: block;
  position: absolute;
  height: 1px;
  left: 100%;
}
.choice-strip:not(.has-one-visible) > :last-child::after {
  width: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .choice-strip:not(.has-one-visible) > :last-child::after {
    width: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .choice-strip:not(.has-one-visible) > :last-child::after {
    width: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .choice-strip:not(.has-one-visible) > :last-child::after {
    width: 2.5rem;
  }
}
@media (hover: none) {
  .choice-strip {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .choice-strip::-webkit-scrollbar {
    display: none;
  }
}
@media (hover: hover) {
  .choice-strip {
    -ms-overflow-style: auto;
    scrollbar-color: transparent transparent;
    scrollbar-width: thin;
  }
  .choice-strip::-webkit-scrollbar-thumb {
    background-color: transparent;
    border-radius: 7px;
  }
  .choice-strip::-webkit-scrollbar-track {
    background-color: transparent;
  }
  .choice-strip::-webkit-scrollbar {
    width: 7px;
    height: 7px;
  }
  .choice-strip:hover {
    scrollbar-color: hsla(0, 0%, 40%, 0.5) transparent;
    transition-delay: 0s;
  }
  .choice-strip:hover::-webkit-scrollbar-thumb {
    background-color: hsla(0, 0%, 40%, 0.5);
  }
}
.choice-strip.is-gapped {
  gap: 0.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .choice-strip.is-gapped {
    gap: 1rem;
  }
}
.choice-strip.has-one-visible {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .choice-strip.has-one-visible {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .choice-strip.has-one-visible {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .choice-strip.has-one-visible {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  :where(body, .app-view, header, .overlay:where(.is-menu, .is-sidebar)) > .choice-strip.has-one-visible, :where(body, .app-view) > :where(section, turbo-frame, .cover, details.required-choice) > .choice-strip.has-one-visible, :where(body, .app-view) > :where(turbo-frame, .restaurant-header, section#catalog) > section > .choice-strip.has-one-visible, :where(body, .app-view) > section :where(.grid.has-aside, .column) > .choice-strip.has-one-visible, :where(body, .app-view) > .cover > :where(.cover-content, header) > .choice-strip.has-one-visible, :where(body, .app-view) > section .column > section > .choice-strip.has-one-visible, :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > .choice-strip.has-one-visible, :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > :where(a, .overlay-header) > .choice-strip.has-one-visible {
    padding-left: 4.375rem;
    padding-right: 4.375rem;
  }
}
.choice-strip.has-one-visible {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.choice-strip.has-one-visible::-webkit-scrollbar {
  display: none;
}
.choice-strip.has-one-visible {
  scroll-padding-inline-start: 1.5rem;
}
.choice-strip.has-one-visible > * {
  min-width: calc(100% - 0rem - 1rem);
  max-width: calc(100% - 0rem);
  scroll-snap-align: start;
  scroll-snap-stop: normal;
}
.choice-strip.has-one-visible > *:not(:last-child) {
  margin-right: 1rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  html:not([data-cypress]) .choice-strip.has-one-visible {
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
  }
  .choice-strip.has-one-visible {
    scroll-padding-inline-start: 2rem;
  }
  .choice-strip.has-one-visible > * {
    min-width: calc(50% - 0.75rem - 0px);
    max-width: calc(50% - 0.75rem);
    scroll-snap-align: start;
    scroll-snap-stop: normal;
  }
  .choice-strip.has-one-visible > *:not(:last-child) {
    margin-right: 1.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .choice-strip.has-one-visible {
    scroll-padding-inline-start: 2rem;
  }
  .choice-strip.has-one-visible > * {
    min-width: calc(33.3333333333% - 1rem - 0px);
    max-width: calc(33.3333333333% - 1rem);
    scroll-snap-align: start;
    scroll-snap-stop: normal;
  }
  .choice-strip.has-one-visible > *:not(:last-child) {
    margin-right: 1.5rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .choice-strip.has-one-visible {
    scroll-padding-inline-start: 4.375rem;
  }
  .choice-strip.has-one-visible > * {
    min-width: calc(25% - 1.125rem - 0px);
    max-width: calc(25% - 1.125rem);
    scroll-snap-align: start;
    scroll-snap-stop: normal;
  }
  .choice-strip.has-one-visible > *:not(:last-child) {
    margin-right: 1.5rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 2048px) {
  .choice-strip.has-one-visible {
    scroll-padding-inline-start: 4.375rem;
  }
  .choice-strip.has-one-visible > * {
    min-width: calc(20% - 1.6rem - 0px);
    max-width: calc(20% - 1.6rem);
    scroll-snap-align: start;
    scroll-snap-stop: normal;
  }
  .choice-strip.has-one-visible > *:not(:last-child) {
    margin-right: 2rem;
  }
}
.choice-strip-controls {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
@media (max-aspect-ratio: 3/4), (max-width: 767.98px) {
  .choice-strip-controls {
    display: none !important;
  }
}
.divider.has-content.choice-strip {
  transition: padding-left 0.1s ease-in;
  position: relative;
}
@media (max-aspect-ratio: 3/4), (max-width: 767.98px) {
  header + .divider.has-content.choice-strip {
    padding-top: 0.25rem;
  }
}
.divider:not(.has-content),
hr {
  margin: 1.5rem 0px;
  height: 1px;
  box-sizing: content-box;
  border-bottom: 1px solid hsl(32, 12%, 85%);
  border-bottom: 1px solid var(--colour-divider);
}
.divider.has-content {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  padding: 0.75rem 0px;
  background-color: #FAEAD8;
  background-color: var(--colour-divider-with-content);
  row-gap: 0.5rem;
}
.divider.has-content {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .divider.has-content {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .divider.has-content {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .divider.has-content {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  :where(body, .app-view, header, .overlay:where(.is-menu, .is-sidebar)) > .divider.has-content, :where(body, .app-view) > :where(section, turbo-frame, .cover, details.required-choice) > .divider.has-content, :where(body, .app-view) > :where(turbo-frame, .restaurant-header, section#catalog) > section > .divider.has-content, :where(body, .app-view) > section :where(.grid.has-aside, .column) > .divider.has-content, :where(body, .app-view) > .cover > :where(.cover-content, header) > .divider.has-content, :where(body, .app-view) > section .column > section > .divider.has-content, :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > .divider.has-content, :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > :where(a, .overlay-header) > .divider.has-content {
    padding-left: 4.375rem;
    padding-right: 4.375rem;
  }
}
.divider.has-content > :last-child {
  position: relative;
}
.divider.has-content > :last-child::after {
  content: "";
  display: block;
  position: absolute;
  height: 1px;
  left: 100%;
}
.divider.has-content > :last-child::after {
  width: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .divider.has-content > :last-child::after {
    width: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .divider.has-content > :last-child::after {
    width: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .divider.has-content > :last-child::after {
    width: 2.5rem;
  }
}
.divider.has-content > * {
  margin: 0;
}
.divider.has-content .label {
  font-size: 1.25rem;
  line-height: 1.75rem;
}
.divider.has-content.has-high-contrast {
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-high-contrast);
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .divider.has-content.has-high-contrast-above-tablet {
    background-color: hsl(32, 70%, 99%);
    background-color: var(--colour-bg-high-contrast);
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .divider.has-content.has-high-contrast-above-desktop {
    background-color: hsl(32, 70%, 99%);
    background-color: var(--colour-bg-high-contrast);
  }
}
.divider.has-content.has-transparent-background {
  background: none;
  pointer-events: none;
}
.divider.has-content.has-transparent-background > * {
  pointer-events: auto;
}
.divider.has-content.is-strong {
  background-color: #d9381c;
  background-color: var(--colour-divider-with-content-strong);
  color: hsl(32, 70%, 99%);
  color: var(--colour-divider-with-content-strong-text);
}
details.required-choice {
  box-sizing: border-box;
  transition: 0.2s all ease-out;
}
details.required-choice summary {
  list-style: none;
}
details.required-choice summary::-webkit-details-marker {
  display: none;
}
details.required-choice summary.divider.has-content {
  cursor: pointer;
  justify-content: space-between;
  transition: 0.2s all ease-out;
}
details.required-choice summary.divider.has-content .choice-summary {
  min-width: 0;
}
details.required-choice summary.divider.has-content .choice-label {
  font-size: 1.25rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: 0.2s all ease-out;
}
details.required-choice summary.divider.has-content .choice-value {
  font-size: 1.125rem;
  height: 1.6875rem;
  line-height: 1.6875rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: 0.2s all ease-out;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  details.required-choice summary.divider.has-content .choice-value {
    font-size: 1.375rem;
    height: 2.0625rem;
    line-height: 2.0625rem;
  }
}
details.required-choice summary.divider.has-content .choice-expander {
  display: flex;
  align-items: center;
  margin-left: 1rem;
  gap: 0.75rem;
}
details.required-choice summary.divider.has-content .choice-expander .icon {
  transition: 0.2s all ease-out;
}
details.required-choice .required-label {
  font-size: 1rem;
}
details.required-choice:not([open]) {
  padding-bottom: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  details.required-choice:not([open]) {
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  details.required-choice:not([open]) {
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  details.required-choice:not([open]) {
    padding-bottom: 2.5rem;
  }
}
details.required-choice:not([open]) {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  details.required-choice:not([open]) {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  details.required-choice:not([open]) {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  details.required-choice:not([open]) {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  :where(body, .app-view, header, .overlay:where(.is-menu, .is-sidebar)) > details.required-choice:not([open]), :where(body, .app-view) > :where(section, turbo-frame, .cover, details.required-choice) > details.required-choice:not([open]), :where(body, .app-view) > :where(turbo-frame, .restaurant-header, section#catalog) > section > details.required-choice:not([open]), :where(body, .app-view) > section :where(.grid.has-aside, .column) > details.required-choice:not([open]), :where(body, .app-view) > .cover > :where(.cover-content, header) > details.required-choice:not([open]), :where(body, .app-view) > section .column > section > details.required-choice:not([open]), :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > details.required-choice:not([open]), :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > :where(a, .overlay-header) > details.required-choice:not([open]) {
    padding-left: 4.375rem;
    padding-right: 4.375rem;
  }
}
details.required-choice:not([open]) summary.divider.has-content {
  border-radius: 5px;
  padding-left: 1rem;
  padding-right: 1rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  details.required-choice:not([open]) summary.divider.has-content {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}
details.required-choice:not([open]) summary.divider.has-content .choice-label {
  font-size: 1rem;
}
details.required-choice:not([open]):not(.is-valid) summary.divider.has-content {
  background-color: #d9381c;
  background-color: var(--colour-divider-with-content-strong);
  color: hsl(32, 70%, 99%);
  color: var(--colour-divider-with-content-strong-text);
}
details.required-choice:not([open]).is-valid summary.divider.has-content .choice-label {
  color: hsl(32, 6%, 46%);
  color: var(--colour-text-muted);
}
details.required-choice:not([open]).is-valid .required-label {
  display: none !important;
}
details.required-choice[open] summary.divider.has-content {
  background-color: #d9381c;
  background-color: var(--colour-divider-with-content-strong);
  color: hsl(32, 70%, 99%);
  color: var(--colour-divider-with-content-strong-text);
}
details.required-choice[open] summary.divider.has-content .choice-label {
  line-height: 1.75rem;
}
details.required-choice[open] summary.divider.has-content .choice-value {
  height: 0px;
  opacity: 0;
  visibility: hidden;
}
details.required-choice[open] summary.divider.has-content .icon {
  transform: rotate(-180deg);
}
.notice {
  display: flex;
  align-items: center;
  padding: 1rem 0px;
  background-color: hsl(49, 93%, 52%);
  background-color: var(--colour-notice-fill);
  font-size: 1rem;
  line-height: 1.5;
  color: hsl(0, 0%, 12%);
  color: var(--colour-notice-text);
}
.notice {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .notice {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .notice {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .notice {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  :where(body, .app-view, header, .overlay:where(.is-menu, .is-sidebar)) > .notice, :where(body, .app-view) > :where(section, turbo-frame, .cover, details.required-choice) > .notice, :where(body, .app-view) > :where(turbo-frame, .restaurant-header, section#catalog) > section > .notice, :where(body, .app-view) > section :where(.grid.has-aside, .column) > .notice, :where(body, .app-view) > .cover > :where(.cover-content, header) > .notice, :where(body, .app-view) > section .column > section > .notice, :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > .notice, :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > :where(a, .overlay-header) > .notice {
    padding-left: 4.375rem;
    padding-right: 4.375rem;
  }
}
.notice > :last-child {
  position: relative;
}
.notice > :last-child::after {
  content: "";
  display: block;
  position: absolute;
  height: 1px;
  left: 100%;
}
.notice > :last-child::after {
  width: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .notice > :last-child::after {
    width: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .notice > :last-child::after {
    width: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .notice > :last-child::after {
    width: 2.5rem;
  }
}
.notice > * {
  margin: 0px;
}
.notice > .icon {
  font-size: inherit;
  margin-right: 1rem;
  flex-shrink: 0;
}
.notice .notice-controls {
  margin-left: auto;
  padding-left: 1rem;
}
.notice .notice-controls :not(:last-child) {
  margin-right: 0.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .notice {
    font-size: 1.125rem;
  }
}
.notice.is-deal {
  color: hsl(0, 0%, 12%);
  color: var(--colour-notice-deal-text);
  background-color: hsl(49, 93%, 52%);
  background-color: var(--colour-notice-deal-fill);
}
.notice.is-deal a {
  border-color: hsl(0, 0%, 12%);
  border-color: var(--colour-notice-deal-text);
}
.notice.is-strong {
  color: hsl(32, 70%, 99%);
  color: var(--colour-notice-strong-text);
  background-color: #d9381c;
  background-color: var(--colour-notice-strong-fill);
}
.notice.is-important {
  color: hsl(0, 0%, 12%);
  color: var(--colour-notice-important-text);
  background-color: hsl(285, 65%, 90%);
  background-color: var(--colour-notice-important-fill);
}
.fixed-bottom-element {
  pointer-events: none;
}
.fixed-bottom-element > * {
  pointer-events: auto;
}
.fixed-bottom-element .notice-container {
  margin-bottom: 1.5rem;
}
.fixed-bottom-element .notice {
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.05), 0px -2px 26px rgba(0, 0, 0, 0.05);
  box-shadow: 0px 4px 4px var(--colour-elevation-low), 0px -2px 26px var(--colour-elevation-low);
  border-radius: 6px;
  margin: 0px 1.5rem;
}
.fixed-bottom-element .card {
  order: 2;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .notice {
    left: auto;
    left: initial;
    padding: 1rem 1.5rem;
  }
}
.notice.is-raised {
  border-radius: 5px;
  border: 1px solid hsla(0, 0%, 12%, 0.08);
  border: 1px solid var(--colour-notice-raised-border);
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.05), 0px -2px 26px rgba(0, 0, 0, 0.05);
  box-shadow: 0px 4px 4px var(--colour-elevation-low), 0px -2px 26px var(--colour-elevation-low);
}
.callout {
  display: flex;
  padding: 1.5rem;
  font-size: 1rem;
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-high-contrast);
  gap: 1rem;
}
.callout:not(.has-border) {
  padding-left: 0px;
  padding-right: 0px;
}
.callout .icon {
  font-size: 1.125rem;
  margin-top: 0.125rem;
  flex-shrink: 0;
}
.callout .title {
  font-size: 1.125rem;
  font-weight: 500;
}
.callout .title + p {
  margin-top: 0.5rem;
}
.callout p {
  margin-bottom: 0px;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .callout {
    font-size: 1.125rem;
    padding: 2rem;
    margin-bottom: 1rem;
  }
  .callout .icon {
    font-size: 1.25rem;
  }
  .callout .title {
    font-size: 1.25rem;
  }
  .callout .title + p {
    margin-top: 1rem;
  }
}
.container > .callout:not(.has-border) {
  padding: 1.5rem 0;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .container > .callout:not(.has-border) {
    padding: 2rem;
  }
}
.callout.has-coloured-icon .icon {
  color: #EA482C;
  color: var(--colour-callout-icon);
}
.callout.has-border {
  display: inline-flex;
  border: 1px solid hsl(32, 15%, 88%);
  border: 1px solid var(--colour-callout-border);
  border-radius: 5px;
}
.callout.has-border.has-error {
  border-color: hsl(285, 65%, 50%);
  border-color: var(--colour-callout-border-error);
}
:where(button, a).callout {
  width: 100%;
}
@media (hover: hover) {
  :where(button, a).callout:hover {
    background-color: hsl(32, 45%, 96%);
    background-color: var(--colour-action-hover);
  }
}
:where(button, a).callout:hover {
  text-decoration: none;
}
.radio-callout {
  display: flex;
  padding: 1.5rem;
  font-size: 1rem;
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-high-contrast);
  gap: 0.5rem;
  border: 1px solid hsl(32, 15%, 88%);
  border: 1px solid var(--colour-callout-border);
  border-radius: 5px;
  margin-bottom: 0.5rem;
  flex-direction: column;
  width: 100%;
  margin-left: 0px;
  cursor: pointer;
}
.radio-callout span {
  line-height: 1.35em;
}
.radio-callout:has(input:not(:checked)) span:not(:first-of-type) {
  color: hsl(32, 6%, 46%);
  color: var(--colour-text-muted);
}
.radio-callout:has(input:checked + span:first-of-type) {
  background: hsl(32, 15%, 88%);
  background: var(--colour-action-border);
}
.radio-callout span:not(:only-of-type):first-of-type {
  font-weight: 500;
}
.radio-callout span:first-of-type {
  font-size: 1.125rem;
}
.radio-callout span:first-of-type::before {
  content: "";
  width: 1em;
  height: 1em;
  display: inline-block;
  border-radius: 1em;
  box-sizing: border-box;
  border: 0.125em solid hsl(0, 0%, 12%);
  border: 0.125em solid var(--colour-radio-outline);
  margin-block-end: -0.175em;
  margin-inline-end: 0.5rem;
}
.radio-callout input {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.radio-callout input:checked + span:first-of-type::before {
  background-color: hsl(0, 0%, 12%);
  background-color: var(--colour-radio-checkmark);
  border-color: hsl(49, 93%, 52%);
  border-color: var(--colour-radio-fill);
  border-width: 0.25em;
}
.radio-callout input:focus-visible + span:first-of-type::before {
  outline: 4px solid hsla(32, 15%, 50%, 0.3);
  outline: 4px solid var(--colour-focus-outline);
  outline-offset: 3px;
}
@supports not selector(:focus-visible) {
  .radio-callout input:focus + span:first-of-type {
    outline: 4px solid hsla(32, 15%, 50%, 0.3);
    outline: 4px solid var(--colour-focus-outline);
    outline-offset: 3px;
  }
}
.error-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.error-state > svg {
  width: 6.25rem;
  height: 6.25rem;
  margin-bottom: 2.5rem;
}
.error-state h1 {
  font-size: 2.25rem;
  margin-top: 0px;
  margin-bottom: 1rem;
}
.error-state p {
  margin-bottom: 1.5rem;
}
@keyframes pulse-fade {
  from {
    opacity: 1;
  }
  to {
    opacity: 0.36;
  }
}
.skeleton {
  animation: pulse-fade 0.6s ease-in-out infinite alternate;
}
.skeleton.is-heading {
  max-width: 65ch;
  height: 2.25rem;
  margin-bottom: 1.5rem;
}
.skeleton.is-heading::after {
  content: "";
  width: calc(0.8 * 100%);
  height: 100%;
  background: rgba(147, 147, 147, 0.3);
  display: block;
}
.skeleton.is-heading.is-small {
  height: 1.75rem;
}
.skeleton.is-heading.is-large {
  height: 2.875rem;
}
.skeleton.is-chip {
  width: 11.25rem;
  height: 2.25rem;
  background: rgba(147, 147, 147, 0.3);
  border-radius: 9999px;
}
.skeleton.is-paragraph {
  --lines: 2;
  width: 100%;
  max-width: 65ch;
  height: calc(2.25rem * 2 - 2.25rem);
  height: calc(2.25rem * var(--lines) - 2.25rem);
  margin-bottom: 3.375rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='rgba(147, 147, 147, 0.3)' %3E%3Cpattern id='lines' x='0' y='0' width='100%25' height='36' patternUnits='userSpaceOnUse' %3E%3Crect class='checker' x='0' width='100%25' height='18' y='0'/%3E%3C/pattern%3E%3Crect x='0' y='0' width='100%25' height='100%25' fill='url(%23lines)' /%3E%3C/svg%3E");
  position: relative;
}
.skeleton.is-paragraph::after {
  content: "";
  width: calc(0.4 * 100%);
  height: 1.125rem;
  position: absolute;
  top: 100%;
  background: rgba(147, 147, 147, 0.3);
}
[data-tooltip] {
  position: relative;
}
[data-tooltip]::after {
  content: attr(data-tooltip);
  display: flex;
  position: absolute;
  top: calc(100% + 0.5rem);
  left: 50%;
  transform: translateX(-50%);
  padding: 0.5rem 0.75rem;
  font-size: 1rem;
  line-height: 1;
  color: hsl(32, 70%, 99%);
  color: var(--colour-text-invert);
  background-color: hsl(0, 0%, 12%);
  background-color: var(--colour-tooltip-fill);
  border-radius: 6px;
  z-index: 7;
  white-space: nowrap;
  transition: all 0.125s 0.5s ease-in;
  opacity: 0;
  visibility: hidden;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.05), 0px -2px 26px rgba(0, 0, 0, 0.05);
  box-shadow: 0px 4px 4px var(--colour-elevation-low), 0px -2px 26px var(--colour-elevation-low);
}
@media (hover: hover) {
  [data-tooltip]:hover::after {
    opacity: 1;
    visibility: visible;
  }
}
nav.list-nav {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  padding-top: 0.5rem;
}
@media (hover: hover) {
  nav.list-nav {
    -ms-overflow-style: auto;
    scrollbar-color: transparent transparent;
    scrollbar-width: thin;
  }
  nav.list-nav::-webkit-scrollbar-thumb {
    background-color: transparent;
    border-radius: 7px;
  }
  nav.list-nav::-webkit-scrollbar-track {
    background-color: transparent;
  }
  nav.list-nav::-webkit-scrollbar {
    width: 7px;
    height: 7px;
  }
  nav.list-nav:hover {
    scrollbar-color: hsla(0, 0%, 40%, 0.5) transparent;
    transition-delay: 0s;
  }
  nav.list-nav:hover::-webkit-scrollbar-thumb {
    background-color: hsla(0, 0%, 40%, 0.5);
  }
}
@media (hover: none) {
  nav.list-nav {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  nav.list-nav::-webkit-scrollbar {
    display: none;
  }
}
nav.list-nav ul {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 0px;
  padding: 0px;
}
nav.list-nav ul li {
  list-style: none;
}
nav.list-nav ul li a {
  width: 100%;
  display: inline-block;
  font-size: 1.125rem;
  padding: 0.5rem 0px;
}
nav.list-nav ul + ul {
  margin-top: 0.5rem;
}
nav.list-nav ul.is-nav-primary li a {
  font-size: 1.375rem;
  padding: 0.625rem 0px;
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  nav.list-nav hr {
    margin: 2rem 0px;
  }
}
nav.tree-nav {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}
nav.tree-nav ul {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
nav.tree-nav ul li a {
  line-height: 1;
  padding-block: 0.5625rem;
  padding-inline: 0.6875rem;
  border-radius: 6px;
  display: inline-block;
  color: hsl(0, 0%, 12%);
  color: var(--colour-tree-nav-link-text);
  order: 2;
}
nav.tree-nav ul li a:hover {
  text-decoration: none;
}
nav.tree-nav ul li a:hover {
  background-color: hsl(32, 25%, 93%);
  background-color: var(--colour-tree-nav-link-hover);
}
nav.tree-nav ul li a.is-active {
  color: hsl(0, 0%, 12%);
  color: var(--colour-tree-nav-link-text-invert);
  background-color: hsl(49, 93%, 52%);
  background-color: var(--colour-tree-nav-link-active);
}
nav.tree-nav details {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
nav.tree-nav details summary {
  display: inline-flex;
  align-items: center;
  list-style: none;
  position: relative;
}
nav.tree-nav details summary::-webkit-details-marker {
  display: none;
}
nav.tree-nav details summary::before, nav.tree-nav details summary::after {
  content: "";
  block-size: 2.25rem;
  inline-size: 2.25rem;
  margin-inline-end: 0.125rem;
  cursor: pointer;
}
nav.tree-nav details summary::before {
  border-radius: 6px;
  position: absolute;
  order: 0;
}
nav.tree-nav details summary::after {
  transform: rotate(-90deg);
  -webkit-mask: url("data:image/svg+xml,%3Csvg id='Bold' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ctitle%3Earrow-down-1%3C/title%3E%3Cpath d='M12,19.5a2.3,2.3,0,0,1-1.729-.78L.46,7.568A1.847,1.847,0,0,1,3.233,5.129l8.579,9.752a.25.25,0,0,0,.376,0l8.579-9.752A1.847,1.847,0,1,1,23.54,7.568L13.732,18.716A2.31,2.31,0,0,1,12,19.5Z'/%3E%3C/svg%3E");
          mask: url("data:image/svg+xml,%3Csvg id='Bold' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ctitle%3Earrow-down-1%3C/title%3E%3Cpath d='M12,19.5a2.3,2.3,0,0,1-1.729-.78L.46,7.568A1.847,1.847,0,0,1,3.233,5.129l8.579,9.752a.25.25,0,0,0,.376,0l8.579-9.752A1.847,1.847,0,1,1,23.54,7.568L13.732,18.716A2.31,2.31,0,0,1,12,19.5Z'/%3E%3C/svg%3E");
  -webkit-mask-size: 0.7em;
          mask-size: 0.7em;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center;
          mask-position: center;
  transition: transform 0.25s ease-in-out;
  background-color: hsl(32, 8%, 67%);
  background-color: var(--colour-tree-nav-disclosure-button-icon);
  order: 1;
}
nav.tree-nav details summary:has(:not(a:hover)):hover::before {
  background-color: hsl(32, 45%, 96%);
  background-color: var(--colour-tree-nav-disclosure-button-hover);
}
nav.tree-nav details[open] > summary::after {
  transform: rotate(0deg);
}
nav.tree-nav details ul {
  padding-block-start: 0.5rem;
  padding-inline-start: 2.375rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  nav.tree-nav details ul {
    padding-inline-start: 2.6875rem;
  }
  nav.tree-nav ul li a {
    padding-block: 0.75rem;
    padding-inline: 1rem;
  }
  nav.tree-nav details summary::before, nav.tree-nav details summary::after {
    block-size: 2.5625rem;
    inline-size: 2.5625rem;
  }
}
.progress-bar {
  --step: 0/1;
  --step-percent: calc(var(--step) * 100%);
  width: 100%;
  height: 5px;
  background: linear-gradient(to right, #EA482C calc(0/1 * 100%), rgba(159, 137, 111, 0.2) calc(0/1 * 100%));
  background: linear-gradient(to right, var(--colour-progress-bar-fill) var(--step-percent), var(--colour-progress-bar-bg) var(--step-percent));
}
.progress-bar.is-loading-indeterminate {
  --step: 1/2;
  opacity: 0;
  background: rgba(159, 137, 111, 0.2);
  background: var(--colour-progress-bar-bg);
  animation: fade 0.5s 0.5s ease-out 1 forwards;
}
.progress-bar.is-loading-indeterminate::after {
  content: "";
  display: block;
  height: 100%;
  width: calc(var(--step) * 100%);
  background: hsl(49, 93%, 52%);
  background: var(--colour-progress-bar-loading-fill);
  transform: translateX(calc(var(--step) * -100vw));
  animation: bar 1.2s 1s cubic-bezier(0.65, 0.05, 0.36, 1) infinite;
  transform-origin: left;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .progress-bar.is-loading-indeterminate {
    --step: 1/3;
  }
}
@keyframes fade {
  to {
    opacity: 1;
  }
}
@keyframes bar {
  to {
    transform: translateX(100vw) scaleX(2);
  }
}
.google-map {
  width: 100%;
}
.google-map .custom-map-ui.is-ui-control,
.google-map .gm-fullscreen-control,
.google-map .gm-bundled-control-on-bottom [style~="border-radius:"] {
  border-radius: 6px !important;
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.12) !important;
  z-index: 1 !important;
}
.google-map div[role=dialog] {
  padding: 12px !important;
}
.google-map div[role=dialog] div {
  overflow: hidden !important;
}
.google-map .custom-map-popover {
  font-family: "Founders Grotesk", sans-serif;
  font-size: 1rem;
  line-height: 1.25;
  text-align: center;
  margin: 0 10px;
  overflow: hidden;
  color: hsl(0, 0%, 12%);
  color: var(--colour-black);
}
.google-map .custom-map-popover strong {
  font-weight: 500;
}
.google-map .custom-map-ui.is-ui-control {
  display: flex;
  gap: 0.5rem;
  margin: 0.625rem !important;
  padding: 0.625rem;
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-high-contrast);
  color: hsl(0, 0%, 12%);
  color: var(--colour-text);
  font-family: "Founders Grotesk", sans-serif;
  font-size: 1rem;
  line-height: 1.25;
}
.google-map .custom-map-ui.is-ui-control > .icon {
  margin: 0.125em 0;
}
.google-map .custom-map-ui.is-ui-control.is-top-left {
  width: calc(100% - 10px * 4 - 40px);
  max-width: 27ch;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .google-map .custom-map-ui.is-ui-control.is-top-left {
    width: auto;
    max-width: 65ch;
  }
}
.google-map .custom-map-ui.is-map-overlay {
  position: absolute;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
}
.google-map .custom-map-ui.is-map-overlay.is-gradient-top {
  background: linear-gradient(rgba(0, 0, 0, 0.12), rgba(0, 0, 0, 0), rgba(0, 0, 0, 0), rgba(0, 0, 0, 0));
  pointer-events: none;
}
.is-order-map {
  transition: filter cubic-bezier(0.45, 0.05, 0.55, 0.95) 1s;
  position: relative;
}
.is-order-map::before {
  content: "";
  width: 100%;
  display: block;
  padding-top: 71.4285714286%;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .is-order-map {
    position: relative;
  }
  .is-order-map::before {
    content: "";
    width: 100%;
    display: block;
    padding-top: 33.3333333333%;
  }
}
.is-order-map.has-stale-location {
  filter: grayscale(1);
}
.is-checkout-map {
  border-radius: 10px;
  margin-bottom: 1rem;
  position: relative;
}
.is-checkout-map::before {
  content: "";
  width: 100%;
  display: block;
  padding-top: 56.25%;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .is-checkout-map {
    float: right;
    max-width: 20rem;
    position: relative;
  }
  .is-checkout-map::before {
    content: "";
    width: 100%;
    display: block;
    padding-top: 66.6666666667%;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .is-checkout-map {
    max-width: 23.75rem;
    position: relative;
  }
  .is-checkout-map::before {
    content: "";
    width: 100%;
    display: block;
    padding-top: 56.25%;
  }
}
.order-status > div {
  display: flex;
}
.order-status > div:not(:last-of-type) {
  margin-bottom: 0.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .order-status.is-header > div {
    justify-content: center;
  }
}
.order-status .headline {
  font-size: 1.75rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .order-status .headline {
    font-size: 2.25rem;
  }
}
.order-status .step-description {
  font-size: 1.125rem;
  align-items: center;
}
.order-status .step-description > .icon {
  margin-right: 0.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .order-status .step-description {
    font-size: 1.375rem;
  }
}
.order-image {
  width: 100%;
  position: relative;
  aspect-ratio: 8/5;
  background-color: hsl(32, 25%, 93%);
  background-color: var(--colour-image-placeholder);
  background-position: center;
  background-size: cover;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .order-image {
    aspect-ratio: 3/1;
  }
}
.product-listing-with-image, .product-listing {
  display: flex;
  padding: 1.5rem 0px;
  align-items: flex-start;
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-high-contrast);
  text-decoration: none;
}
.product-listing-with-image:hover, .product-listing:hover {
  text-decoration: none;
}
@media (hover: none) {
  .product-listing-with-image, .product-listing {
    cursor: default;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-touch-callout: none;
  }
}
@media (max-aspect-ratio: 3/4), (max-width: 767.98px) {
  .product-listing-with-image:not(:last-of-type), .product-listing:not(:last-of-type) {
    border-bottom: 1px solid hsl(32, 12%, 85%);
    border-bottom: 1px solid var(--colour-divider);
  }
}
.is-unavailable.product-listing-with-image .title, .is-unavailable.product-listing .title,
.is-unavailable.product-listing-with-image .description,
.is-unavailable.product-listing .description,
.is-unavailable.product-listing-with-image .price,
.is-unavailable.product-listing .price {
  color: hsl(32, 6%, 46%);
  color: var(--colour-text-muted);
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .is-unavailable.product-listing-with-image, .is-unavailable.product-listing {
    background-color: transparent;
    background-color: initial;
    border: 1px solid hsl(32, 15%, 88%);
    border: 1px solid var(--colour-action-border);
  }
}
.product-listing-with-image .title, .product-listing .title {
  order: 1;
  font-size: 1.25rem;
  font-weight: 500;
  margin-right: auto;
}
.product-listing-with-image .badge.is-quantity, .product-listing .badge.is-quantity {
  order: 2;
}
.product-listing-with-image .description, .product-listing .description {
  order: 3;
  width: 100%;
  font-size: 1rem;
  color: hsl(32, 6%, 46%);
  color: var(--colour-text-muted);
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .product-listing-with-image .description, .product-listing .description {
    font-size: 1.125rem;
  }
}
.product-listing-with-image .description:where(:empty), .product-listing .description:where(:empty) {
  display: none !important;
}
.product-listing-with-image .description > p, .product-listing .description > p {
  margin: 0px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
  word-wrap: break-word;
  word-break: break-word;
}
.product-listing-with-image .description > p:where(:empty), .product-listing .description > p:where(:empty) {
  display: none !important;
}
.product-listing-with-image .description > p:not(:empty), .product-listing .description > p:not(:empty) {
  margin-top: 1rem;
}
.product-listing-with-image .price, .product-listing .price {
  order: 4;
  align-self: center;
  font-size: 1.125rem;
  font-weight: 500;
  margin-right: 1rem;
  margin-top: 1rem;
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  gap: 1rem;
}
.product-listing-with-image .price:where(:empty), .product-listing .price:where(:empty) {
  display: none !important;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .product-listing-with-image .price, .product-listing .price {
    flex-direction: row;
  }
}
.product-listing-with-image .attributes, .product-listing .attributes {
  order: 5;
  align-self: center;
  margin-top: 1rem;
}
.product-listing-with-image .attributes > *, .product-listing .attributes > * {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
  margin-right: 0.5rem;
}
.product-listing-with-image .attributes:where(:empty), .product-listing .attributes:where(:empty) {
  display: none !important;
}
.product-listing-with-image .deals, .product-listing .deals {
  order: 6;
  margin-top: 1rem;
  width: 100%;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .product-listing-with-image, .product-listing {
    align-items: center;
    padding: 2.5rem;
  }
  .product-listing-with-image:not(:last-of-type), .product-listing:not(:last-of-type) {
    margin-bottom: 1rem;
  }
  .product-listing-with-image .title, .product-listing .title {
    order: 1;
    margin-right: inherit;
    margin-bottom: 0px;
    font-size: 1.75rem;
    margin-right: 1rem;
  }
  .product-listing-with-image .badge.is-quantity, .product-listing .badge.is-quantity {
    order: 4;
    margin-left: 1rem;
    align-self: center;
  }
  .product-listing-with-image .description, .product-listing .description {
    order: 5;
    font-size: 1.125rem;
  }
  .product-listing-with-image .price, .product-listing .price {
    order: 3;
    margin-top: 0px;
    margin-bottom: 0px;
    margin-right: 0px;
    margin-left: auto;
    font-size: 1.375rem;
  }
  .product-listing-with-image .attributes, .product-listing .attributes {
    order: 2;
    margin-top: 0px;
  }
}
.product-listing {
  flex-wrap: wrap;
}
.product-listing-with-image .description > p {
  -webkit-line-clamp: 6;
  word-wrap: break-word;
  word-break: break-word;
}
.product-listing-with-image .product-details {
  display: flex;
  flex-grow: 1;
  flex-wrap: wrap;
}
.product-listing-with-image .product-image {
  background-position: center;
  background-size: cover;
  width: 100%;
  max-width: 6.875rem;
  margin-left: 1rem;
  position: relative;
  flex-shrink: 0;
  align-self: flex-start;
  background-image: linear-gradient(0deg, hsl(32, 25%, 93%) 0%, hsl(32, 25%, 93%) 100%);
  background-image: var(--colour-image-product-placeholder);
  aspect-ratio: 1/1;
}
.product-listing-with-image .product-image .badge.is-quantity {
  position: absolute;
  bottom: 100%;
  left: 100%;
  transform: translate(-50%, 50%);
  margin: 0px;
}
.product-listing-with-image.is-unavailable .product-image {
  mix-blend-mode: luminosity;
  opacity: 0.3;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .product-listing-with-image .product-image {
    max-width: 7.5rem;
    margin-left: 1.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .product-listing-with-image .product-image {
    max-width: 10rem;
    margin-left: 2.5rem;
    aspect-ratio: 4/3;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .product-listing-with-image .product-image {
    max-width: 12.5rem;
  }
}
.product-listing-is-grid {
  --max-lines: 3;
  --last-lines: 1;
  --title-line-height: 1.4;
  --space-character-width: 0.306ch;
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-high-contrast);
  padding: 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  font-size: 1rem;
  text-decoration: none;
  align-items: flex-start;
  position: relative;
}
.product-listing-is-grid:hover {
  text-decoration: none;
}
@media (hover: none) {
  .product-listing-is-grid {
    cursor: default;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-touch-callout: none;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .product-listing-is-grid {
    padding: 1.5rem;
    gap: 1rem;
  }
}
.product-listing-is-grid > .product-image {
  width: 100%;
  aspect-ratio: 1/1;
  background-size: cover;
  background-position: center;
  background-image: linear-gradient(0deg, hsl(32, 25%, 93%) 0%, hsl(32, 25%, 93%) 100%);
  background-image: var(--colour-image-product-placeholder);
  position: relative;
}
:root:has(#colour-scheme-dark:checked) .product-listing-is-grid > .product-image {
  background-color: white;
  background-color: var(--colour-image-background-fill);
  background-repeat: no-repeat;
  background-size: 84%;
  border-radius: 12px;
}
@media (prefers-color-scheme: dark) {
  :root:not(:has(#colour-scheme-light:checked)) .product-listing-is-grid > .product-image {
    background-color: white;
    background-color: var(--colour-image-background-fill);
    background-repeat: no-repeat;
    background-size: 84%;
    border-radius: 12px;
  }
}
.product-listing-is-grid > .product-image .badge.is-quantity {
  position: absolute;
  inset-block-start: -0.5rem;
  inset-inline-end: -0.5rem;
}
.product-listing-is-grid > .product-details {
  height: calc(1em * (var(--max-lines)) * var(--title-line-height));
}
.product-listing-is-grid > .product-details p {
  display: flex;
  flex-wrap: wrap;
  -moz-column-gap: var(--space-character-width);
       column-gap: var(--space-character-width);
  line-height: var(--title-line-height);
  margin: 0px;
  overflow-wrap: anywhere;
}
.product-listing-is-grid > .product-details p > span:first-of-type {
  display: -webkit-inline-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: calc(var(--max-lines) - var(--last-lines));
  overflow: hidden;
  overflow: clip;
}
.product-listing-is-grid > .product-details p:not(:has(span:not(:first-of-type))) > span {
  -webkit-line-clamp: var(--max-lines);
}
.product-listing-is-grid > .product-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  width: 100%;
  height: 1.25rem;
  margin-top: auto;
}
.product-listing-is-grid > .product-footer > .button {
  position: absolute;
  inset-inline-end: -0.5rem;
}
.product-listing-is-grid > .product-footer > .price {
  font-size: 1rem;
  font-weight: 500;
}
.product-listing-is-grid > .quick-quantity-controls {
  width: 100%;
  position: absolute;
  inset-inline: 0;
  inset-block-end: 0;
  padding: 0.25rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .product-listing-is-grid > .quick-quantity-controls {
    padding: 1rem;
  }
}
.product-listing-is-grid.is-unavailable {
  background-color: transparent;
  background-color: initial;
}
.product-listing-is-grid.is-unavailable .product-details,
.product-listing-is-grid.is-unavailable .price {
  color: hsl(32, 6%, 46%);
  color: var(--colour-text-muted);
}
.product-listing-is-grid.is-unavailable .product-image {
  mix-blend-mode: luminosity;
  opacity: 0.3;
}
.product-image-large {
  display: flex;
  flex-shrink: 0;
  justify-content: center;
  min-height: 3.75rem;
  background-color: hsl(32, 25%, 93%);
  background-color: var(--colour-image-placeholder);
  background-size: cover;
  background-position: center;
  position: relative;
  margin-top: -3.75rem;
}
.product-image-large > .images-container {
  --product-image-large-aspect: 4/3;
  width: 100%;
  display: flex;
  overflow-x: auto;
  aspect-ratio: 4/3;
  aspect-ratio: var(--product-image-large-aspect);
  scroll-snap-type: inline mandatory;
}
.product-image-large > .images-container {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.product-image-large > .images-container::-webkit-scrollbar {
  display: none;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .product-image-large {
    padding: 1.5rem 0px;
  }
  .product-image-large::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: hsla(32, 25%, 85%, 0.75);
    background-color: var(--colour-image-background-fade);
    -webkit-backdrop-filter: blur(10px) saturate(1.2);
            backdrop-filter: blur(10px) saturate(1.2);
  }
}
:where(.product-image-large.has-background-image, .product-image-large.has-background-image > .images-container > .image-container) {
  background-image: var(--jpeg-2x-path);
  background-image: -webkit-image-set(var(--webp-2x-path) 2x, var(--webp-1x-path) 1x);
  background-image: image-set(var(--webp-2x-path) 2x, var(--webp-1x-path) 1x);
}
.product-image-large.has-background-image > .images-container > .image-container {
  width: 100%;
  min-width: 100%;
  background-color: hsl(32, 25%, 93%);
  background-color: var(--colour-image-placeholder);
  background-size: cover;
  background-position: center;
  aspect-ratio: var(--product-image-large-aspect);
  scroll-snap-align: center;
  scroll-snap-stop: always;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .product-image-large.has-background-image > .images-container {
    max-width: 470px;
    border-radius: 16px;
    box-shadow: 2px 0px 24px 0px rgba(0, 0, 0, 0.04), -2px 0px 24px 0px rgba(0, 0, 0, 0.04);
    z-index: 1;
  }
}
.product-image-large.is-square {
  background-size: 225%;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .product-image-large.is-square::after {
    -webkit-backdrop-filter: blur(26px) saturate(1.2);
            backdrop-filter: blur(26px) saturate(1.2);
  }
  .product-image-large.is-square > .images-container {
    --product-image-large-aspect: 1/1;
    max-width: 360px;
  }
}
@media (max-aspect-ratio: 3/4), (max-width: 767.98px) {
  .product-image-large.is-square {
    aspect-ratio: var(--product-image-large-aspect);
    background: white;
    background: var(--colour-image-background-fill);
  }
}
.product-image-large.is-square > .images-container > .image-container {
  background-size: contain;
  background-repeat: no-repeat;
  border: 2rem solid white;
  border: 2rem solid var(--colour-image-background-fill);
  background-color: white;
  background-color: var(--colour-image-background-fill);
}
.images-container > .navigation-controls {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: inherit;
  pointer-events: none;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .images-container > .navigation-controls {
    padding: 1.5rem 0px;
  }
}
.images-container > .navigation-controls > button {
  pointer-events: initial;
}
.images-container > .pagination-indicator {
  position: absolute;
  bottom: 0;
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: inherit;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .images-container > .pagination-indicator {
    padding: 1.5rem 0px;
  }
}
@media (hover: none) {
  .images-container > .pagination-indicator {
    cursor: default;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-touch-callout: none;
  }
}
.images-container > .pagination-indicator > .indicator-dot {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 32px;
  height: 32px;
  cursor: pointer;
}
.images-container > .pagination-indicator > .indicator-dot > div {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: hsl(32, 18%, 90%);
  background: var(--colour-action-disabled);
  transition-property: all;
  transition-duration: 0.1s;
  transition-timing-function: ease-in-out;
}
.images-container > .pagination-indicator > .indicator-dot.is-active div {
  background: hsl(49, 93%, 52%);
  background: var(--colour-action-active);
  width: 12px;
  height: 12px;
}
.orders-listing {
  display: flex;
  flex-direction: column;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .orders-listing.is-active-order:not(:last-of-type) {
    margin-bottom: 1rem;
  }
}
.orders-listing.is-past-order {
  background-color: hsl(32, 70%, 99%);
  background-color: var(--colour-bg-high-contrast);
}
.orders-listing.is-past-order:not(:last-of-type) {
  margin-bottom: 1rem;
}
.orders-listing.is-past-order > .order-details {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  order: 2;
}
.orders-listing.is-past-order > .order-details {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .orders-listing.is-past-order > .order-details {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .orders-listing.is-past-order > .order-details {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .orders-listing.is-past-order > .order-details {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
.orders-listing.is-past-order > .order-details {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .orders-listing.is-past-order > .order-details {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .orders-listing.is-past-order > .order-details {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .orders-listing.is-past-order > .order-details {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
.orders-listing.is-past-order > .order-details .title {
  font-size: 1.375rem;
}
.orders-listing.is-past-order > .order-details > :not(:last-child) {
  margin-bottom: 1.5rem;
}
.orders-listing.is-past-order > .order-details > div > :not(:last-child) {
  margin-bottom: 0.75rem;
}
.orders-listing.is-past-order .restaurant-image {
  order: 1;
  width: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  background-position: center center;
  background-color: hsl(32, 25%, 93%);
  background-color: var(--colour-image-placeholder);
  background-image: url("/assets/static/images/restaurant-card-placeholder2-55922548.svg");
  aspect-ratio: 5/3;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .orders-listing.is-past-order {
    flex-direction: initial;
  }
  .orders-listing.is-past-order .order-details {
    flex-direction: initial;
    align-items: center;
    justify-content: space-between;
    order: 1;
    margin-bottom: 0px;
  }
  .orders-listing.is-past-order .order-details .title {
    font-size: 1.75rem;
  }
  .orders-listing.is-past-order .order-details > :not(:last-child) {
    margin-bottom: 0px;
  }
  .orders-listing.is-past-order .restaurant-image {
    order: 2;
    max-width: 300px;
  }
}
.catalog-section-heading {
  padding: 2rem 0px;
}
.catalog-section-heading :where(h1, h2, h3, h4, h5) {
  margin: 0;
}
.catalog-section-heading > p {
  margin-top: 1rem;
}
.catalog-section-heading > p:where(:empty) {
  display: none !important;
}
.catalog-section-heading > .title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-block-size: 2.25rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .catalog-section-heading {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .catalog-section-heading {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .catalog-section-heading {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .catalog-section-heading {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) and (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  body > .catalog-section-heading, body > turbo-frame > .catalog-section-heading {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
.restaurant-header {
  display: flex;
  flex-direction: column;
}
.restaurant-header p {
  font-size: 1.125rem;
}
.restaurant-header .details > :first-child {
  margin-top: 0px;
}
.restaurant-header .details > :last-child {
  margin-bottom: 0px;
}
.restaurant-header .attributes {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 1.5rem;
}
.restaurant-header .header-image {
  position: relative;
  order: 1;
  width: 100%;
  background-position: center;
  background-size: cover;
  min-height: 3.75rem;
  flex-shrink: 0.25;
  background-color: hsl(32, 25%, 93%);
  background-color: var(--colour-image-placeholder);
  aspect-ratio: 8/5;
  margin-top: -3.75rem;
}
.restaurant-header .header-image.is-closed::after {
  height: 100%;
  width: 100%;
  background-color: hsla(32, 25%, 85%, 0.75);
  background-color: var(--colour-image-background-fade);
}
.restaurant-header .header-controls {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  display: flex;
  justify-content: flex-end;
  gap: 1rem;
}
.restaurant-header .header-controls {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .restaurant-header .header-controls {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .restaurant-header .header-controls {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .restaurant-header .header-controls {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
.restaurant-header .header-controls {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .restaurant-header .header-controls {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .restaurant-header .header-controls {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .restaurant-header .header-controls {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  :where(body, .app-view, header, .overlay:where(.is-menu, .is-sidebar)) > .restaurant-header .header-controls, :where(body, .app-view) > :where(section, turbo-frame, .cover, details.required-choice) > .restaurant-header .header-controls, :where(body, .app-view) > :where(turbo-frame, .restaurant-header, section#catalog) > section > .restaurant-header .header-controls, :where(body, .app-view) > section :where(.grid.has-aside, .column) > .restaurant-header .header-controls, :where(body, .app-view) > .cover > :where(.cover-content, header) > .restaurant-header .header-controls, :where(body, .app-view) > section .column > section > .restaurant-header .header-controls, :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > .restaurant-header .header-controls, :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > :where(a, .overlay-header) > .restaurant-header .header-controls {
    padding-left: 4.375rem;
    padding-right: 4.375rem;
  }
}
@media (max-aspect-ratio: 3/4), (max-width: 767.98px) {
  .restaurant-header .header-controls {
    padding-top: 0.75rem;
  }
}
.restaurant-header > section {
  order: 2;
  flex-grow: 1;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .restaurant-header {
    flex-direction: row;
    justify-content: space-between;
  }
  .restaurant-header p {
    font-size: 1.25rem;
  }
  .restaurant-header .header-image,
  .restaurant-header > section {
    order: revert;
  }
  .restaurant-header .header-image {
    margin-top: 0px;
    width: 50%;
    max-height: 600px;
    max-width: 870px;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .restaurant-header .details > *:not(:first-child):not(:last-child):not(.badge) {
    margin: 2rem 0px;
  }
  .restaurant-header h2 {
    font-size: 3.5rem;
  }
}
.line-item {
  display: flex;
  justify-content: space-between;
  margin-bottom: 1rem;
  align-items: center;
}
.line-item:not(.has-full-description) {
  gap: 0.5rem;
}
.line-item .additional-cost.negative::before {
  content: "- ";
}
.line-item .additional-cost.positive::before {
  content: "+ ";
}
.line-item .additional-cost:where(:empty) {
  display: none !important;
}
.line-item .value {
  min-width: 6ch;
  text-align: right;
}
.line-item label {
  display: flex;
  flex: 1 1;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
}
.line-item label .label-text {
  flex: 1 1;
}
.line-item .checkbox,
.line-item .radio {
  display: contents;
  margin-bottom: 0px;
}
.line-item .checkbox span.additional-cost,
.line-item .radio span.additional-cost {
  white-space: nowrap;
}
.line-item .quantity-input {
  margin-bottom: 0px;
  height: 2.875rem;
}
.line-item .quantity-input input[type=number] {
  padding: 0.375rem;
}
.line-item.is-large {
  font-size: 1.75rem;
}
.line-item .thumbnail-image {
  width: 50px;
  height: 50px;
}
.line-item .thumbnail-image[style*=background-image] {
  position: relative;
  background-position: center;
  background-size: cover;
}
.line-item.is-secondary {
  border-radius: 5px;
  padding: 0.5rem 0.5rem 0.5rem 1rem;
  background-color: hsl(32, 45%, 96%);
  background-color: var(--colour-line-item-secondary-bg);
}
.line-item.is-secondary label {
  font-size: 1rem;
}
.line-item.is-disabled {
  color: hsl(32, 6%, 46%);
  color: var(--colour-text-muted);
}
.line-item.is-disabled .thumbnail-image {
  filter: grayscale(1);
  opacity: 0.5;
}
.line-item.is-removed .label-text,
.line-item.is-removed .additional-cost {
  text-decoration: line-through;
}
.line-item.is-removed .thumbnail-image::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: hsla(0, 0%, 100%, 0.7);
}
.line-item.is-removed .thumbnail-image::after {
  content: "";
  position: absolute;
  height: 24px;
  width: 24px;
  display: block;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-size: cover;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.5 3.5a12 12 0 1 0-17 17 12 12 0 0 0 17-17ZM5.3 5.3a9.6 9.6 0 0 1 12.3-1 .3.3 0 0 1 0 .4l-13 12.9a.3.3 0 0 1-.3 0 9.5 9.5 0 0 1 1-12.3Zm13.4 13.5a9.5 9.5 0 0 1-12.3.9.3.3 0 0 1 0-.3l13-13a.3.3 0 0 1 .4.1 9.5 9.5 0 0 1-1 12.3Z' fill='%23000'/%3E%3C/svg%3E");
}
.line-item.has-full-description {
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  margin-bottom: 1.5rem;
  row-gap: 1rem;
}
.line-item.has-full-description p {
  margin-block-end: 0;
}
.line-item.has-full-description:not(:last-child) {
  padding-bottom: 1.5rem;
  border-bottom: 1px solid hsl(32, 12%, 85%);
  border-bottom: 1px solid var(--colour-divider);
}
.line-item.has-full-description .title {
  font-size: 1.25rem;
  font-weight: 500;
  margin-right: auto;
  line-height: 1.35;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .line-item.has-full-description .title {
    font-size: 1.375rem;
  }
}
.line-item.has-full-description .description p:where(:empty) {
  display: none !important;
}
.line-item.has-full-description > :has(.title),
.line-item.has-full-description .description,
.line-item.has-full-description .item-options,
.line-item.has-full-description .meal-preference,
.line-item.has-full-description .substitution-preferences {
  width: 100%;
}
.line-item.has-full-description .price {
  font-weight: 500;
}
.line-item.has-full-description .chip.is-action {
  margin-left: 1rem;
  align-self: center;
}
.line-item.has-full-description .button {
  margin-top: 1rem;
}
.list {
  display: flex;
  flex-direction: column;
}
@media (hover: hover) {
  .list.has-hoverable-items .list-item:hover {
    background-color: hsl(32, 45%, 96%);
    background-color: var(--colour-action-hover);
  }
}
.list.has-hoverable-items .list-item:hover {
  text-decoration: none;
}
.list .list-item {
  align-items: center;
  display: flex;
  position: relative;
  padding: 0.5rem 1.5rem;
  gap: 1rem;
}
.list .list-item:focus {
  background-color: hsl(32, 45%, 96%);
  background-color: var(--colour-action-hover);
  outline: none;
}
.category-heading {
  display: flex;
  margin-bottom: 2rem;
}
.category-heading h1, .category-heading h2, .category-heading h3, .category-heading h4, .category-heading h5 {
  margin: 0px;
}
.category-heading > span > * {
  display: inline-block;
}
.category-heading > span > *:not(:last-child) {
  margin-right: 1.5rem;
}
.category-heading > span > *:not(:first-child) {
  margin-top: 0.5rem;
}
details.collapse p {
  margin-bottom: 1.5rem;
  font-size: 1rem;
  padding: 0 0.375rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  details.collapse p {
    font-size: 1.25rem;
  }
}
details.collapse + details.collapse {
  border-top: 1px solid transparent;
}
details.collapse + details.collapse:not([open]) {
  border-color: hsl(32, 15%, 88%);
  border-color: var(--colour-collapse-divider);
}
details.collapse > summary {
  padding: 0.75rem 0 0.75rem 0.375rem;
  font-size: 1rem;
  cursor: pointer;
  list-style: none;
  display: flex;
  line-height: 1.6em;
  align-items: center;
  border-radius: 4px;
}
details.collapse > summary > span {
  flex-grow: 1;
}
details.collapse > summary::-webkit-details-marker {
  display: none;
}
details.collapse > summary::after {
  content: "";
  width: 1rem;
  height: 1rem;
  margin: 0.625rem;
  display: block;
  transform: rotate(-180deg) scale(-1);
  -webkit-mask: url("data:image/svg+xml,%3Csvg id='Bold' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ctitle%3Earrow-down-1%3C/title%3E%3Cpath d='M12,19.5a2.3,2.3,0,0,1-1.729-.78L.46,7.568A1.847,1.847,0,0,1,3.233,5.129l8.579,9.752a.25.25,0,0,0,.376,0l8.579-9.752A1.847,1.847,0,1,1,23.54,7.568L13.732,18.716A2.31,2.31,0,0,1,12,19.5Z'/%3E%3C/svg%3E");
          mask: url("data:image/svg+xml,%3Csvg id='Bold' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ctitle%3Earrow-down-1%3C/title%3E%3Cpath d='M12,19.5a2.3,2.3,0,0,1-1.729-.78L.46,7.568A1.847,1.847,0,0,1,3.233,5.129l8.579,9.752a.25.25,0,0,0,.376,0l8.579-9.752A1.847,1.847,0,1,1,23.54,7.568L13.732,18.716A2.31,2.31,0,0,1,12,19.5Z'/%3E%3C/svg%3E");
  flex-shrink: 0;
  transition: transform 0.25s ease-in-out;
  background-color: hsl(0, 0%, 12%);
  background-color: var(--colour-text);
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  details.collapse > summary {
    font-size: 1.375rem;
  }
  details.collapse > summary::after {
    width: 1.125rem;
    height: 1.125rem;
  }
}
details.collapse[open] > summary {
  background-color: hsl(32, 45%, 96%);
  background-color: var(--colour-collapse-open);
  box-shadow: 0 0 0 4px hsl(32, 45%, 96%);
  box-shadow: 0 0 0 4px var(--colour-collapse-open);
  margin-bottom: 1.5rem;
}
details.collapse[open] > summary:after {
  transform: rotate(0deg) scale(-1);
}
section.bold-section {
  background-color: hsl(49, 93%, 52%);
  background-color: var(--colour-bg-bold);
  color: hsl(32, 70%, 99%);
  color: var(--colour-text-invert);
}
section.muted-section {
  background-color: #FAEAD8;
  background-color: var(--colour-bg-muted);
  color: hsl(0, 0%, 12%);
  color: var(--colour-text);
}
section.media-section {
  position: relative;
  width: 100%;
  aspect-ratio: 1/1;
  background-color: hsl(32, 25%, 93%);
  background-color: var(--colour-image-placeholder);
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  section.media-section {
    aspect-ratio: 21/9;
  }
}
section.media-section video {
  position: absolute;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
  z-index: 1;
}
section.media-section > .container {
  position: absolute;
  bottom: 0;
  width: 100%;
  z-index: 3;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  section.media-section > .container {
    text-align: center;
  }
}
section.media-section > .container h2 {
  color: hsl(32, 70%, 99%);
  color: var(--colour-white);
}
section.media-section > .container .text-input.has-error input {
  outline: 3px solid hsla(from hsl(285, 65%, 50%) h s l/0.5);
  outline-offset: 3px;
}
@supports (color: lab(from red l 1 1% / calc(alpha + 0.1))){
section.media-section > .container .text-input.has-error input {
  outline: 3px solid hsla(from var(--colour-text-input-error) h s l/0.5);
}
}
section.media-section > .container .text-input.has-error input:focus {
  outline-color: hsl(285, 65%, 50%);
  outline-color: var(--colour-text-input-error);
}
section.media-section > .container .text-input.has-error .error {
  color: hsl(32, 70%, 99%);
  color: var(--colour-white);
  background-color: hsl(285, 65%, 50%);
  background-color: var(--colour-text-input-error);
  padding: 0.25rem 0.5rem;
  margin-block-start: 0.625rem;
  border-radius: 5px;
  width: -moz-fit-content;
  width: fit-content;
}
section.media-section::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: linear-gradient(0deg, #1E1E1E 6%, rgba(30, 30, 30, 0) 75%), linear-gradient(0deg, rgba(30, 30, 30, 0.08), rgba(30, 30, 30, 0.08));
  background-position: center;
  background-size: cover;
  z-index: 1;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  section.media-section::after {
    background: linear-gradient(0deg, #1E1E1E 6%, rgba(30, 30, 30, 0) 50%), linear-gradient(0deg, rgba(30, 30, 30, 0.08), rgba(30, 30, 30, 0.08));
  }
}
section.cover {
  --100dvh: var(--1dvh, 1vh) * 100;
  display: flex;
  padding-top: 0px;
  position: relative;
  min-height: calc(1vh * 100 - 2.25rem - 3rem);
  min-height: calc(var(--100dvh) - 2.25rem - 3rem);
  min-height: calc(100dvh - 2.25rem - 3rem);
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  section.cover {
    min-height: calc(var(--100dvh) - 2.25rem - 4rem);
    min-height: calc(100dvh - 2.25rem - 4rem);
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  section.cover {
    min-height: calc(var(--100dvh) - 2.25rem - 100px);
    min-height: calc(100dvh - 2.25rem - 100px);
  }
}
section.cover .cover-content {
  display: flex;
  flex-direction: column;
}
section.cover .cover-image {
  display: flex;
  flex-direction: column;
  background-image: var(--cover-image-1x);
  background-repeat: no-repeat;
}
section.cover .cover-image {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  section.cover .cover-image {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  section.cover .cover-image {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  section.cover .cover-image {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
section.cover .cover-image {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  section.cover .cover-image {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  section.cover .cover-image {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  section.cover .cover-image {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  body > section.cover .cover-image, body > turbo-frame > section.cover .cover-image {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  :where(body, .app-view, header, .overlay:where(.is-menu, .is-sidebar)) > section.cover .cover-image, :where(body, .app-view) > :where(section, turbo-frame, .cover, details.required-choice) > section.cover .cover-image, :where(body, .app-view) > :where(turbo-frame, .restaurant-header, section#catalog) > section > section.cover .cover-image, :where(body, .app-view) > section :where(.grid.has-aside, .column) > section.cover .cover-image, :where(body, .app-view) > .cover > :where(.cover-content, header) > section.cover .cover-image, :where(body, .app-view) > section .column > section > section.cover .cover-image, :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > section.cover .cover-image, :where(.fixed-bottom-element, .overlay:where(.is-menu, .is-sidebar)) > .card > :where(a, .overlay-header) > section.cover .cover-image {
    padding-left: 4.375rem;
    padding-right: 4.375rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  section.cover .cover-image {
    background-image: var(--cover-image-2x);
    background-image: image-set(var(--cover-image-1x) 1x, var(--cover-image-2x) 2x);
    background-image: -webkit-image-set(var(--cover-image-1x) 1x, var(--cover-image-2x) 2x);
  }
}
section.cover .cover-image .menu-button {
  position: fixed;
  display: none;
}
section.cover.is-two-columns {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto 1fr;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  section.cover.is-two-columns {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1fr;
  }
}
section.cover.is-two-columns .cover-image {
  background-size: cover;
  background-position: 50% 25%;
  margin-bottom: -1.5rem;
  clip-path: inset(0%);
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  section.cover.is-two-columns .cover-image {
    margin-bottom: -2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  section.cover.is-two-columns .cover-image {
    background-position: 50% 20%;
    position: absolute;
    left: 50%;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 7;
    height: calc(var(--100dvh));
    height: 100dvh;
    margin-top: -6.25rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  section.cover.is-two-columns .cover-image {
    margin-top: calc(-2.25rem - 100px);
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  section.cover.is-two-columns .cover-image .menu-button {
    display: flex;
    z-index: 7;
  }
}
.device-frame {
  display: inline-block;
  position: relative;
}
.device-frame > img {
  max-width: 180px;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .device-frame > img {
    max-width: 250px;
  }
}
.device-frame::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url("/assets/static/images/device-frame-a7f066de.png");
  pointer-events: none;
}
.scroller {
  position: relative;
}
.scroller .scroller-content {
  display: flex;
  overflow: auto;
  scroll-snap-type: x proximity;
  scroll-behavior: smooth;
  gap: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .scroller .scroller-content {
    gap: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .scroller .scroller-content {
    gap: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .scroller .scroller-content {
    gap: 2.5rem;
  }
}
.scroller .scroller-content {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .scroller .scroller-content {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .scroller .scroller-content {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .scroller .scroller-content {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}
.scroller .scroller-content {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .scroller .scroller-content {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .scroller .scroller-content {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .scroller .scroller-content {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
@media (hover: none) {
  .scroller .scroller-content {
    -ms-overflow-style: none;
    scrollbar-width: none;
  }
  .scroller .scroller-content::-webkit-scrollbar {
    display: none;
  }
}
@media (hover: hover) {
  .scroller .scroller-content {
    -ms-overflow-style: auto;
    scrollbar-color: transparent transparent;
    scrollbar-width: thin;
  }
  .scroller .scroller-content::-webkit-scrollbar-thumb {
    background-color: transparent;
    border-radius: 7px;
  }
  .scroller .scroller-content::-webkit-scrollbar-track {
    background-color: transparent;
  }
  .scroller .scroller-content::-webkit-scrollbar {
    width: 7px;
    height: 7px;
  }
  .scroller .scroller-content:hover {
    scrollbar-color: hsla(0, 0%, 40%, 0.5) transparent;
    transition-delay: 0s;
  }
  .scroller .scroller-content:hover::-webkit-scrollbar-thumb {
    background-color: hsla(0, 0%, 40%, 0.5);
  }
}
.scroller .scroller-content > .item {
  width: 100%;
  display: flex;
  flex: none;
  flex-direction: column;
  align-items: center;
  scroll-snap-align: center;
}
.scroller .scroller-controls {
  position: absolute;
  display: flex;
  justify-content: space-between;
  width: 100%;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}
.scroller .scroller-controls {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .scroller .scroller-controls {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .scroller .scroller-controls {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .scroller .scroller-controls {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
.scroller .scroller-controls .scroller-next,
.scroller .scroller-controls .scroller-previous {
  pointer-events: initial;
}
.scroller .scroller-controls .scroller-next {
  left: 0px;
}
.scroller .scroller-controls .scroller-previous {
  right: 0px;
}
.scroller.has-control-spacing .scroller-content > .item {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .scroller.has-control-spacing .scroller-content > .item {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .scroller.has-control-spacing .scroller-content > .item {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .scroller.has-control-spacing .scroller-content > .item {
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .scroller.is-expanded-desktop .scroller-content {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 1.5rem;
    gap: 1.5rem;
  }
  .scroller.is-expanded-desktop .scroller-controls {
    display: none !important;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .scroller.is-expanded-desktop.has-control-spacing .scroller-content > .item {
    padding-left: 0px;
    padding-right: 0px;
  }
}
.marquee {
  width: 100%;
  height: 19vw;
  overflow: hidden;
  white-space: nowrap;
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .marquee {
    height: 15vw;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .marquee {
    height: 13vw;
  }
}
.marquee > svg {
  height: 100%;
  animation: 75s linear infinite horizontal-slide;
}
.marquee + .marquee svg:first-of-type {
  margin-left: -100vw;
}
.marquee + .marquee + .marquee svg:first-of-type {
  margin-left: -200vw;
}
@media (prefers-reduced-motion) {
  .marquee {
    height: auto !important;
  }
  .marquee > svg {
    height: auto;
    width: 110%;
    animation-play-state: paused;
    transform: translateX(-55%) !important;
  }
}
.marquee.is-new {
  height: 11vw;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .marquee.is-new {
    height: 11.5vw;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .marquee.is-new {
    height: 12vw;
  }
}
@keyframes horizontal-slide {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}
.vapes-content {
  font-size: 1.875rem;
}
.space-m-none {
  margin: 0px !important;
}
.space-mt-none {
  margin-top: 0px !important;
}
.space-mb-none {
  margin-bottom: 0px !important;
}
.space-ml-none {
  margin-left: 0px !important;
}
.space-mr-none {
  margin-right: 0px !important;
}
.space-m-xs {
  margin: 0.5rem !important;
}
.space-mt-xs {
  margin-top: 0.5rem !important;
}
.space-mb-xs {
  margin-bottom: 0.5rem !important;
}
.space-ml-xs {
  margin-left: 0.5rem !important;
}
.space-mr-xs {
  margin-right: 0.5rem !important;
}
.space-m-sm {
  margin: 1rem !important;
}
.space-mt-sm {
  margin-top: 1rem !important;
}
.space-mb-sm {
  margin-bottom: 1rem !important;
}
.space-ml-sm {
  margin-left: 1rem !important;
}
.space-mr-sm {
  margin-right: 1rem !important;
}
.space-m-md {
  margin: 1.5rem !important;
}
.space-mt-md {
  margin-top: 1.5rem !important;
}
.space-mb-md {
  margin-bottom: 1.5rem !important;
}
.space-ml-md {
  margin-left: 1.5rem !important;
}
.space-mr-md {
  margin-right: 1.5rem !important;
}
.space-m-lg {
  margin: 2rem !important;
}
.space-mt-lg {
  margin-top: 2rem !important;
}
.space-mb-lg {
  margin-bottom: 2rem !important;
}
.space-ml-lg {
  margin-left: 2rem !important;
}
.space-mr-lg {
  margin-right: 2rem !important;
}
.space-m-xl {
  margin: 2.5rem !important;
}
.space-mt-xl {
  margin-top: 2.5rem !important;
}
.space-mb-xl {
  margin-bottom: 2.5rem !important;
}
.space-ml-xl {
  margin-left: 2.5rem !important;
}
.space-mr-xl {
  margin-right: 2.5rem !important;
}
.space-m-extra-desktop {
  padding: 2rem !important;
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .space-m-extra-desktop {
    padding: 4.375rem !important;
  }
}
.space-mt-extra-desktop {
  padding-top: 2rem !important;
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .space-mt-extra-desktop {
    padding-top: 4.375rem !important;
  }
}
.space-mb-extra-desktop {
  padding-bottom: 2rem !important;
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .space-mb-extra-desktop {
    padding-bottom: 4.375rem !important;
  }
}
.space-ml-extra-desktop {
  padding-left: 2rem !important;
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .space-ml-extra-desktop {
    padding-left: 4.375rem !important;
  }
}
.space-mr-extra-desktop {
  padding-right: 2rem !important;
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .space-mr-extra-desktop {
    padding-right: 4.375rem !important;
  }
}
.space-p-none {
  padding: 0px !important;
}
.space-pt-none {
  padding-top: 0px !important;
}
.space-pb-none {
  padding-bottom: 0px !important;
}
.space-pl-none {
  padding-left: 0px !important;
}
.space-pr-none {
  padding-right: 0px !important;
}
.space-p-xs {
  padding: 0.5rem !important;
}
.space-pt-xs {
  padding-top: 0.5rem !important;
}
.space-pb-xs {
  padding-bottom: 0.5rem !important;
}
.space-pl-xs {
  padding-left: 0.5rem !important;
}
.space-pr-xs {
  padding-right: 0.5rem !important;
}
.space-p-sm {
  padding: 1rem !important;
}
.space-pt-sm {
  padding-top: 1rem !important;
}
.space-pb-sm {
  padding-bottom: 1rem !important;
}
.space-pl-sm {
  padding-left: 1rem !important;
}
.space-pr-sm {
  padding-right: 1rem !important;
}
.space-p-md {
  padding: 1.5rem !important;
}
.space-pt-md {
  padding-top: 1.5rem !important;
}
.space-pb-md {
  padding-bottom: 1.5rem !important;
}
.space-pl-md {
  padding-left: 1.5rem !important;
}
.space-pr-md {
  padding-right: 1.5rem !important;
}
.space-p-lg {
  padding: 2rem !important;
}
.space-pt-lg {
  padding-top: 2rem !important;
}
.space-pb-lg {
  padding-bottom: 2rem !important;
}
.space-pl-lg {
  padding-left: 2rem !important;
}
.space-pr-lg {
  padding-right: 2rem !important;
}
.space-p-xl {
  padding: 2.5rem !important;
}
.space-pt-xl {
  padding-top: 2.5rem !important;
}
.space-pb-xl {
  padding-bottom: 2.5rem !important;
}
.space-pl-xl {
  padding-left: 2.5rem !important;
}
.space-pr-xl {
  padding-right: 2.5rem !important;
}
.space-p-extra-desktop {
  padding: 2rem !important;
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .space-p-extra-desktop {
    padding: 4.375rem !important;
  }
}
.space-pt-extra-desktop {
  padding-top: 2rem !important;
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .space-pt-extra-desktop {
    padding-top: 4.375rem !important;
  }
}
.space-pb-extra-desktop {
  padding-bottom: 2rem !important;
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .space-pb-extra-desktop {
    padding-bottom: 4.375rem !important;
  }
}
.space-pl-extra-desktop {
  padding-left: 2rem !important;
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .space-pl-extra-desktop {
    padding-left: 4.375rem !important;
  }
}
.space-pr-extra-desktop {
  padding-right: 2rem !important;
}
@media (min-aspect-ratio: 1/1) and (min-width: 1600px) {
  .space-pr-extra-desktop {
    padding-right: 4.375rem !important;
  }
}
.is-elevated-low-subtle {
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.02), 0px -2px 26px rgba(0, 0, 0, 0.02);
  box-shadow: 0px 4px 4px var(--colour-elevation-low-subtle), 0px -2px 26px var(--colour-elevation-low-subtle);
}
.is-elevated-low {
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.05), 0px -2px 26px rgba(0, 0, 0, 0.05);
  box-shadow: 0px 4px 4px var(--colour-elevation-low), 0px -2px 26px var(--colour-elevation-low);
}
.is-elevated-middle {
  box-shadow: 0px 4px 4px;
  box-shadow: 0px 0px 10px 0px rgba(57, 32, 0, 0.1), 0px 4px 6px 0px rgba(57, 32, 0, 0.22);
  box-shadow: 0px 0px 10px 0px var(--colour-elevation-middle-1), 0px 4px 6px 0px var(--colour-elevation-middle-2);
}
.is-elevated-high {
  box-shadow: 0px 4px 28px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 4px 28px var(--colour-elevation-high);
}
.is-elevated-high-subtle {
  box-shadow: 0px 4px 28px rgba(0, 0, 0, 0.12);
  box-shadow: 0px 4px 28px var(--colour-elevation-high-subtle);
}
.is-layer-lowest {
  z-index: 1 !important;
}
.is-layer-low {
  z-index: 3 !important;
}
.is-layer-middle {
  z-index: 5 !important;
}
.is-layer-high {
  z-index: 7 !important;
}
.is-layer-highest {
  z-index: 9 !important;
}
.is-visually-hidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.is-completely-hidden {
  display: none !important;
}
.is-invisible {
  visibility: hidden !important;
}
body[data-app] .is-hidden-in-app {
  display: none !important;
}
body:not([data-app]) .is-visible-in-app {
  display: none !important;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .is-hidden-above-tablet {
    display: none !important;
  }
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .is-hidden-above-desktop {
    display: none !important;
  }
}
@media (max-aspect-ratio: 3/4), (max-width: 767.98px) {
  .is-visible-above-tablet {
    display: none !important;
  }
}
@media (max-aspect-ratio: 3/4), (max-width: 1023.98px) {
  .is-visible-above-desktop {
    display: none !important;
  }
}
.is-selectable-text {
  -webkit-user-select: auto !important;
     -moz-user-select: auto !important;
          user-select: auto !important;
}
.is-tiny-text {
  font-size: 1rem;
}
.is-muted-text {
  color: hsl(32, 6%, 46%) !important;
  color: var(--colour-text-muted) !important;
}
.is-tiny-muted-text {
  font-size: 1rem;
  color: hsl(32, 6%, 46%);
  color: var(--colour-text-muted);
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .is-tiny-muted-text {
    font-size: 1.125rem;
  }
}
.is-medium-text {
  font-size: 1.25rem !important;
}
.is-large-text {
  font-size: 1.375rem;
}
@media (min-aspect-ratio: 3/4) and (min-width: 1024px) {
  .is-large-text-above-desktop {
    font-size: 1.375rem;
  }
}
.is-bold-text {
  font-weight: 500;
}
.is-error-text {
  color: hsl(285, 65%, 50%);
  color: var(--colour-text-error);
}
.is-uppercase-text {
  text-transform: uppercase;
}
.has-monospaced-numbers {
  font-feature-settings: "tnum";
  font-variant-numeric: tabular-nums;
}
.is-center-aligned-text {
  text-align: center;
}
.is-center-aligned-text-below-tablet {
  text-align: center;
}
@media (min-aspect-ratio: 3/4) and (min-width: 768px) {
  .is-center-aligned-text-below-tablet {
    text-align: left;
    text-align: initial;
  }
}
.is-aligned-left {
  margin-right: auto !important;
}
.is-aligned-right {
  margin-left: auto !important;
}
.is-vertically-aligned-center {
  margin-top: auto !important;
  margin-bottom: auto !important;
}
.is-fixed-top {
  position: fixed;
  top: 0;
}
.is-stuck-top {
  position: sticky !important;
  top: 0;
}
.is-stuck-bottom {
  position: sticky;
  bottom: 0;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  justify-content: flex-end;
}
.is-position-absolute {
  position: absolute;
}
.is-absolute-bottom {
  position: absolute;
  bottom: 0;
}
.is-flexbox {
  display: flex !important;
}
.is-inline-flexbox {
  display: inline-flex !important;
}
.flex-row {
  flex-direction: row !important;
}
.flex-row-reverse {
  flex-direction: row-reverse !important;
}
.flex-column {
  flex-direction: column !important;
}
.flex-column-reverse {
  flex-direction: column-reverse !important;
}
.flex-nowrap {
  flex-wrap: nowrap !important;
}
.flex-wrap {
  flex-wrap: wrap !important;
}
.flex-wrap-reverse {
  flex-wrap: wrap-reverse !important;
}
.justify-content-start {
  justify-content: flex-start !important;
}
.justify-content-end {
  justify-content: flex-end !important;
}
.justify-content-center {
  justify-content: center !important;
}
.justify-content-between {
  justify-content: space-between !important;
}
.justify-content-around {
  justify-content: space-around !important;
}
.justify-content-evenly {
  justify-content: space-evenly !important;
}
.align-content-start {
  align-content: flex-start !important;
}
.align-content-end {
  align-content: flex-end !important;
}
.align-content-center {
  align-content: center !important;
}
.align-content-stretch {
  align-content: stretch !important;
}
.align-content-between {
  align-content: space-between !important;
}
.align-content-around {
  align-content: space-around !important;
}
.align-items-start {
  align-items: flex-start !important;
}
.align-items-end {
  align-items: flex-end !important;
}
.align-items-center {
  align-items: center !important;
}
.align-items-baseline {
  align-items: baseline !important;
}
.align-items-stretch {
  align-items: stretch !important;
}
.align-self-start {
  align-self: flex-start !important;
}
.align-self-end {
  align-self: flex-end !important;
}
.align-self-center {
  align-self: center !important;
}
.align-self-baseline {
  align-self: baseline !important;
}
.align-self-stretch {
  align-self: stretch !important;
}
.flex-shrink-0 {
  flex-shrink: 0 !important;
}
.flex-shrink-1 {
  flex-shrink: 1 !important;
}
.flex-grow-0 {
  flex-grow: 0 !important;
}
.flex-grow-1 {
  flex-grow: 1 !important;
}
.min-width-0 {
  min-width: 0px;
}
.flex-grow-9999 {
  flex-grow: 9999 !important;
}
.is-flex-gap-xs {
  gap: 0.5rem;
}
.is-flex-gap-sm {
  gap: 1rem;
}
.is-flex-gap-md {
  gap: 1.5rem;
}
.is-flex-gap-lg {
  gap: 2rem;
}
.flex-1 {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: auto;
}