:root {
    --cartSite: 1340px;
    --colorPrimary: #0A0A0A; 
    --colorSecondary: #F60;
    --colorBlue: #2792ce;
    --textGray: #525252;
    --neutralGray: #A3A3A3;
    --colorPrice: #D92A28;
    --borderColor: #F5F5F5;
    --borderColorHover: #E5E5E5;
    --borderRadius: 8px; 
    --borderRadiusMd: 12px;
}

.d-flex {
    display: flex;
}

.justify-content-center {
    justify-content: center;
}

.justify-content-between {
    justify-content: space-between;
}

.justify-content-start {
    justify-content: flex-start;
}

.justify-content-end {
    justify-content: flex-end;
}

.align-items-center {
    align-items: center;
}

.align-items-baseline {
    align-items: baseline;
}

.flex-wrap {
    flex-wrap: wrap;
}

.gap-4 {
    grid-gap: 4px;
}

.txt-secondary {
    color: var(--colorSecondary);
}

.main-content {
    background-color: #f5f5f5;
}

input[type=checkbox],input[type=radio] {
    position: absolute;
    opacity: 0;
    visibility: hidden
}

#cart-module-content {
    padding: 0 30px;
    width: 100%;
    max-width: var(--cartSite);
    margin: 0 auto;
    min-height: 536px;
    font-size: var(--pr-font-size-body);
}

.cart-loading {
    height: 70vh;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cart-loading::before {
    --iconLoading: 70px;
    content: "";
    display: block;
    width: var(--iconLoading);
    height: var(--iconLoading);
    border-radius: var(--iconLoading);
    padding: 4px;
    background: #c1c1c1;
    --_m: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0) content-box;
    -webkit-mask: var(--_m);
    mask: var(--_m);
    -webkit-mask-composite: source-out;
    mask-composite: subtract;
    animation: l3 1s infinite linear;
}

.checkout-breadcrumb.breadcrumb--center {
    list-style: none;
    padding: 0;
    padding: 24px 0;
    margin-top: 0;
    margin-bottom: 0;
}

.breadcrumb__item {
    color: var(--neutralGray);
}

.breadcrumb__icon {
    width: 32px;
    height: 32px;
    background: #d1d5db;
    border-radius: 50px;
    color: #fff;
    font-size: 16px;
}

.checkout-breadcrumb small {
    height: 1px;
    width: 60px;
    background-color: var(--neutralGray);
    display: inline-block;
    margin: 0 10px;
}

.breadcrumb__item--active .breadcrumb__icon {
    background-color: #16a34a;
}

.breadcrumb__item--active .breadcrumb__text {
    color: var(--colorPrimary);
    font-weight: 700;
}

.breadcrumb__item--active.breadcrumb__item--current .breadcrumb__text {
    color: #16a34a;
}

.breadcrumb__item--current .breadcrumb__icon {
    position: relative;
    margin-right: 6px;
}

.breadcrumb__item--current .breadcrumb__icon::before {
    content: "";
    width: 40px;
    height: 40px;
    border: 2px solid #16a34a;
    border-radius: 50px;
    display: block;
    position: absolute;
}

.communication-choices-description {
    margin-bottom: 6px;
}

.communication-choices-item + .communication-choices-item {
    margin-left: 16px;
}

#cart-module-content .communication-choices-wrapper .communication-choices-item input[type=checkbox] {
    margin-right: 4px;
}

/* Input checkbox */
#cart-module-content .checkout-option-input {
    position: relative;
    opacity: 1;
    visibility: visible;
    width: 22px;
    min-width: 22px;
    height: 22px;
    min-height: 22px;
    vertical-align: top;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border: 2px solid var(--pr-color-neutral-100);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-print-color-adjust: exact;
    color-adjust: exact;
    margin:0;
    cursor: pointer;
}

#cart-module-content .checkout-option-input[type=checkbox] {
    border-radius: 5px;
}

body #cart-module-content .checkout-option-input:checked {
    background-color: var(--colorSecondary);
    border-color: var(--colorSecondary);
}

body #cart-module-content .checkout-option-input:checked[type=checkbox] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23FFFFFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
}

body #cart-module-content .checkout-option-input.choose-cart-mini { 
    background-color: var(--colorSecondary);
    border-color: var(--colorSecondary);
}

body #cart-module-content .checkout-option-input.choose-cart-mini[type=checkbox]:not(:checked) {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="%23FFFFFF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 12l14 0" /></svg>');
}

body #cart-module-content .checkout-option-input:disabled {
    pointer-events: none;
    filter: none;
    opacity: 0.5; 
}
/* End input checkbox */

/* Input radio */
#cart-module-content .radio-input-custom {
    appearance: none;
    -webkit-appearance: none;
    width: 16px;
    height: 16px;
    min-width: 16px;
    border: 1px solid #D4D4D4;
    border-radius: 5px;
    margin: 0;
    cursor: pointer;
    position: relative;
    transition: border-color 0.2s ease;
    opacity: 1;
    visibility: visible;
}

#cart-module-content .radio-input-custom:hover {
    border-color: var(--colorSecondary);
}

#cart-module-content .radio-input-custom:checked {
    border-color: var(--colorSecondary);
}

#cart-module-content .radio-input-custom:checked + span {
    color: var(--colorSecondary);
}

#cart-module-content .radio-input-custom:checked::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 10px;
    height: 10px;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="%23F60" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"/><path d="M5 12l5 5l10 -10" /></svg>');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 12px;
}
/* End input radio */

/* Skeleton */
.skeleton-box {
    display: block;
    height: 16px;
    margin: 0;
    position: relative;
    overflow: hidden;
    background-color: #f1f1f1;
    border-radius: 3px
}

.skeleton-box::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: translateX(-100%);
    background-image: linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(255,255,255,.2) 20%,rgba(255,255,255,.5) 60%,rgba(255,255,255,0));
    animation: shimmer 1.8s infinite;
    pointer-events: none
}

@-webkit-keyframes shimmer {
    100% {
        transform: translateX(100%)
    }
}

@keyframes shimmer {
    100% {
        transform: translateX(100%)
    }
}

.container-indent[ng-cloak]>* {
    opacity: 0;
    pointer-events: none
}

.container-indent[ng-cloak]::before {
    --iconLoading: 70px;
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: calc(var(--iconloading)/ 2 * -1);
    margin-left: calc(var(--iconloading)/ 2 * -1);
    display: block;
    font-size: 12px;
    width: var(--iconLoading);
    height: var(--iconLoading);
    border-radius: var(--iconLoading);
    padding: 4px;
    background: #c1c1c1;
    --_m: conic-gradient(#0000 10%, #000),linear-gradient(#000 0 0) content-box;
    -webkit-mask: var(--_m);
    mask: var(--_m);
    -webkit-mask-composite: source-out;
    mask-composite: subtract;
    animation: l3 1s infinite linear;
    -webkit-border-radius: var(--iconLoading);
    -moz-border-radius: var(--iconLoading);
    -ms-border-radius: var(--iconLoading);
    -o-border-radius: var(--iconLoading)
}

@keyframes l3 {
    to {
        transform: rotate(1turn)
    }
}
/* End skeleton */

#js-update-item, 
#js-delete-item {
    width: 33px;
    height: 33px;
    border-radius: 40px;
    cursor: pointer;
    transition: .3s ease-in-out;
}

#js-update-item {
    background: #f5f5f5;
}

#js-update-item:hover {
    background: #E5E5E5;
}

#js-delete-item {
    background: #FEF2F2;
}

#js-delete-item:hover {
    background: #ffe7e7;
}

.make-change-wrap {
    grid-gap: 8px;
}

.loading-remove-item::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(255 255 255 / 22%);
}

.loading-remove-item .shopcart-info>*::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.loading-remove-item::after {
    --icon: 48px;
    content: "";
    width: var(--icon);
    height: var(--icon);
    border-radius: var(--icon);
    border: 2px solid #fff;
    border-top-color: #e1e1e1;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: calc(var(--icon) / 2 * -1) 0 0 calc(var(--icon) / 2 * -1);
    animation: lds-dual-ring 600ms linear infinite;
}

.loading-remove-item>* {
    filter: blur(1px);
    opacity: 0.5;
    pointer-events: none;
    user-select: none;
}

#cart-module-content .make-change-wrap .active {
    animation: lds-dual-ring 800ms linear infinite;
}

@keyframes lds-dual-ring {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.checkout-popup-variant-wrapper {
    margin-bottom: 12px;
}

.checkout-popup-quantity {
    display: grid;
    grid-template-columns: minmax(0, 1fr) max-content;
    align-items: center;
    margin-bottom: 16px;
}

.checkout-popup-quantity-title {
    font-weight: 500;
    color: var(--colorPrimary);
}

.checkout-popup-subtotal {
    text-align: right;
    color: var(--colorPrice);
}

.shopcart-qty .shopcart-button {
    width: 32px;
    min-width: 32px;
    height: 32px;
    border: 1px solid #E5E5E5;
    border-radius: var(--borderRadius);
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--colorPrimary, #0A0A0A);
}

.shopcart-qty {
    grid-gap: 4px;
}

.shopcart-qty .shopcart-button:hover {
    border-color:  #aeaeae;
}

#cart-module-content .shopcart-qty .quantity:hover,
#cart-module-content .shopcart-qty #quantity:hover {
    border-color:  var(--borderColorHover);
}

#cart-module-content .shopcart-qty .quantity:focus-visible,
#cart-module-content .shopcart-qty #quantity:focus-visible {
    outline: 1px solid var(--colorPrimary);
}

#dynamic-checkout-sidebar {
    border-radius: var(--borderRadiusMd); 
    border: 1px solid var(--Orange-200, #FFDCA5);
    background: #F5F5F5;
    padding: 12px;
    position: relative;
    z-index: 0;
}

.form-shopcart #dynamic-checkout-sidebar {
    margin: 20px 0 12px;
}

.express-checkout-desktop #payment-request-button-sidebar {
    margin-top: 12px;
    margin-bottom: 0;
}

/* Cart desktop sidebar không có grid-gap (khoảng cách chạy bằng margin từng phần tử)
   → slot Pay Later/Venmo/Card + Link + nút show-more phải tự mang margin, kẻo dính vào nút trên */
.express-checkout-desktop #paypal-button-container-sidebar-paylater,
.express-checkout-desktop #paypal-button-container-sidebar-venmo,
.express-checkout-desktop #paypal-button-container-sidebar-card,
.express-checkout-desktop #payment-request-button-sidebar-link,
.express-checkout-desktop .express-show-more {
    margin-top: 12px;
}

/* Drawer mini-cart (desktop): slot + show-more riêng của drawer cũng cách nhau bằng margin */
#mini-cart-header #paypal-button-container-drawer-paylater,
#mini-cart-header #paypal-button-container-drawer-venmo,
#mini-cart-header #paypal-button-container-drawer-card,
#mini-cart-header #payment-request-button-drawer-link,
#mini-cart-header .express-show-more {
    margin-top: 12px;
}

/* Braintree Hosted Fields — iframe fill 100% container nên container PHẢI có height cố định,
   không set là iframe bung chiếm cả trang. Style theo dạng ô input chuẩn của checkout. */
#braintree-card-form label {
    display: flex;
    align-items: center;
    font-size: 13px;
    color: #525252;
    margin-bottom: 4px;
}

#braintree-card-form .card_field {
    height: 44px;
    border: 1px solid #E5E5E5;
    border-radius: 6px;
    background: #fff;
    padding: 0 12px;
    margin-bottom: 8px;
}

#braintree-card-form .card_field iframe {
    height: 100%;
    font-size: 16px;
}

#braintree-card-form #braintree-card-errors {
    color: #D92A28;
    font-size: 13px;
}

.checkout-address-form #dynamic-checkout-sidebar {
    margin-bottom: 12px;
    background: #F5F5F5;
}

.express-checkout-btn-wrapper {
    display: flex;
    align-items: flex-start;
    grid-gap: 16px;
    /* Tối đa 2 nút mỗi hàng — nút thứ 3+ (Pay Later/Venmo) wrap xuống hàng dưới */
    flex-wrap: wrap;
}

.express-checkout-btn-wrapper > div {
    flex: 1 1 calc(50% - 8px);
    min-width: calc(50% - 8px);
}

.express-checkout-btn-wrapper #payment-request-button-sidebar,
.express-checkout-btn-wrapper #paypal-button-container-sidebar,
.express-checkout-btn-wrapper #paypal-button-container-sidebar-paylater,
.express-checkout-btn-wrapper #paypal-button-container-sidebar-venmo,
.express-checkout-btn-wrapper #paypal-button-container-sidebar-card,
.express-checkout-btn-wrapper #payment-request-button-sidebar-link {
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    /* JS toggle set inline display:block đè flex → div zoid inline-block sinh baseline gap ~7px
       làm nút PayPal cao hơn GPay (lệch hàng). line-height 0 triệt gap trong mọi trường hợp. */
    line-height: 0;
}

/* Nút "More payment options" — chiếm nguyên hàng dưới 2 nút express đầu */
.express-show-more {
    flex: 1 1 100%;
    min-width: 100%;
    background: none;
    border: none;
    padding: 0;
    color: #666;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    font-family: inherit;
    display: flex;
    align-items: center;
    justify-content: center;
    grid-gap: 2px;
}

.express-show-more:hover {
    color: var(--secondary, #ff7300);
}

.dynamic-checkout-title {
    margin: 0 auto 12px;
    width: max-content;
}

.sereprate-express-btn {
    background: linear-gradient(90deg, #FF9D32 0%, #C52C29 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 18px;
    font-weight: 700;
    font-style: italic;
}

.checkout-sticky-bottom-content {
    display: none;
}

.express-checkout-mobile-btn {
    width: 100%;
    margin-top: 10px;
    grid-gap: 12px;
    /* Nút show-more/slot là hàng riêng — thiếu wrap thì PayPal + show-more (min-width 100%) chung 1 hàng nowrap, tràn khỏi màn hình */
    flex-wrap: wrap;
}

.express-checkout-mobile-btn #paypal-button-container-sidebar,
.express-checkout-mobile-btn #payment-request-button-sidebar,
.express-checkout-mobile-btn #paypal-button-container-sidebar-paylater,
.express-checkout-mobile-btn #paypal-button-container-sidebar-venmo,
.express-checkout-mobile-btn #paypal-button-container-sidebar-card,
.express-checkout-mobile-btn #payment-request-button-sidebar-link {
    margin: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    max-height: 46px;
}

.dynamic-checkout-title-wrapper {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: #F5F5F5;
    width: max-content;
}

.dynamic-checkout-title-wrapper .sereprate-express-btn {
    padding: 0 10px;
}

.checkout-address-form #dynamic-checkout-sidebar:has(.sereprate-express-btn) {
    padding-top: 20px;
}

/* Popup edit product */
.promote-bundle-popup-wrapper,
#cart-module-content .checkout-popup-wrapper {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 999;
}

.promote-bundle-popup-wrapper,
#cart-module-content .show-modal-edit {
    display: block !important;
}

.promote-bundle-deal-background.active-bundle-popup,
#cart-module-content .checkout-popup-background {
    display: block;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(11, 11, 11, 0.4);
    z-index: 1;
}

.active-bundle-popup .promote-bundle-deal-content,
#cart-module-content .checkout-popup-content {
    background-color: var(--pr-color-white);
    height: max-content;
    width: 90%;
    max-width: 680px;
    max-height: 86dvh;
    margin: 4vh auto;
    position: relative;
    z-index: 2;
    border-radius: var(--borderRadius);
    box-shadow: var(--pr-shadow-500);
    pointer-events: all;
    overflow-y: auto;
}

.checkout-popup-head {
    padding: 16px 0;
    margin: 0 16px;
    display: flex;
    grid-gap: 16px;
    align-items: flex-start;
    justify-content: space-between;
    border-bottom: 1px solid var(--borderColor);
}

.checkout-popup-item-link-mobile {
    display: none;
}

#cart-module-content .checkout-popup-content .checkout-popup-item {
    padding: 16px;
    justify-content: flex-start;
    max-height: calc(100% - 84px);
}

#cart-module-content .checkout-popup-content .checkout-popup-action-wrapper {
    background-color: var(--pr-color-white);
    padding: 14px 16px;
    margin: 0;
    z-index: 11;
    height: 70px;
    width: 100%;
    border-radius: 0 0 var(--pr-spacing-02) var(--pr-spacing-02);
    border-top: 1px solid var(--borderColor);
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

#cart-module-content .checkout-popup-content .checkout-popup-action-wrapper .btn {
    padding: 12px 20px;
    border-radius: var(--borderRadius);
    margin-right: 0;
    text-transform: uppercase;
}

#cart-module-content .checkout-popup-content .checkout-popup-action-wrapper .btn.update-product {
    margin-left: 12px;
}

.checkout-popup-item-image {
    display: block;
    margin: 0 auto;
}

#cart-module-content .checkout-popup-item-link {
    width: 176px;
    height: 176px;
    box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.08);
    border-radius: 4px;
    border: 1px solid #FFF;
    background: #f8f8f8;
}

#cart-module-content .checkout-popup-item-link img {
    border-radius: 4px;
    mix-blend-mode: multiply;
}

#cart-module-content .checkout-popup-info {
    width: calc(100% - 176px);
    overflow-x: hidden;
    overflow-y: auto;
    padding-left: 22px;
    padding-right: 8px;
}

#cart-module-content .checkout-popup-item-head {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.2;
    color: var(--colorPrimary);
}

.sku-chosen__product-variant-item-box .sku-chosen__product-variant-heading span[id^="sku-chosen"] {
    font-weight: 400;
}

.checkout-popup-variant-wrapper .sku-chosen__variant-image {
    padding: 0 !important;
}

#cart-module-content .checkout-control {
    border: 1px solid #E5E5E5;
    border-radius: var(--borderRadius);
    text-align: center;
    font-size: 16px;
    max-width: 45px;
}

#cart-module-content .checkout-control:focus {
    border-color: var(--colorPrimary);
    outline-color: var(--colorPrimary)
}

#cart-module-content .checkout-popup-action-wrapper {
    margin-top: var(--pr-spacing-04)
}

#cart-module-content .btn {
    display: inline-block;
    vertical-align: middle;
    margin: 0;
    border: 1px solid transparent;
    transition: var(--pr-trans-standard);
    font-family: inherit;
    -webkit-appearance: none;
    line-height: 1;
    cursor: pointer;
    outline: none;
    outline: 0;
    user-select: none;
    background-color: var(--pr-color-white);
    color: var(--pr-color-black);
    font-weight: var(--pr-font-weight-heading);

    border-radius: var(--pr-radius-x-large);
    margin-right: var(--pr-spacing-03);
    font-size: var(--pr-spacing-05);
    padding: var(--pr-spacing-04) var(--pr-spacing-05);
}

#cart-module-content .btn.btn-apply-shipping {
    color: #fff;
    border-radius: var(--pr-radius-small);
    background-color: var(--pr-color-dodgerblue);
}

#cart-module-content .btn-apply-shipping:hover {
    background-color: var(--pr-color-darkslateblue);
    border-color: var(--pr-color-darkslateblue);
    transition: all .3s;
}

#cart-module-content .btn.add-product {
    background-color: var(--pr-color-white);
    border-color: var(--black);
    color: var(--black);
}

#cart-module-content #js-checkout-cancel {
    display: none !important;
}

#cart-module-content .btn.update-product {
    background-color: var(--black);
    border-color: var(--black);
    color: var(--pr-color-white);
}

.image-select-wrapper {
    display: grid;
    grid-template-columns: repeat(auto-fill, 60px);
    gap: 8px;
    margin-bottom: 12px;
    margin-top: 4px;
}
.image-select-option {
    cursor: pointer;
}
.show-modal-edit .product-variant-item-box.print-location {
    margin-top: 12px !important;
}

.print-location .product-variant-heading {
    color: var(--colorPrimary);
    font-weight: 500;
}

.print-location .product-variant-heading span {
    font-weight: 400;
}

.sku-chosen__list-size-variant .sku-chosen__active:not(.sku-chosen__hide-active) .sku-chosen__radio-input ~ .sku-chosen__radio-name {
    background-color: var(--colorPrimary);
    border-color: var(--colorPrimary);
}

.image-wrapper-inner img.selected {
    display: none;
}

.image-select-option.active .image-wrapper-inner img.selected {
    display: block;
}

.image-select-option.active .image-wrapper-inner img.default {
    display: none;
}

.checkout-popup-wrapper .sku-chosen__radio-label .sku-chosen__radio-name {
    border: 1px solid var(--borderColor);
}

/* End popup edit product */

/* Popup remove product */
#cart-module-content .delete-item-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
}

#cart-module-content .show-remove-modal {
    display: block !important;
}

#cart-module-content .delete-item-background {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 120%;
    height: 120%;
    display: block;
    transform: translate(-50%, -50%);
    background-color: rgba(11 11 11 / 25%);
    filter: blur(2px);
    z-index: 1;
}

#cart-module-content .delete-item-content {
    width: 90%;
    max-width: 420px;
    background-color: #fff;
    box-shadow: 0 6px 36px rgba(11 11 11 / 33%);
    border-radius: 20px;
    position: absolute;
    top: 40px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    text-align: center;
    pointer-events: all;
    padding: 16px 20px;
}

.delete-item-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 20px;
    color: var(--colorPrimary);
    font-weight: 500;
    border-bottom: 1px solid var(--borderColor);
    line-height: 1;
    padding-bottom: 10px;
}

.delete-item-icon {
    width: 60px;
    height: 60px;
    border-radius: 40px;
    background: var(--Red-100, #FEE2E1);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 16px auto;
}

.delete-item-desc {
    color: var(--colorPrimary);
    margin-bottom: 12px;
}

.delete-item-action {
    padding: 16px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 12px;
    margin-bottom: 12px;
}

.delete-item-action a {
    padding: 12px 20px;
    font-weight: 500;
    text-transform: uppercase;
    border-radius: var(--borderRadius);
    border: 1px solid #D92A28;
    line-height: 1;
}

.delete-item-action-cancel {
    color: #D92A28;
}

.delete-item-action-delete {
    color: #fff;
    background: #D92A28;
}

.delete-item-action a:hover {
    opacity: .9;
}

.delete-item-action-cancel:hover {
    color: #D92A28;
}

.delete-item-action-delete:hover {
    color: #fff;
}

.delete-item-action a:hover {
    opacity: .8;
}

.delete-item-content-bottom .delete-item-title {
    font-size: 16px;
    border: 0;
    padding-bottom: 12px;
    max-width: calc(100% - 54px);
    text-align: left;
    line-height: 1.1;
}

.cart-revew-slider {
    position: relative;
}

.swiper-button-next.cart-revew-next, .swiper-button-prev.cart-revew-prev {
    box-shadow: none !important;
    top: -28px;
    width: 24px;
    height: 24px;
    font-size: 20px;
}

.cart-review-item-list {
    overflow: hidden;
}

.swiper-button-next.cart-revew-next {
    right: 0;
}

.swiper-button-prev.cart-revew-prev {
    right: 30px;
    left: auto;
}

.cart-review-item-item {
    border-radius: 4px;
    border: 1px solid var(--borderColor);
    padding: 12px;
}

.cart-review-item-content {
    margin-top: 12px;
    text-align: left;
    font-size: 15px;
}

span.close-pop {
    cursor: pointer;
    color: #a1a1a1;
    display: flex;
}

span.close-pop:hover {
    color: #0a0a0a;
}

/* End popup remove product */

/* Buy design */
#cart-module-content .buydesign-item .buydesign-action {
    align-items: center;
    grid-gap: 4px;
}

#cart-module-content .buydesign-item .buydesign-action div {
    color: var(--colorPrimary);
    font-size: 14px;
    line-height: 1.2;
}

.buydesign-item {
    position: relative
}

.buydesign-content-item {
    line-height: 1.3;
    min-height: 24px;
    max-width: 440px;
}

.buydesign-content-item.hiredesign-content-item {
    min-height: 0;
    margin-top: 6px;
}

.this-design-wrapper {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 3;
    width: 100%;
    padding: 0;
    margin-top: 6px;
    display: block;
    opacity: 0;
    transition: var(--pr-trans-standard);
    pointer-events: none;
    z-index: 10;
    background-color: var(--pr-color-white);
    border-top: var(--pr-size-border-width-hairline) solid var(--pr-color-flash);
    font-weight: 400;
    max-width: 440px
}

.buydesign-help {
    color: var(--pr-color-dark-x);
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 6px 0 0
}

.buydesign-item .checkbox-label+.checkbox-label {
    margin: 1px 0 0 6px;
    height: 20px;
    min-width: 20px;
}

.buydesign-help svg {
    width: 16px;
    min-width: 16px;
    margin-left: var(--pr-spacing-02);
    transform: translateY(3px)
}

.design-template {
    border-radius: var(--pr-radius-small);
    margin-top: var(--pr-spacing-03);
    overflow: hidden;
    background-color: var(--pr-color-flash);
    height: 216px;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden
}

.design-template img {
    height: 200px;
    object-fit: contain;
    object-position: center
}

.buydesign-item::before {
    content: "";
    position: absolute;
    top: -10px;
    left: -10px;
    display: block;
    width: calc(100% + 20px);
    height: 50px;
    transform: scale(0);
    opacity: 0;
    background-color: var(--pr-color-white);
    border-radius: var(--pr-radius-small);
    box-shadow: 0 4px 16px rgba(11 11 11 / 11%);
    pointer-events: none;
    transition: var(--pr-trans-standard);
    transform-origin: top center;
    z-index: 9;
    max-width: 460px
}

.package-shipment-product .buydesign-item::before {
    left: -11px;
    width: calc(100% + 18px);
}

.package-shipment-product input[name=buydesign]:checked~.buydesign-item::before {
    height: 320px;
    top: -7px;
}

input[name=buydesign]:checked~.buydesign-item .this-design-wrapper {
    opacity: 1;
    pointer-events: all;
    overflow: hidden
}

input[name=buydesign]:checked~.buydesign-item .buydesign-content-item {
    position: relative;
    z-index: 10
}

.checkbox-label .close-circle {
    display: none
}

input[name=buydesign]:checked~.buydesign-item .buydesign-content-item .question-circle {
    display: none
}

input[name=buydesign]:checked~.buydesign-item .buydesign-content-item .close-circle {
    display: block
}

input[name=buydesign]:checked~.buydesign-item::before {
    opacity: 1;
    height: 330px;
    transform: scale(1)
}

input[name=buydesign]:checked~.buydesign-item[data-design=valid]::before {
    height: 120px
}

input[name=buydesign]:checked~.close-buyDesign {
    display: block;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1;
    background-color: rgba(11 11 11 / 0%)
}

.checkout-buyDesign .buydesign-item .checkbox-label+.checkbox-label {
    margin-left: 6px
}
/*End buy design */

#cart-module-content .md-also-bought-content {
    padding-bottom: 32px;
}

#cart-module-content .md-also-bought-content .md-also-bought-link {
    border-radius: 5px;
}

#cart-module-content .md-also-bought-content .md-also-bought-item {
    background: transparent;
}

footer .policy-item {
    pointer-events: none;
}

footer .policy-item .policy-txt-icon {
    opacity: 0;
}
#try-on-icon {
    border-radius: 24px;
    background: #F5F5F5;
    padding: 6px 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    grid-gap: 4px;
    cursor: pointer;
    transition: .3s ease;
    width: max-content;
}

#try-on-icon:hover {
    background-color: #E5E5E5;
}

#try-on-icon span {
    font-size: 15px;
    font-weight: 700;
    background: var(--tryon, linear-gradient(90deg, #504BFF 0%, #FF7F0B 100%));
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* loading box */
.checkout-loading-item-wrapper {
    position: absolute;
    top: 16px;
    left: 0;
    width: 100%;
    z-index: 1;
}
.loading-box-item {
    width: 100%;
    height: 100%;
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: checkoutLoading;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #eee 8%, #ddd 18%, #eee 33%);
    background-size: 300% 100%;
    border-radius: var(--pr-radius-small);
}

.loading-box-item-abs {
    position: absolute;
    top: 12px;
    left: 12px;
    width: calc(100% - 24px);
    height: 30px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

@keyframes checkoutLoading {
    0% {
        background-position: 100% 0
    }

    100% {
        background-position: -100% 0
    }
}

.checkout-page:has(.get-off-block) .shopcart-row.checkout-loading-item-wrapper {
    margin-top: 36px;
}

.checkout-page:has(.get-off-block) .shopcart-row.checkout-loading-item-wrapper .shopping-checkout-item-footer {
    display: none;
}

@media (min-width: 768px) and (max-width: 1280px) {
    .subscribe-wrapper,
    footer .footer-navigation,
    .footer-payments .switch-component,
    .footer-payments .footer-payments-list {
        display: none;
    }

    footer .footer-payments {
        border-top: none !important;
        margin-top: 0;
        padding-top: 0;
    }
}

@media (min-width: 821px) {
    #cart-module-content .checkout-popup-content .checkout-popup-item {
        max-height: calc(86vh - 100px);
    }

    #cart-module-content .checkout-popup-content {
        max-height: unset;
        overflow-y: unset;
    }
}

@media (max-width: 820px) {
    .cart-right-content {
        position: static;
    }
    .header-navigation-block {
        display: none;
    }
    .checkout-breadcrumb.breadcrumb--center {
        font-size: 15px;
        overflow-x: auto;
        overflow-y: hidden;
        white-space: nowrap;
        padding: 12px 4px;
    }

    html:not([lang^='en']) .checkout-breadcrumb.breadcrumb--center {
        padding: 12px 16px;
        justify-content: flex-start;
    }

    .breadcrumb__icon {
        width: 24px;
        height: 24px;
        font-size: 15px;
    }

    .breadcrumb__icon svg {
        width: 16px;
        height: 16px;
    }

    .breadcrumb__item--current .breadcrumb__icon::before {
        width: 32px;
        height: 32px;
    }

    .checkout-breadcrumb small {
        width: 24px;
        margin: 0 6px;
    }

    #cart-module-content {
        padding: 0;
    }

    #cart-module-content .checkout-popup-content {
        width: 100%;
        max-width: 100%;
        margin: 0 !important;
        border-radius: var(--borderRadius) var(--borderRadius) 0 0;
    }
    
    #cart-module-content .checkout-popup-wrapper {
        bottom: 0;
        top: auto;
    }
    
    #cart-module-content .checkout-popup-wrapper.show-modal-edit {
        display: flex !important;
        align-items: flex-end;
    }
    
    #cart-module-content .checkout-popup-item-head {
        font-size: 17px;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        line-height: 120%;
    }
    
    .checkout-popup-head {
        position: sticky;
        top: 0;
        background: #fff;
        z-index: 9;
        padding: 12px 0;
        align-items: center;
    }

    #cart-module-content .checkout-popup-content .checkout-popup-action-wrapper {
        position: fixed;
        bottom: 0;
        z-index: 99;
        align-items: stretch;
        height: auto;
        min-height: 70px;
    }

    #cart-module-content .checkout-popup-content .checkout-popup-action-wrapper .btn {
        padding: 8px;
        font-size: 15px;
    }

    #cart-module-content .checkout-popup-content .checkout-popup-item {
        flex-direction: column;
        overflow-y: auto;
        max-height: unset !important;
        margin-bottom: 70px;
        padding: 12px 16px;
    }
    
    #cart-module-content .checkout-popup-info {
        width: 100%;
        padding: 0;
        overflow-y: unset;
    }

    #cart-module-content .checkout-popup-variant-wrapper .sku-chosen__variant-image {
        grid-template-columns: repeat(9, 1fr);
    }

    #cart-module-content .checkout-popup-item .checkout-popup-item-link {
        width: 100%;
        height: auto;
    }

    .checkout-popup-item-link-mobile {
        display: block;
    }

    .checkout-popup-item-link-desktop {
        display: none;
    }

    #cart-module-content .checkout-popup-item-link.checkout-popup-item-link-mobile  {
        width: 60px;
        height: 60px;
        min-width: 60px;
    }

    #cart-module-content .delete-item-content {
        width: 100%;
        max-width: 100%;
        border-radius: 20px 20px 0 0;
        bottom: 0;
        top: auto;
        left: 0;
        transform: translateY(0);
        opacity: 0;
        pointer-events: none;
        max-height: 86vh;
        overflow-y: auto;
        padding: 16px
    }
    
    #cart-module-content .show-remove-modal .delete-item-content {
        opacity: 1;
        pointer-events: all;
    }

    .delete-item-title {
        font-size: 20px;
        padding-bottom: 12px;
    }

    .this-design-wrapper {
        position: relative;
        height: 0;
        overflow: hidden;
        transition: var(--pr-trans-standard);
        margin-top: 0;
        border: none;
        background-color: transparent
    }

    input[name=buydesign]:checked~.buydesign-item .this-design-wrapper {
        margin-bottom: 12px;
        height: 280px;
        overflow: hidden
    }

    .buydesign-content-item {
        min-height: 36px;
        margin: 0;
        align-items: center;
    }

    .checkout-sticky-bottom-content {
        display: block;
    }

    .cart-left-wrapper, .cart-right-wrapper {
        position: static;
    }

    .checkout-sticky-bottom-mb {
        position: fixed;
        bottom: 0;
        left: 0;
        background: #fff;
        width: 100%;
        z-index: 999999;
        padding: 8px;
        box-shadow: 0 -4px 12px 0 rgba(0, 0, 0, 0.08);
        grid-gap: 12px;
        display: grid;
        grid-template-columns: minmax(0, 1fr) max-content;
    }

    body:has(.paygo-share-modal:not(.ng-hide)) .checkout-sticky-bottom-mb {
        z-index: -1;
    }
    
    .checkout-sticky-bottom-item {
        display: flex;
        align-items: baseline;
        grid-gap: 4px;
    }

    html[lang="ja"] .checkout-sticky-bottom-item-wrapper {
        flex-direction: column;
        align-items: flex-end;
    }

    html[lang="ja"] .checkout-sticky-bottom-item + .checkout-sticky-bottom-item::before {
        display: none;
    }
    
    .checkout-sticky-bottom-title {
        font-size: 15px;
        color: var(--neutralGray);
    }
    
    .checkout-sticky-bottom-value {
        font-size: 15px;
        color: var(--colorPrimary);
    }
    
    .checkout-sticky-bottom-value.total-value {
        font-size: 20px;
        color: var(--colorPrice);
        font-weight: 500;
    }

    .checkout-sticky-bottom-content > .checkout-sticky-bottom-item {
        justify-content: flex-end;
    }
    
    .checkout-sticky-bottom-item + .checkout-sticky-bottom-item {
        padding-left: 8px;
        position: relative;
    }
    
    .checkout-sticky-bottom-item + .checkout-sticky-bottom-item::before {
        content: "";
        width: 1px;
        height: 12px;
        background: #E5E5E5;
        position: absolute;
        left: 4px;
        top: 50%;
        transform: translateY(-50%);
    }
    
    #cart-module-content .footer-ext-wrapper .btn-to-checkout {
        font-size: 16px;
        padding: 12px;
        min-width: 141px;
    }

    #dynamic-checkout-sidebar {
        margin: 12px;
    }

    #cart-module-content .md-also-bought-list {
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden
    }

    #cart-module-content .md-also-bought-list .md-also-bought-item-wrapp {
        padding: 5px
    }

    #cart-module-content .md-also-bought-list .md-also-bought-item-wrapp .md-also-bought-item {
        min-width: 100%;
        width: 100%;
        margin: 0
    }

    #cart-module-content #also-bought-content {
        margin: 0;
        padding: 0 0 16px 16px;
    }

    #cart-module-content .md-also-bought-content .md-also-bought-heading {
        margin: 0 0 6px !important;
        padding: 6px 0 0 0 !important;
    }

    #cart-module-content .md-product-title {
        margin-bottom: 6px;
    }

    .form-shopcart #dynamic-checkout-sidebar {
        margin: 12px 16px;
    }

    .swiper-button-next.cart-revew-next, .swiper-button-prev.cart-revew-prev {
        display: block !important;
    }

    .swiper-button-prev.cart-revew-prev:after, 
    .swiper-button-next.cart-revew-next:after {
        font-size: 16px;
    }

    .checkout-loading-item-wrapper {
        left: 12px;
        width: calc(100% - 24px);
    }

    .cart-list-product-content .form-shopcart.loading-box {
        padding: 0;
    }

    #cart-module-content .checkout-option-input[type=checkbox] {
        width: 20px;
        height: 20px;
        min-width: 20px;
        min-height: 20px;
    }

    .receive-email-label {
        display: grid;
        grid-template-columns: 22px minmax(0, 1fr);
        grid-gap: 6px;
        align-items: flex-start;
    }

    .receive-email-title {
        font-size: 16px;
        transform: translateY(-3px);
    }

    .package-shipment-product .buydesign-item::before {
        left: -7px;
        width: calc(100% + 11px);
    }

    .package-shipment-product input[name=buydesign]:checked~.buydesign-item::before {
        height: 320px;
        top: -3px;
    }
    .communication-choices-description {
        font-size: 16px;
    }
    .cart-footer-localization {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 12px;
    }
    .express-show-more {
        margin-top: -4px;
        font-size: 15px;
    }
}

@media (max-width: 390px) {
    .checkout-sticky-bottom-mb {
        grid-gap: 8px;
    }

    #cart-module-content .footer-ext-wrapper .btn-to-checkout {
        font-size: 15px;
        padding: 12px 8px;
        min-width: 120px;
    }

    .checkout-loading-item-wrapper {
        padding: 12px;
    }
}



/* Nhãn extra discount trên item (mini-cart sidebar, trang cart, trang checkout).
   Ban sao y het o mini-shopping.css, cart-rule.css va site-v2/cart-panel.css - sua thi sua ca ba.
   Phai co ban .shopcart-configurations ... : cart-paygo.css:145 dat font-size 15px
   va color textGray cho moi span/div trong .shopcart-configurations (do uu tien 0,1,1),
   chi mot class (0,1,0) se bi de mat mau va co chu. */
.mini-sidebar-extra-discount,
.shopcart-configurations .mini-sidebar-extra-discount {
    display: inline-flex;
    align-items: center;
    grid-gap: 4px;
    margin-top: 4px;
    padding: 2px 8px;
    border-radius: 4px;
    background: #FFF8EC;
    color: var(--primary-btn, #D92A28);
    font-size: 12px;
    font-weight: 500;
    line-height: 1.4;
}

.mini-sidebar-extra-discount span,
.shopcart-configurations .mini-sidebar-extra-discount span {
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
}

.mini-sidebar-extra-discount svg {
    flex: 0 0 auto;
}

@media (max-width: 760px) {
    .mini-sidebar-extra-discount,
    .shopcart-configurations .mini-sidebar-extra-discount {
        font-size: 11px;
        padding: 2px 6px;
    }
}