/** Shopify CDN: Minification failed

Line 632:20 Expected "}" to go with "{"

**/
/* LOGIN / REGISTER / RECOVER Templates */
.customer__wrapper {
    display: grid;
    grid-template-columns: 1fr;
    gap: 4rem;
}

.customer__header>*+* {
    margin-top: 3.2rem;
}

.customer__header>ul>li:not(:first-child) {
    margin-top: .6rem;
}

[name="sign-in-with-shop-provider"] {
    margin-bottom: 0;
    --buttons-radius: 999px;
    --button-border-radius: 999px;
}

/* Recover password container */
#recover {
    display: none;
    grid-column: span 12;
    max-width: 700px;
    margin: 0 auto;
}

#recover>header>*+*,
.main-reset-password__wrapper > div > header > * + * {
    margin-top: 1.6rem;
}

#recover>*+*,
.main-reset-password__wrapper > div > * + * {
    margin-top: 5.6rem;
}

/* URL hash 为 #recover 时显示找回密码模块 */
#recover:target {
    display: inline;
}

/* 找回密码打开时隐藏登录主体、图片和 guest login */
#recover:target~.main-login__header,
#recover:target~.main-login__content,
#recover:target~.guest-login {
    display: none;
}

.main-reset-password__wrapper > div {
    grid-column: span 12;
    max-width: 700px;
    margin: 0 auto;
}

.main-reset-password__wrapper .fields > * + * {
    margin-top: 1.6rem;
}

/* 登录/注册顶部 tab 区域 */
.customer__content--header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5.6rem;
    margin-bottom: 5.6rem;
}

.customer__content--header>* {
    position: relative;
}

/* 当前 login/register tab 的下划线 */
.customer__content--header .current-page::after {
    content: "";
    height: .1em;
    background: black;
    position: absolute;
    bottom: -.5em;
    inset-inline-start: 0;
    inset-inline-end: 0;
}

.customer__content .field:not(:first-of-type) {
    margin-top: 1.6rem;
}

.customer__wrapper a[href='#recover'] {
    display: block;
    margin: 0 auto;
    width: fit-content;
}

.customer__wrapper button:not(password-visibility button) {
    margin: 3.2rem 0;
}

/* Login/Register images */
.customer-login-image,
.customer-login-content-image {
    width: 100%;
    overflow: hidden;
}

.customer-login-image {
    margin-top: 3.2rem;
}

.customer-login-image picture,
.customer-login-image img,
.customer-login-content-image img {
    display: block;
    width: 100%;
}

/* 默认图片按自身比例显示；桌面端会在 media query 里覆盖成填满容器 */
.customer-login-image img,
.customer-login-content-image img {
    height: auto;
    object-fit: cover;
    object-position: center;
}

/* 右侧上方图片默认隐藏，只在桌面端显示 */
.customer-login-content-image {
    display: none;
}

/* Login providers */
.customer-login-providers {
    margin-top: 1.6rem;
}

.customer-login-providers__separator {
    margin: 1.6rem 0;
    text-align: center;
}

.customer-social-login,
.customer-shop-login-provider {
    width: 100%;
    max-width: 100%;
}

.customer-social-login {
    margin-bottom: .8rem;
}

.main-login__content .oxi-social-login {
    display: none !important;
}

.main-login__content .customer-login-providers .oxi-social-login {
    display: block !important;
}

.customer-login-providers .oxi-social-login,
.customer-login-providers .oxi-social-login > *,
.customer-login-providers .oxi-social-login div {
    width: 100% !important;
    max-width: 100% !important;
}

.customer-login-providers .oxi-social-login button,
.customer-login-providers .oxi-social-login a,
.customer-login-providers .oxi-social-login [role="button"],
.customer-login-providers .oxi-social-login input[type="button"],
.customer-login-providers .oxi-social-login input[type="submit"] {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: .8rem !important;
    width: 100% !important;
    min-height: 3.4rem !important;
    margin: 0 0 .8rem !important;
    padding: .8rem 1.6rem !important;
    border: 1px solid #c8c8c8 !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: #000 !important;
    font: inherit !important;
    font-size: 1.3rem !important;
    line-height: 1.2 !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    text-decoration: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
}

.customer-login-providers .oxi-social-login svg,
.customer-login-providers .oxi-social-login img {
    width: 2rem !important;
    height: 2rem !important;
    flex: 0 0 auto !important;
}

.customer-shop-login-provider {
    margin: 0 !important;
    --buttons-radius: 999px;
    --button-border-radius: 999px;
}

.customer-shop-login-provider > *,
.customer-shop-login-provider iframe,
.customer-shop-login-provider shop-login-button {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 3.4rem !important;
    margin: 0 !important;
    border-radius: 999px !important;
    box-sizing: border-box !important;
}

/* ACCOUNT / ORDER */
.main-account__wrapper>div,
.main-order__wrapper>div {
    display: grid;
    grid-template-areas:
        "COL1"
        "COL2";
    grid-gap: calc(var(--grid-vertical-spacing)*2) calc(var(--grid-horizontal-spacing)*2);
    margin-top: 5.6rem;
}

.main-account__header>a,
.main-order__header>a {
    margin-top: .8rem;
    display: inline-block;
}

#MainAccountOrderHistory,
#MainOrderOrders {
    grid-area: COL1;
}

#MainAccountAccountDetails,
#MainOrderAddress {
    grid-area: COL2;
}

#MainAccountAccountDetails>a {
    display: inline-block;
}

#MainAccountOrderHistory>*+*,
#MainAccountAccountDetails>*+*,
#MainOrderOrders>*+*,
#MainOrderAddress>*+* {
    margin-top: 3.2rem;
}

/* ACTIVATE ACCOUNT */
.main-activate-account__container {
    max-width: 660px;
    margin: 0 auto;
}

.main-activate-account__wrapper>*+* {
    margin-top: 5.6rem;
}

.main-activate-account__header>*+* {
    margin-top: .8rem;
}

.main-activate-account__wrapper .field:not(:first-of-type) {
    margin-top: 1.6rem;
}

.main-activate-account__wrapper button {
    margin-top: 3.2rem;
}

.main-activate-account__wrapper button:not(:last-of-type) {
    margin-inline-end: 1.6rem;
}

/* ORDER */
#MainOrderAddress>*+* {
    margin-top: 3.2rem;
}

.main-order__wrapper table tfoot tr td:first-of-type {
    text-align: start;
}

.main-order__wrapper tfoot tr:last-of-type td,
.main-order__wrapper tfoot tr:last-of-type th {
    font-size: 1.25em;
}

/* ADDRESSES */
[data-customer-addresses] [aria-expanded='false'] ~ div[id] {
    display: none;
}

[data-customer-addresses] [aria-expanded='true'] ~ div[id] {
    display: block;
}

.main-addresses__content,
.main-addresses__wrapper {
    max-width: 660px;
    margin-inline-end: auto;
    margin-inline-start: auto;
}

.main-addresses__content>*+*,
.main-addresses__wrapper>*+* {
    margin-top: 5.6rem;
}

.main-addresses__content .select select {
    width: 100%;
}

#AddAddress,
#address_form_new button {
    margin-top: 3.2rem;
}

#address_form_new>div,
.main-addresses__content > ul > li[data-address],
.main-addresses__content > ul > li[data-address] form > div {
    margin-top: 1.6rem;
}

li[data-address] button {
    margin-top: 1.6rem;
    margin-inline-end: .8rem;
}

.main-addresses__content > ul > li[data-address] > div {
    margin-top: 3.2rem;
    margin-bottom: 3.2rem;
}

/* Mobile login/register spacing, background, and equal height */
@media screen and (max-width: 59.99em) {
    /*
      手机端背景图入口：
      - 背景图本身通过 Liquid 写入 --customer-mobile-bg-image
      - 透明度通过 Liquid 写入 --customer-mobile-bg-opacity
      - 只在手机端生效，桌面端完全不受影响
    */
    .main-login__container--image-fill {
        position: relative;
        isolation: isolate;
        background: transparent;
    }

    /*
      手机端背景图层：
      - 用 ::before 当背景层，不影响表单、按钮、图片内容
      - opacity 只影响背景图，不会让表单内容一起透明
      - 默认 opacity 为 0，所以没上传图时不会出现背景
    */
    .main-login__container--image-fill::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        background-image: var(--customer-mobile-bg-image, none);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        opacity: var(--customer-mobile-bg-opacity, 0);
    }

    /*
      内容层放在背景图上面：
      - 确保 login/register 表单、图片、按钮可以正常点击
    */
    .main-login__container--image-fill > .customer__wrapper {
        position: relative;
        z-index: 1;
    }

    /*
      手机端统一 login/register 页面整体高度：
      - login 和 register 都使用 .main-login__container--image-fill
      - min-height 保证两个页面基础高度一致
      - 内容如果超过高度，仍然会自然撑开，不会裁切
    */
    .main-login__container--image-fill .customer__wrapper {
        min-height: var(--customer-mobile-page-height, 78rem);
        gap: 2.4rem;
        align-content: start;
    }

    /*
      手机端统一右侧内容区高度：
      - login/register 都使用 .main-login__content
      - 用来抵消两个页面表单字段数量不同造成的高度差
    */
    .main-login__container--image-fill .main-login__content {
        min-height: var(--customer-mobile-content-height, 50rem);
        display: flex;
        flex-direction: column;
    }

    /*
      表单所在区域稳定占位：
      - 让 login/register 切换时底部空间更接近
    */
    .main-login__container--image-fill .main-login__content > div:last-child {
        flex: 1 1 auto;
    }

    /*
      手机端 right image 透明处理：
      - 让 right image 外层和图片本身不带白底
      - 如果上传的是透明 PNG，透明区域会直接露出页面手机背景图
    */
    .customer-login-content-image {
        background: transparent !important;
        box-shadow: none !important;
        border: 0 !important;
        overflow: visible;
    }

    .customer-login-content-image img {
        width: 100%;
        height: auto;
        background: transparent !important;
        box-shadow: none !important;
        border: 0 !important;
        object-fit: contain;
        object-position: center;
    }

    /*
      手机端缩短 Login / Sign up tab 和第一个输入框之间的距离。
    */
    .main-login__container--image-fill .customer__content--header {
        margin-bottom: 3.2rem;
    }

    /*
      手机端 login 页 social login 区域和底部稍微拉开。
      register 如果已经去掉 social login，就不会受到实际影响。
    */
    .main-login__content .customer-login-providers {
        margin-bottom: 3.2rem;
    }
}

/* Desktop login layout: 60em 以上进入左右两栏布局 */
@media screen and (min-width: 60em) {
    /* 外层容器强制占满整个浏览器宽度，突破主题默认 page-gutter/max-width */
    .main-login__container.main-login__container--image-fill {
        width: 100vw !important;
        max-width: none !important;
        margin-left: calc(50% - 50vw) !important;
        margin-right: calc(50% - 50vw) !important;
        padding: 0 !important;
        padding-inline: 0 !important;
        padding-inline-start: 0 !important;
        padding-inline-end: 0 !important;
    }

    /*
      登录主 wrapper：
      - 两列各占 1fr，所以左右宽度相等
      - min-height: calc(100vh - 14rem) 是桌面端整体最低高度
      - 这个值会随浏览器可视高度和缩放比例变化
    */
    .main-login__container--image-fill .main-login__wrapper {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        gap: 5.6rem;
        width: 100% !important;
        max-width: none !important;
        min-height: calc(100vh - 14rem);
        margin: 0 !important;
        padding: 0 !important;
        align-items: stretch;
    }

    /*
      左侧图片栏：
      - 固定在第 1 列
      - min-height 同样使用 calc(100vh - 14rem)
      - display:flex 是为了让里面的图片容器可以拉满高度
    */
    .main-login__container--image-fill .main-login__header {
        grid-column: 1;
        min-height: calc(100vh - 14rem);
        height: auto;
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-self: stretch;
    }

    /*
      左侧图片外壳：
      - flex: 1 让它填满左侧栏
      - min-height: 100% 让图片外壳跟随 .main-login__header 高度
    */
    .main-login__container--image-fill .customer-login-image {
        flex: 1 1 auto;
        width: 100% !important;
        height: auto;
        min-height: 100%;
        margin: 0 !important;
        padding: 0 !important;
        aspect-ratio: auto !important;
        overflow: hidden;
    }

    /*
      左侧 picture/img：
      - height: 100% 和 min-height: 100% 是左图填满左栏高度的关键
    */
    .main-login__container--image-fill .customer-login-image picture,
    .main-login__container--image-fill .customer-login-image img {
        display: block;
        width: 100%;
        height: 100%;
        min-height: 100%;
    }

    /* 左侧图片裁切填满容器，不留白 */
    .main-login__container--image-fill .customer-login-image img {
        object-fit: cover;
        object-position: center;
    }

    /*
      右侧登录栏：
      - 固定在第 2 列
      - min-height: calc(100vh - 14rem) 让右侧最低高度跟左侧一致
      - padding 控制右侧内容和页面边缘的距离
      - 浏览器缩放时，这里的 min-height 会跟着 viewport 高度变化
    */
    .main-login__container--image-fill .main-login__content {
        grid-column: 2;
        display: flex !important;
        flex-direction: column;
        justify-content: flex-start;
        min-height: calc(100vh - 14rem) !important;
        height: auto !important;
        align-self: stretch;
        padding-top: 4rem;
        padding-right: 5rem;
        padding-bottom: 8rem;
        padding-left: 0;
        box-sizing: border-box;
    }

    /* 右侧内部每个直接 div 占满右栏宽度 */
    .main-login__container--image-fill .main-login__content > div {
        width: 100%;
    }

    /*
      右侧顶部图片：
      - 桌面端显示
      - height: 24rem 是固定高度，会随 rem/浏览器缩放的计算结果变化
      - 如果右侧顶部图片显示被压缩或裁切，主要看这里和下面 img 的 height:100%
    */
    .customer-login-content-image {
        display: block;
        height: 24rem;
        margin-bottom: 3.2rem;
    }

    /*
      右侧顶部图片填满 24rem 高度：
      - object-fit: cover 会裁切图片以铺满容器
    */
    .customer-login-content-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    /* 桌面端 recover 打开时继续强制隐藏登录主体 */
    #recover:target~.main-login__header,
    #recover:target~.main-login__content,
    #recover:target~.guest-login {
        display: none !important;
    }

    .main-account__wrapper>div,
    .main-order__wrapper>div {
        grid-template-areas: "COL1 COL1 COL1 COL1 COL2";
    }
}    /*
      手机端关闭点击 input 自动放大：
      - iOS Safari 会在输入框字体小于 16px 时自动 zoom
      - 这里仅手机端把表单控件字号设为 16px，不影响桌面端
    */
    .main-login__container--image-fill input,
    .main-login__container--image-fill textarea,
    .main-login__container--image-fill select {
        font-size: 16px !important;
    }
.customer-newsletter-optin {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    margin: 1.6rem 0 0;
    text-align: left;
}

.customer-newsletter-optin input {
    width: 1.6rem;
    height: 1.6rem;
    min-width: 1.6rem;
    margin: .2rem 0 0;
    cursor: pointer;
    accent-color: #000;
}

.customer-newsletter-optin label {
    margin: 0;
    font-size: 1.3rem;
    line-height: 1.4;
    font-weight: 400;
    cursor: pointer;