.indicator-root-xtL {
    height: calc(100% - 6rem);
}

.indicator-global-W6p {
}

.indicator-message-jbb {
    letter-spacing: 0.25em;
}

.indicator-indicator-4ge {
    animation-direction: alternate;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-name: indicator-pulse-PNk;
    animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes indicator-pulse-PNk {
    0% {
        filter: grayscale(1);
        transform: scale(0.75) rotate(-540deg);
    }
    100% {
        filter: grayscale(0);
        transform: scale(1) rotate(0deg);
    }
}

.icon-root-cnm {
    touch-action: manipulation;
}

.icon-icon-P1l {
    fill: var(--fill, none);
    stroke: var(--stroke, rgb(var(--venia-global-color-text)));
}

.icon-icon_desktop-C0k {
}

.category-root-89q {
}

.category-title-J65 {
}

.category-pagination-W3D {
}

.category-placeholder-eiC {
}

.category-categoryTitle-hxg {
}

.category-heading-cBC {
}

.category-categoryContent-yd9 {
}

.category-categoryInfo-WW8 {
    flex-basis: 100%;
}

.category-headerButtons-ZNv {
    flex-basis: 100%;
}

.category-contentWrapper-2W7 {
}

.category-sidebar-HXv {
}

.breadcrumbs-root-wm7 {
    /* Permanent height to prevent pop-in. */
    /* Show ellipses when overflowing. */
}

.breadcrumbs-text-tTO {
}

.breadcrumbs-divider-oYN {
}

.breadcrumbs-link-FR- {
}

.breadcrumbs-currentCategory-T3w {
}

.button-root-MFn {
    padding-top: calc(0.5rem + 1px); /* TODO @TW: review */
    padding-bottom: calc(0.5rem - 1px); /* TODO @TW: review */
    min-height: 2.5rem;
    transition-duration: 256ms;
    transition-property: background-color, border-color, color;
    transition-timing-function: var(--venia-global-anim-standard);
}

.button-root-MFn:active {
    transition-duration: 128ms;
}

/**
 * Some browsers retain the :hover state after a click, this ensures if a button becomes disabled after
 * being clicked it will be visually disabled.
 */
.button-root-MFn:hover:disabled {
    /* TODO @TW: cannot compose. This may not be possible with two variants. */
    pointer-events: none;
}

.button-root_lowPriority-Qoh {
}

.button-root_normalPriority-1E0 {
}

.button-root_highPriority-UpE {
}

.button-root_lowPriorityNegative-uax,
.button-root_normalPriorityNegative-x-d {
}

.button-root_highPriorityNegative-gwK {
}

.button-content-TD8 {
}

.checkbox-root-hF1 {
    --stroke: var(--venia-global-color-gray-600);
    grid-template-areas: 'input label';
    grid-template-columns: min-content 1fr;
}

.checkbox-input-WEy {
    grid-area: input;

    /* TODO @TW: review, replaces input:disabled. Check if working. */
}

.checkbox-icon-eiW {
    grid-area: input;
}

.checkbox-icon-eiW svg {
    stroke: rgb(var(--stroke));
}

.checkbox-label-wHh {
    grid-area: label;
}

/* When the input is disabled, update the cursor on the sibling label element. */
/* TODO @TW: cannot compose */
.checkbox-input-WEy:disabled ~ .checkbox-label-wHh {
    cursor: default;
}

.checkbox-input-WEy:checked:enabled + .checkbox-icon-eiW {
    --stroke: var(--venia-brand-color-1-700);
}

/* TODO @TW: cannot compose, needs "checked" variant enabled. Cannot combine variants. */
.checkbox-input-WEy:active:enabled,
.checkbox-input-WEy:focus:enabled {
    /* composes: active_shadow-radioActive from global; */
    /* composes: focus_shadow-radioFocus from global; */
    box-shadow: -3px 3px rgb(var(--venia-brand-color-1-100));
    outline: none;
}

.checkbox-input_shimmer-yEr {
}

.radio-root-Mbw {
    grid-template-areas: 'input label';
    grid-template-columns: min-content 1fr;
}

.radio-input-Mgy {
    grid-area: input;
}

.radio-icon-QeD {
    grid-area: input;
}

/* TODO @TW: cannot compose */
.radio-icon-QeD svg {
    /* composes: stroke-gray-600 from global; */
    stroke: rgb(var(--venia-global-color-gray-600));
}

.radio-label-n0x {
    grid-area: label;
}

/* TODO @TW: cannot compose */
.radio-input-Mgy:checked + .radio-icon-QeD svg {
    /* composes: stroke-brand-base from global; */
    stroke: rgb(var(--venia-brand-color-1-700));
}

.radio-input_shimmer-1vi {
}

.field-root-fSe {
}

.field-label-zVe {
    min-height: 2.125rem;
}

.field-input-2Mu {
    padding: calc(0.375rem - 1px) calc(0.625rem - 1px); /* TODO @TW: review */
}

.field-input-2Mu:disabled {
    background: rgb(var(--venia-global-color-gray-100));
    border-color: rgb(var(--venia-global-color-gray-400));
    color: rgb(var(--venia-global-color-gray-darker));
}

.field-optional-EDv {
}

.textArea-input-Rk3 {
}

.textArea-input_shimmer-SJm {
    font-size: 1rem;
}

.textInput-input-PzO {
}

.textInput-input_error-2j1 {
}

.textInput-input_shimmer-BRC {
    font-size: 1rem;
    padding: calc(0.375rem - 1px) calc(0.625rem - 1px);
}

.shimmer-root-N6z {
}

/* TODO @TW: cannot compose */
.shimmer-root-N6z::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: var(
        --venia-global-maxWidth
    ); /* TODO @TW: review. this should use TW theme value "maxWidth.site" */
    height: 100%;
    background-image: linear-gradient(
        to right,
        rgb(var(--venia-global-color-gray-50) / 0%) 0%,
        rgb(var(--venia-global-color-gray-50)) 40%,
        rgb(var(--venia-global-color-gray-50) / 0%) 80%,
        rgb(var(--venia-global-color-gray-50) / 0%) 100%
    );
    /* composes: bg-no-repeat from global; */
    background-repeat: none;
    background-size: var(--venia-global-maxWidth) 100%;
    -webkit-animation-name: shimmer-shimmerAnimation-rGT;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-fill-mode: forwards;
    will-change: transform;
}

.shimmer-root_rectangle-Hcb {

    min-height: 1rem;
}

.shimmer-root_button-AUG {
}

.shimmer-root_checkbox-Reu {
}

.shimmer-root_radio-y1q {
}

.shimmer-root_textArea-H8r {

    min-height: 6.75rem;
}

.shimmer-root_textInput-X-e {
}

.filterSidebar-root-x-X {
    grid-template-rows: 1fr 7rem;
}

.filterSidebar-body-MjM {
}

.filterSidebar-header-DOQ {
}

.filterSidebar-headerTitle-AWJ {
}

.filterSidebar-action-K4d {
}

/* TODO @TW: cannot compose */
.filterSidebar-action-K4d button {
    /* composes: text-sm from global; */
    font-size: 0.875rem;
    /* composes: no-underline from global; */
    text-decoration: none;
}

.filterSidebar-blocks-6oz {
}

/* TODO @TW: cannot compose */
.filterSidebar-blocks-6oz > li:last-child {
    /* composes: border-b-2 from global; */
    /* composes: border-solid from global; */
    /* composes: border-subtle from global; */
    border-bottom: 2px solid rgb(var(--venia-global-color-border));
}

.filterModalOpenButton-filterButton-qRo {
}

.filterModalOpenButton-shimmer-filterButtonShimmer-k51 {
}

.productSort-root-F2c {
}

.productSort-menu-JBm {
}

.productSort-menuItem-AxK {
}

.productSort-sortButton-lQQ {
    /* TODO @TW: review (C2). This is fragile to extend. */
}

.productSort-desktopText-mG- {
}

.productSort-sortText-5AR {
}

.productSort-desktopIconWrapper-evU {

    transform: translateX(10px);
}

.productSort-desktopIcon-3Aw {
}

.productSort-mobileText-fbc {
}

.productSort-shimmer-root-VWk {
}

.productSort-shimmer-sortButtonShimmer-aTy {
}

.sortedByContainer-root-BWM {
}

.sortedByContainer-sortText-LvT {
}

.gallery-root-BDi {
    grid-template-areas:
        'actions'
        'items';
}

.gallery-items-mt3 {
    grid-area: items;
    grid-template-columns: repeat(3, 1fr);
}

@media (max-width: 639px) {
    .gallery-items-mt3 {
        grid-template-columns: repeat(2, 1fr);
    }
}

.image-root-ZSi {
    /*
     * For customization, we provide an empty root.
     * These styles will be applied to the image container.
     */
}

.image-container-dLP {
}

.image-image-f-I {
    /*
     * For customization, we provide an empty image class.
     * These styles will be applied directly to the image itself.
     */
}

.image-loaded-GZ- {

    /* TODO @TW: review (B6) */
    /* composes: visible from global; */
    visibility: visible;
}

.image-notLoaded-thf {

    /* TODO @TW: review (B6) */
    /* composes: invisible from global; */
    visibility: hidden;
}

.image-placeholder-XTV {
}

.image-placeholder_layoutOnly-KCq {
}

.item-root-DV2 {
}

.item-images-zZO {
    grid-template-areas: 'main';
    position: relative;
}

.item-imageContainer-DzC {
    grid-area: main;
}

.item-image-U-P {
    transition: opacity 512ms ease-out;
}

.item-imageLoaded-3ZL {
}

.item-imageNotLoaded-WQY {
}

.item-imagePlaceholder-kqH {
}

.item-actionsContainer-9pP {
    grid-template-columns: auto auto;
}

/* TODO @TW: cannot compose */
.item-actionsContainer-9pP:empty {
    display: none;
}

.item-name-S9z {
}

.item-name-S9z,
.item-price-5Og {
    min-height: 1rem;
}

.item-unavailableContainer-kQZ {
}

/* global tokens */
:root {
    /* animation */
    --venia-global-anim-bounce: cubic-bezier(0.5, 1.8, 0.9, 0.8);
    --venia-global-anim-in: cubic-bezier(0, 0, 0.2, 1);
    --venia-global-anim-out: cubic-bezier(0.4, 0, 1, 1);
    --venia-global-anim-standard: cubic-bezier(0.4, 0, 0.2, 1);

    /* color */
    --venia-global-color-blue-100: 194 200 255;
    --venia-global-color-blue-400: 71 139 255;
    /* --venia-global-color-blue-500: 51 109 255; */
    /* --venia-global-color-blue-600: 41 84 255; */
    --venia-global-color-blue-700: 31 57 255;
    /* --venia-global-color-blue-800: 23 43 196; */
    --venia-global-color-gray-50: 255 255 255;
    /* --venia-global-color-gray-75: 250 250 250; */
    --venia-global-color-gray-100: 244 245 245;
    /* --venia-global-color-gray-200: 234 235 235; */
    --venia-global-color-gray-300: 161 151 145;
    --venia-global-color-gray-400: 181 184 186;
    --venia-global-color-gray-500: 149 154 157;
    --venia-global-color-gray-600: 118 123 127;
    --venia-global-color-gray-700: 84 93 99;
    /* --venia-global-color-gray-800: 51 63 71; */
    --venia-global-color-gray-900: 23 32 38;
    --venia-global-color-gray: var(--venia-global-color-gray-100);
    --venia-global-color-gray-dark: var(--venia-global-color-gray-300);
    --venia-global-color-gray-darker: var(--venia-global-color-gray-600);
    /* --venia-global-color-green-400: 51 171 132; */
    --venia-global-color-green-500: 45 157 120;
    /* --venia-global-color-green-600: 38 142 108; */
    /* --venia-global-color-green-700: 18 128 92; */
    --venia-global-color-orange: 241 99 33;
    --venia-global-color-red-400: 236 91 98;
    /* --venia-global-color-red-500: 227 72 80; */
    /* --venia-global-color-red-600: 215 55 63; */
    --venia-global-color-red-700: 201 37 45;
    /* --venia-global-color-red-800: 161 30 36; */
    --venia-global-color-teal: var(--venia-global-color-blue-400);
    /* --venia-global-color-teal-dark: var(--venia-global-color-blue-600); */
    --venia-global-color-teal-light: var(--venia-global-color-gray-100);

    /* color by semantics */
    /* --venia-global-color-background: var(--venia-global-color-gray-50); */
    --venia-global-color-border: var(--venia-global-color-gray-300);
    --venia-global-color-error: var(--venia-global-color-red-700);
    --venia-global-color-text: var(--venia-global-color-gray-900);
    /* --venia-global-color-text-alt: var(--venia-global-color-gray-darker); */
    --venia-global-color-text-hint: var(--venia-global-color-gray-500);
    /* --venia-global-color-warning-dark: var(--venia-global-color-red-700); */
    /* --venia-global-color-warning-light: var(--venia-global-color-gray-100); */

    /* font family */
    /* --venia-global-fontFamily-sansSerif: 'Muli', sans-serif; */
    /* --venia-global-fontFamily-serif: 'Source Serif Pro', serif; */

    /* font size */
    /* --venia-global-fontSize-50: 0.6875rem; */ /* 11px */
    /* --venia-global-fontSize-75: 0.75rem; */ /* 12px */
    /* --venia-global-fontSize-100: 0.875rem; */ /* 14px */
    /* --venia-global-fontSize-200: 1rem; */ /* 16px */
    /* --venia-global-fontSize-300: 1.125rem; */ /* 18px */
    /* --venia-global-fontSize-400: 1.25rem; */ /* 20px */
    /* --venia-global-fontSize-500: 1.375rem; */ /* 22px */
    /* --venia-global-fontSize-600: 1.5rem; */ /* 24px */
    /* --venia-global-fontSize-700: 1.75rem; */ /* 28px */
    /* --venia-global-fontSize-800: 2rem; */ /* 32px */
    /* --venia-global-fontSize-900: 2.25rem; */ /* 36px */
    /* --venia-global-fontSize-1000: 2.5rem; */ /* 40px */
    /* --venia-global-fontSize-1100: 3rem; */ /* 48px */
    /* --venia-global-fontSize-1200: 3.5rem; */ /* 56px */

    /* font weight */
    /* --venia-global-fontWeight-normal: 400; */
    /* --venia-global-fontWeight-semibold: 600; */
    /* --venia-global-fontWeight-bold: 700; */

    /* line height */
    /* --venia-global-lineHeight-100: 1; */
    /* --venia-global-lineHeight-200: 1.25; */
    /* --venia-global-lineHeight-300: 1.5; */
    /* --venia-global-lineHeight-400: 1.75; */
    /* --venia-global-lineHeight-500: 2; */

    /* dimensions */
    --venia-global-maxWidth: 1440px;
    --venia-global-header-minHeight: 5rem;
}

@media (max-width: 959px) {
    :root {
        --venia-global-header-minHeight: 3.5rem;
    }
}

/* alias tokens */
:root {
    /* colors */
    --venia-brand-color-1-100: var(--venia-global-color-blue-100);
    /* --venia-brand-color-1-400: var(--venia-global-color-blue-400); */
    /* --venia-brand-color-1-500: var(--venia-global-color-blue-500); */
    /* --venia-brand-color-1-600: var(--venia-global-color-blue-600); */
    --venia-brand-color-1-700: var(--venia-global-color-blue-700);
    /* --venia-brand-color-1-800: var(--venia-global-color-blue-800); */

    /* typography - heading */
    /*
    --venia-global-typography-heading-XL-fontSize: var(
        --venia-global-fontSize-600
    );
    --venia-global-typography-heading-L-fontSize: var(
        --venia-global-fontSize-400
    );
    --venia-global-typography-heading-M-fontSize: var(
        --venia-global-fontSize-300
    );
    --venia-global-typography-heading-S-fontSize: var(
        --venia-global-fontSize-200
    );
    --venia-global-typography-heading-XS-fontSize: var(
        --venia-global-fontSize-100
    );
    --venia-global-typography-heading-lineHeight: calc(
        var(--venia-global-lineHeight-200) * 1em
    );
    */

    /* typography - body */
    /* --venia-typography-body-XXXL-fontSize: var(--venia-global-fontSize-600); */
    /* --venia-typography-body-XXL-fontSize: var(--venia-global-fontSize-500); */
    /* --venia-typography-body-XL-fontSize: var(--venia-global-fontSize-400); */
    /* --venia-typography-body-L-fontSize: var(--venia-global-fontSize-300); */
    /* --venia-typography-body-M-fontSize: var(--venia-global-fontSize-200); */
    /* --venia-typography-body-S-fontSize: var(--venia-global-fontSize-100); */
    /* --venia-typography-body-XS-fontSize: var(--venia-global-fontSize-50); */
    /*
    --venia-typography-body-lineHeight: calc(
        var(--venia-global-lineHeight-300) * 1em
    );
    */

    /* typography - detail */
    /*
    --venia-typography-detail-XL-fontSize: var(--venia-global-fontSize-200);
    --venia-typography-detail-L-fontSize: var(--venia-global-fontSize-100);
    --venia-typography-detail-M-fontSize: var(--venia-global-fontSize-75);
    --venia-typography-detail-S-fontSize: var(--venia-global-fontSize-50);
    --venia-typography-detail-lineHeight: calc(
        var(--venia-global-lineHeight-200) * 1em
    );
    */
}

* {
    /* composes: box-border from global; */
    box-sizing: border-box;
}

/* TODO @TW: cannot compose */
html {
    /* composes: text-[100%] from global; */
    font-size: 100%;
    /* composes: text-normal from global; */
    font-weight: 400;
    /* composes: leading-none from global; */
    line-height: 1;
    /* composes: antialiased from global; */
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
}

html[data-scroll-lock='true'],
html[data-scroll-lock='true'] body {
    height: 100%;
    overflow: hidden;
    position: fixed;
    width: 100%;
}

/* TODO @TW: cannot compose */
body,
button,
input,
select,
textarea {
    /* composes: text-gray-900 from global; */
    /* color: rgb(var(--venia-global-color-text)); */
    color: rgb(23 32 38);
}

body {
    /* composes: m-0 from global; */
    margin: 0;
    /* composes: p-0 from global; */
    padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    /* composes: font-base from global; */
    font-size: 1rem;
    /* composes: font-normal from global; */
    font-weight: 400;
    /* composes: m-0 from global; */
    margin: 0;
}

h1 {
    /* composes: text-xl from global; */
    font-size: 1.5rem;
}

h2 {
    /* composes: text-lg from global; */
    font-size: 1.25rem;
}

a {
    /* composes: text-current from global; */
    color: currentColor;
    /* composes: no-underline from global; */
    text-decoration: none;
}

p {
    /* composes: m-0 from global; */
    margin: 0;
}

dl,
ol,
ul {
    /* composes: list-none from global; */
    list-style-type: none;
    /* composes: m-0 from global; */
    margin: 0;
    /* composes: p-0 from global; */
    padding: 0;
}

dd,
dt {
    /* composes: m-0 from global; */
    margin: 0;
}

/* TODO @TW: cannot compose */
button {
    /* composes: bg-transparent from global; */
    background: none;
    /* composes: border-0 from global; */
    border: 0;
    /* composes: cursor-pointer from global; */
    cursor: pointer;
    /* composes: text-[100%] from global; */
    font-size: 100%;
    /* composes: p-0 from global; */
    padding: 0;
    touch-action: manipulation;
    /* composes: select-none from global; */
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    /* composes: appearance-none from global; */
    -webkit-appearance: none;
}

button:disabled {
    /* composes: cursor-default from global; */
    cursor: default;
    touch-action: none;
}

.braintree-sheet__content--form
        .braintree-form__field-group
        .braintree-form__field
        .braintree-form__hosted-field
        input.braintree-form__raw-input {
    color: #8f8f8f !important;
}

.braintree-sheet__content--form
        .braintree-form__field-group
        .braintree-form__descriptor {
    color: #757575 !important;
}