/**

 * Xuan Cuong Handicraft - Module: products.css

 * Showroom Products, Most Loved Grid, Special Offers Carousel & Catalog Cards

 */


/* ==========================================================================
   CURATED SHOWROOM PRODUCTS (TÁM MÓN SHOWROOM)
   ========================================================================== */
.section-curated-products {
    background-color: #FFFFFF;
    padding-top: 480px;
    /* Accommodates bottom half of the 3 overlapping cards */
    margin-top: -360px;
    /* Pulls white section up behind the bottom half of the cards */
    padding-bottom: 6rem;
    position: relative;
    z-index: 5;
}

.curated-header-flex {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 3rem;
}

.curated-title-group {
    max-width: 700px;
}

.curated-title {
    color: #111111;
}

.link-view-all {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--xc-text-link);
}

.link-view-all:hover {
    color: var(--xc-primary);
    gap: 0.8rem;
}

.curated-products-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2.8rem 2.2rem;
}

.curated-product-card {
    display: flex;
    flex-direction: column;
}

/* Sản phẩm đầu tiên to nhất chiếm 2 cột */
.curated-product-card:first-child {
    grid-column: span 2;
}

.curated-thumb-wrap {
    width: 100%;
    height: 380px;
    overflow: hidden;
    background-color: #F5F3ED;
    border-radius: var(--radius-sm);
    margin-bottom: 1.15rem;
    display: block;
}

.curated-thumb-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.curated-product-card:hover .curated-thumb-wrap img {
    transform: scale(1.04);
}

.curated-product-card:first-child .curated-item-name {
    font-size: var(--fs-card-title);
}

.curated-item-name {
    font-size: var(--fs-card-title);
    font-weight: 700;
    margin-bottom: 0.35rem;
    color: #1E262B;
    line-height: 1.35;
}

.curated-item-name a {
    color: #1E262B;
    text-decoration: none;
    transition: color var(--transition);
}

.curated-item-name a:hover {
    color: var(--xc-primary);
}

.curated-item-tag {
    font-size: 18px;
    font-weight: 500;
    color: #534833;
    font-family: var(--font-sans);
}


/* ==========================================================================
   PRODUCTS CATALOG PAGE (designs/Sản phẩm.png)
   ========================================================================== */
.page-shop {
    background-color: #FFFFFF;
    padding: 0 0 90px 0;
}

/* 1. Hero Section */
.shop-hero-banner {
    width: 100%;
    height: 300px;
    background: url('../../images/product-banner.png') center center / cover no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: relative;
    margin-bottom: 60px;
}

.shop-hero-inner,
.shop-hero-content {
    display: flex;
    justify-content: start;
    align-items: end;
    width: 100%;
    max-width: 1440px;
    padding: 80px 0;
}

.shop-hero-title {
    color: var(--text-white, #FFF);
    /* heading-title */

    font-size: var(--fs-heading);
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin: 0;
    text-align: center;
}

.shop-container {
    max-width: 1440px;
    margin: 0 auto;
    padding: 0 2rem;
}

.shop-layout-grid {
    display: grid;
    grid-template-columns: 340px minmax(0, 1fr);
    gap: 40px;
    align-items: start;
}

/* 2. Sidebar Filters */
.shop-sidebar-filter {
    display: flex;
    padding: var(--spacing-spacer, 32px);
    flex-direction: column;
    align-items: center;
    align-self: stretch;
    border-radius: var(--radius-large, 12px);
    background: #F6F6F7;
    box-sizing: border-box;
    width: 100%;
}

.filter-header-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    align-self: stretch;
    margin-bottom: 24px;
    padding-bottom: 12px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.filter-main-heading {
    border-radius: var(--radius-large, 12px);
    background: #F6F6F7;
    color: var(--text-black, #1E262B);

    font-size: 22px;
    font-weight: 700;
    line-height: normal;
    margin: 0;
}

.btn-clear-filters {
    color: var(--primary-color, #811);
    text-align: center;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    /* 160% */
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    text-decoration: underline;
    transition: opacity 0.2s ease;
}

.btn-clear-filters:hover {
    opacity: 0.8;
}

/* Search input */
.filter-search-box {
    border-radius: 8px;
    background: rgba(0, 0, 0, 0.10);
    display: flex;
    padding: 12px 16px;
    align-items: center;
    gap: 8px;
    align-self: stretch;
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 20px;
}

.filter-search-box .search-icon {
    color: #161519;
    font-size: 15px;
    flex-shrink: 0;
}

.filter-search-input {
    border: none;
    background: transparent;
    outline: none;
    width: 100%;
    padding: 0;
    color: #161519;
    /* content-sub */

    font-size: var(--fs-body);
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
    /* 140% */
}

.filter-search-input::placeholder {
    color: rgba(22, 21, 25, 0.6);

    font-size: var(--fs-body);
    font-weight: 500;
    line-height: 28px;
}

/* Filter Groups (DANH MỤC & LOẠI, etc.) */
.filter-group {
    width: 100%;
    align-self: stretch;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    padding: 16px 0;
}

.filter-group:last-child {
    border-bottom: none;
}

.filter-group-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    user-select: none;
    width: 100%;
    padding-bottom: 12px;
}

.filter-group-header .group-name {
    color: var(--text-black, #1E262B);
    /* content-button */

    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    /* 160% */
}

.filter-group-header .toggle-arrow,
.filter-group-header i {
    color: var(--text-black, #1E262B);
    font-size: 14px;
    transition: transform 0.25s ease;
}

.filter-group:not(.open) .filter-checkbox-list,
.filter-group.is-collapsed .filter-checkbox-list {
    display: none;
}

.filter-group:not(.open) .toggle-arrow,
.filter-group.is-collapsed .filter-group-header i {
    transform: rotate(180deg);
}

.filter-checkbox-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.filter-checkbox-list li {
    margin: 0;
}

.custom-checkbox {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer;
    position: relative;
    user-select: none;
}

.custom-checkbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.custom-checkbox .checkmark {
    width: 18px;
    height: 18px;
    border: 1.5px solid #C4BEB2;
    border-radius: 4px;
    background-color: #FFFFFF;
    display: inline-block;
    position: relative;
    flex-shrink: 0;
    transition: all 0.2s ease;
}

.custom-checkbox input:checked~.checkmark {
    background-color: var(--primary-color, #881111);
    border-color: var(--primary-color, #881111);
}

.custom-checkbox input:checked~.checkmark::after {
    content: "";
    position: absolute;
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid #FFFFFF;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* Các checkbox dạng uncheck */
.custom-checkbox .label-text {
    color: var(--text-gray, #60606B);
    /* content-sub */

    font-size: var(--fs-body);
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
    /* 140% */
    transition: color 0.2s ease;
}

/* Label của checkbox đã checked */
.custom-checkbox input:checked~.label-text,
.custom-checkbox:has(input:checked) .label-text {
    color: var(--text-black, #1E262B);
    /* content-sub */

    font-size: var(--fs-body);
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
    /* 140% */
}

/* 3. Catalog Main Area & Dropdowns */
.shop-main-catalog {
    min-width: 0;
}

.catalog-top-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 35px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    flex-wrap: wrap;
    gap: 16px;
}

.results-count {
    color: var(--text-gray, #60606B);

    font-size: var(--fs-body);
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
}

.catalog-sort-group {
    display: flex;
    gap: 16px;
    align-items: center;
    flex-wrap: wrap;
}

/* Các dropdown chọn bộ lọc (Figma Node: Filter Dropdowns) */
.catalog-filter-dropdown {
    position: relative;
}

.catalog-dropdown-trigger {
    background: #F6F6F7;
    border-radius: 8px;
    border: none;
    outline: none;
    padding: 10px 18px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.catalog-dropdown-trigger:hover,
.catalog-filter-dropdown.is-open .catalog-dropdown-trigger {
    background: #EEEEF0;
}

.catalog-dropdown-trigger .trigger-label {
    color: var(--text-black, #1E262B);
    /* content-button */

    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    white-space: nowrap;
}

.catalog-dropdown-trigger .dropdown-chevron {
    width: 12px;
    height: 8px;
    transition: transform 0.25s ease;
    flex-shrink: 0;
}

.catalog-filter-dropdown.is-open .dropdown-chevron {
    transform: rotate(180deg);
}

/* Dropdown Menu Panel */
.catalog-dropdown-panel {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    width: 244px;
    padding: 24px;
    border-radius: var(--radius-large, 12px);
    background: #F6F6F7;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    box-sizing: border-box;
    z-index: 100;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
}

.catalog-filter-dropdown.is-open .catalog-dropdown-panel {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.dropdown-panel-title {
    color: var(--text-black, #1E262B);

    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
    margin: 0 0 16px 0;
}

.dropdown-panel-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
    width: 100%;
}

.dropdown-panel-list li {
    margin: 0;
}

.dropdown-panel-list .custom-checkbox {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.dropdown-panel-list .custom-checkbox .label-text {
    font-size: var(--fs-body);
    line-height: 28px;
    font-weight: 500;
    color: var(--text-gray, #60606B);
}

.dropdown-panel-list .custom-checkbox input:checked~.label-text,
.dropdown-panel-list .custom-checkbox:has(input:checked) .label-text {
    color: var(--text-black, #1E262B);
}

/* 4. Products Grid & Card */
.catalog-grid-three {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 40px;
    margin-bottom: 60px;
}

.catalog-product-item {
    display: flex;
    flex-direction: column;
}

/* Card sản phẩm: ảnh */
.catalog-product-item .item-thumb-link {
    border-radius: var(--radius-middle, 8px);
    background: lightgray 0px -130.185px / 100% 151.355% no-repeat;
    display: flex;
    height: 291px;
    padding: 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 140px;
    align-self: stretch;
    position: relative;
    overflow: hidden;
    box-sizing: border-box;
}

.catalog-product-item .item-thumb-link img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
    z-index: 1;
}

/* Ảnh của các sản phẩm ở đây khi hover vào đều có hiệu ứng zoom to */
.catalog-product-item:hover .item-thumb-link img {
    transform: scale(1.08);
}

.catalog-product-item .item-info {
    padding-top: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    text-align: left;
}

/* Card sản phẩm: tên */
.catalog-product-item .item-title {
    margin: 0;
}

.catalog-product-item .item-title a {
    color: var(--text-black, #1E262B);
    /* content-title-2 */

    font-size: var(--fs-card-title);
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-decoration: none;
    transition: color 0.2s ease;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.catalog-product-item .item-title a:hover {
    color: var(--primary-color, #881111);
}

/* Card sản phẩm: giá */
.catalog-product-item .item-price {
    color: var(--text-black, #1E262B);
    /* content-button */

    font-size: var(--fs-price);
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    /* 160% */
    display: block;
}

/* Pagination */
.catalog-pagination {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 36px;
    margin-top: 10px;
    border-top: 1px solid rgba(0, 0, 0, 0.12);
}

.catalog-pagination .page-indicator {

    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    color: var(--text-black, #1E262B);
}

.catalog-pagination .page-nav-arrows {
    display: flex;
    align-items: center;
    gap: 32px;
}

.catalog-pagination .nav-arrow-btn {
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
    color: var(--text-black, #1E262B);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    transition: color 0.2s ease, transform 0.2s ease;
}

.catalog-pagination .nav-arrow-btn svg {
    display: block;
    width: 22px;
    height: 22px;
}

.catalog-pagination .nav-arrow-btn:hover {
    color: var(--primary-color, #881111);
}

.catalog-pagination .nav-arrow-btn.prev-page-btn:hover {
    transform: translateX(-3px);
}

.catalog-pagination .nav-arrow-btn.next-page-btn:hover {
    transform: translateX(3px);
}


/* 3. Most Loved Products - Asymmetric 2-Row Grid (Node 4259:5576) */
.section-favorite-products {
    padding: 3rem 0;
    background-color: #FFFFFF;
}

.favorite-header-centered {
    text-align: center;
    margin-bottom: 3.5rem;
}

.favorite-title {
    color: var(--text-black, #1E262B);
    font-size: var(--fs-heading);
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin-top: 0.4rem;
}

.favorite-asymmetric-grid {
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-bottom: 3.5rem;
}

.favorite-row {
    display: flex;
    gap: 40px;
    width: 100%;
}

.favorite-card {
    position: relative;
    border-radius: var(--radius-md);
    overflow: hidden;
    background-color: #FBF9F5;
}

.favorite-row-1 .card-wide {
    flex: 0 0 calc(66% - 16px);
}

.favorite-row-1 .card-standard {
    flex: 0 0 calc(34% - 16px);
}

.favorite-row-2 .card-standard {
    flex: 0 0 calc(34% - 16px);
}

.favorite-row-2 .card-wide {
    flex: 0 0 calc(66% - 16px);
}

.favorite-card-inner {
    display: block;
    text-decoration: none;
    color: inherit;
    height: 100%;
}

.favorite-thumb-wrap {
    width: 100%;
    height: 460px;
    position: relative;
    overflow: hidden;
    background-color: #F5F3ED;
    border-radius: var(--radius-md);
}

.favorite-thumb-wrap .fav-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.6s cubic-bezier(0.25, 1, 0.5, 1);
    will-change: transform;
}

.favorite-thumb-wrap .fav-img-primary {
    transform: translateX(0);
    z-index: 1;
}

.favorite-thumb-wrap .fav-img-secondary {
    transform: translateX(100%);
    z-index: 2;
}

/* Hover: ảnh hiện tại trượt sang trái, ảnh tiếp theo trượt vào từ phải */
.favorite-card:hover .fav-img-primary {
    transform: translateX(-100%);
}

.favorite-card:hover .fav-img-secondary {
    transform: translateX(0);
}

.favorite-details {
    padding: 20px 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #FFFFFF;
}

.favorite-product-title {
    color: var(--text-black, #1E262B);
    font-size: var(--fs-card-title);
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.favorite-card:hover .favorite-product-title {
    color: var(--xc-primary);
}

.favorite-view-arrow {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #F4F1EA;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--xc-dark);
    transition: all 0.25s ease;
}

.favorite-card:hover .favorite-view-arrow {
    background-color: var(--xc-primary);
    color: #FFFFFF;
    transform: translateX(4px);
}

.favorite-cta-bottom {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 32px;
    border-top: 1px solid #60606B;
    padding-top: 20px;
}

.btn-favorite-all {
    color: var(--text-black, #1E262B);
    text-align: center;
    /* content-button */

    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    /* 160% */
    text-decoration: none;
    background: transparent;
    border: none;
    padding: 0;
    display: inline-block;
    transition: color 0.25s ease, opacity 0.25s ease;
}

.btn-favorite-all:hover {
    color: var(--xc-primary, #881111);
    opacity: 0.85;
}

/* 4. Special Offers / Sale Products Carousel (Node 4259:5527) */
.section-sale-products {
    padding: 5rem 0 3rem 0;
    background-color: #FFFFFF;
}

.sale-header-flex {
    display: flex;
    flex-direction: column;
    text-align: center;
    margin-bottom: 2.8rem;
    position: relative;
}

.sale-title-group {
    text-align: left;
}

.sale-main-title {
    color: var(--text-black, #1E262B);
    font-size: var(--fs-heading);
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin-top: 0.3rem;
}

.sale-action-group {
    position: absolute;
    right: 0;
    bottom: 8px;
}

.btn-sale-view-all {
    color: var(--text-black, #1E262B);
    text-align: center;
    /* content-button */

    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 32px;
    /* 160% */
    text-decoration: none;
    background: transparent;
    border: none;
    padding: 0;
    display: inline-block;
    transition: color 0.25s ease, opacity 0.25s ease;
}

.btn-sale-view-all:hover {
    color: var(--primary-color, #881111);
    opacity: 0.85;
}

.sale-slider-wrapper {
    display: flex;
    justify-content: center;
    position: relative;
    width: 100%;
    align-items: center;
}

.slider-arrow-btn {
    position: absolute;
    top: 45%;
    transform: translateY(-50%);
    z-index: 10;
    width: 48px;
    height: 44px;
    background: transparent;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: transform 0.25s ease, opacity 0.25s ease;
}

.slider-arrow-btn svg {
    width: 32px;
    height: 32px;
    display: block;
}

.slider-arrow-prev {
    left: -24px;
}

.slider-arrow-next {
    right: -24px;
}

/* Đã trượt hết slide: Swiper gắn class swiper-button-disabled + thuộc tính disabled */
.slider-arrow-btn.swiper-button-disabled,
.slider-arrow-btn:disabled {
    opacity: 0.3;
    cursor: default;
    pointer-events: none;
}

.slider-arrow-prev:hover {
    transform: translateY(-50%) translateX(-4px);
    opacity: 0.75;
}

.slider-arrow-next:hover {
    transform: translateY(-50%) translateX(4px);
    opacity: 0.75;
}

.sale-slider-track:not(.swiper-wrapper) {
    display: flex;
    gap: 40px;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding: 10px 0 30px;
}

.sale-slider-track:not(.swiper-wrapper)::-webkit-scrollbar {
    display: none;
}

/* 3 sản phẩm / view (legacy fallback) */
.sale-product-card:not(.swiper-slide) {
    flex: 0 0 calc((100% - 80px) / 3);
    width: calc((100% - 80px) / 3);
    max-width: calc((100% - 80px) / 3);
    box-sizing: border-box;
    background-color: #FFFFFF;
    border-radius: 0;
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.sale-product-card:hover {
    transform: translateY(-4px);
}

.sale-card-thumb-wrap {
    position: relative;
    width: 100%;
    height: auto;
    aspect-ratio: 7 / 8;
    overflow: hidden;
    background-color: #F5F3ED;
    border-radius: 8px;
}

.sale-card-thumb-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.sale-product-card:hover .sale-card-thumb-wrap img {
    transform: scale(1.08);
}

.sale-badge-pill,
.product-card-badge,
.product-badge {
    position: absolute;
    top: 16px;
    left: 16px;
    display: flex;
    padding: 6px 18px;
    justify-content: center;
    align-items: center;
    gap: 8px;
    border-radius: 40px;
    background: var(--primary-color, #881111);
    color: var(--text-white, #FFF);

    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    z-index: 5;
    white-space: nowrap;
}

.sale-badge-pill.badge-right {
    left: auto;
    right: 16px;
}

.sale-card-details {
    padding: 24px 0 28px;
    display: flex;
    flex-direction: column;
    align-items: start;
    text-align: start;
}

/* tên sản phẩm */
.sale-product-name {
    color: var(--text-black, #1E262B);
    text-align: center;
    font-size: var(--fs-body);
    font-style: normal;
    font-weight: 700;
    line-height: 30px;
    margin: 0 0 10px;
}

.sale-product-name a {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease;
}

.sale-product-name a:hover {
    color: var(--primary-color, #881111);
}

/* Hàng giá */
.sale-price-row {
    display: flex;
    justify-content: center;
    align-items: baseline;
    gap: 16px;
    margin: 0;
}

/* giá ưu đãi */
.sale-price-current {
    color: var(--primary-color, #881111);
    font-size: var(--fs-price);
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

/* giá gốc */
.sale-price-old {
    color: var(--text-gray, #60606B);
    font-size: var(--fs-price);
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-decoration-line: line-through;
}