/* =======================================================
SMART PRODUCT FORM CSS
======================================================= */

/* Layout thiet yeu giu gallery on dinh truoc khi CSS tao hinh mo phong tai xong. */
.single-product .product-gallery:has(> .bieu-mau-mo-phong-khe-anh) {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-content: start;
}

.single-product .product-gallery:has(> .bieu-mau-mo-phong-khe-anh) > .woocommerce-product-gallery,
.single-product .product-gallery:has(> .bieu-mau-mo-phong-khe-anh) > .product-gallery-slider,
.single-product .product-gallery:has(> .bieu-mau-mo-phong-khe-anh) > .bieu-mau-mo-phong-khe-anh {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
}

.single-product .product-gallery:has(> .bieu-mau-mo-phong-khe-anh) > .woocommerce-product-gallery,
.single-product .product-gallery:has(> .bieu-mau-mo-phong-khe-anh) > .product-gallery-slider {
    align-self: stretch;
    margin-bottom: 0;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition:
        opacity 0.24s ease,
        visibility 0s linear 0s;
}

.bieu-mau-mo-phong-khe-anh {
    --bieu-mau-mo-phong-chieu-cao: 520px;
    position: relative;
    width: 100%;
    align-self: stretch;
    min-height: var(--bieu-mau-mo-phong-chieu-cao);
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition:
        opacity 0.24s ease,
        visibility 0s linear 0.24s;
}

.single-product .product-gallery:has(> .bieu-mau-mo-phong-khe-anh) > .bieu-mau-san-pham-thong-so-khe {
    grid-column: 1;
    grid-row: 2;
}

@media (max-width: 980px) {
    .single-product .product-gallery:has(> .bieu-mau-mo-phong-khe-anh) {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }

    .single-product .product-gallery:has(> .bieu-mau-mo-phong-khe-anh) > .bieu-mau-di-dong-san-pham-header {
        grid-column: 1;
        grid-row: 1;
        order: initial;
    }

    .single-product .product-gallery:has(> .bieu-mau-mo-phong-khe-anh) > .bieu-mau-san-pham-thong-so-khe {
        grid-column: 1;
        grid-row: 2;
        order: initial;
    }

    .single-product .product-gallery:has(> .bieu-mau-mo-phong-khe-anh) > .woocommerce-product-gallery,
    .single-product .product-gallery:has(> .bieu-mau-mo-phong-khe-anh) > .product-gallery-slider,
    .single-product .product-gallery:has(> .bieu-mau-mo-phong-khe-anh) > .bieu-mau-mo-phong-khe-anh {
        grid-column: 1;
        grid-row: 3;
        order: initial;
        margin-bottom: 18px;
    }
}

@media (max-width: 549px) {
    .bieu-mau-mo-phong-khe-anh {
        --bieu-mau-mo-phong-chieu-cao: 430px;
    }
}

.bieu-mau-san-pham,
.khung-tao-don {
    --bieu-mau-white: #ffffff;
    --bieu-mau-black: #000000;
    --bieu-mau-charcoal: #121212;
    --bieu-mau-text: #171717;
    --bieu-mau-muted: #7d7d82;
    --bieu-mau-line: #e3e1e3;
    --bieu-mau-line-strong: #d6d3d6;
    --bieu-mau-surface: #edeced;
    --bieu-mau-surface-2: #fef0e8;
    --bieu-mau-orange: #fb5b20;
    --bieu-mau-orange-soft: rgba(251, 91, 32, 0.08);
    --bieu-mau-orange-line: rgba(251, 91, 32, 0.2);
    --bieu-mau-shadow: 0 12px 28px rgba(0, 0, 0, 0.04);
    --bieu-mau-shadow-soft: 0 8px 18px rgba(0, 0, 0, 0.03);
    --bieu-mau-chuyen-bat-tat-kich-thuoc: 48px;
    --bieu-mau-khoang-cach-cum: 30px;
    --bieu-mau-khoang-cach-hang: 10px;
    --bieu-mau-khoang-cach-o: 14px;
    --bieu-mau-goi-thiet-ke-khoang-tho-doc: 10px;
    --bieu-mau-goi-thiet-ke-khoang-cach-noi-dung: 4px;
    --bieu-mau-khoang-cach-ket-qua: 18px;
    --bieu-mau-ket-qua-padding-ngang: 22px;
    --bieu-mau-ket-qua-padding-duoi: 30px;
    --bieu-mau-vo-radius: 24px;
}

.bieu-mau-san-pham {
    margin-top: 16px;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
    -webkit-text-size-adjust: 100%;
}

/*
 * Lop bo cuc WooCommerce toi thieu can cho trang san pham dang dung bieu mau.
 * Cac quy tac nay thay cho flatsome-shop.css de khong tai ca bo CSS shop.
 */
.single-product .product-main {
    padding: 40px 0;
}

.single-product .product-gallery,
.single-product .product-thumbnails .col {
    padding-bottom: 0 !important;
}

.single-product .woocommerce-product-gallery .woocommerce-product-gallery__wrapper {
    margin: 0;
}

.single-product .product-gallery-slider img,
.single-product .product-thumbnails img {
    width: 100%;
}

.single-product .product-info {
    padding-top: 10px;
}

.single-product .product-footer .woocommerce-tabs {
    box-sizing: border-box;
    padding: 48px 0 64px;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.single-product .product-footer .woocommerce-tabs > .nav-line-grow,
.single-product .product-footer .woocommerce-tabs > .nav-line:not(.nav-vertical) {
    display: flex;
    flex-wrap: nowrap;
    gap: 30px;
    width: fit-content;
    max-width: 100%;
    margin: 0 0 28px;
    padding: 0;
    background: transparent;
    border: 0;
    border-bottom: 1px solid #dfe1e5;
    border-radius: 0;
    overflow-x: auto;
    scrollbar-width: none;
}

.single-product .product-footer .woocommerce-tabs > .product-tabs::-webkit-scrollbar {
    display: none;
}

.single-product .product-footer .woocommerce-tabs > .product-tabs > li {
    margin: 0;
}

.single-product .product-footer .woocommerce-tabs > .product-tabs > li > a {
    display: block;
    min-width: 0;
    padding: 0 0 12px;
    color: #77737b;
    font-size: 14px;
    font-weight: 550;
    line-height: 1.35;
    text-align: left;
    text-transform: none;
    white-space: nowrap;
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    box-shadow: none;
}

.single-product .product-footer .woocommerce-tabs > .product-tabs > li > a::before,
.single-product .product-footer .woocommerce-tabs > .product-tabs > li > a::after {
    display: none;
}

.single-product .product-footer .woocommerce-tabs > .product-tabs > li.active > a {
    color: #121212;
    font-weight: 650;
    background: transparent;
    border-bottom-color: #121212;
}

.single-product .product-footer .woocommerce-tabs > .product-tabs > li:not(.active) > a:hover {
    color: #121212;
}

.single-product .product-footer .woocommerce-tabs > .product-tabs > li > a:focus {
    outline: none;
}

.single-product .product-footer .woocommerce-tabs > .product-tabs > li > a:focus-visible {
    color: #121212;
    outline: 1px solid #a9abb1;
    outline-offset: 4px;
}

.single-product .product-footer .woocommerce-tabs > .tab-panels > .woocommerce-Tabs-panel {
    margin: 0;
    padding: 32px 34px;
    background: #ffffff;
    border: 0;
    border-radius: 16px;
    box-shadow: none;
    overflow-x: auto;
}

.single-product .product-footer .woocommerce-tabs > .tab-panels > .woocommerce-Tabs-panel > :first-child {
    margin-top: 0;
}

.single-product .product-footer .woocommerce-tabs > .tab-panels > .woocommerce-Tabs-panel > :last-child {
    margin-bottom: 0;
}

@media (max-width: 549px) {
    .single-product .product-footer > .container {
        width: 100%;
        max-width: none;
        padding-left: 0;
        padding-right: 0;
    }

    .single-product .product-footer .woocommerce-tabs {
        padding: 32px 0 48px;
    }

    .single-product .product-footer .woocommerce-tabs > .nav-line-grow,
    .single-product .product-footer .woocommerce-tabs > .nav-line:not(.nav-vertical) {
        gap: 24px;
        width: 100%;
        margin-bottom: 22px;
        padding: 0 18px;
    }

    .single-product .product-footer .woocommerce-tabs > .product-tabs > li {
        flex: 0 0 auto;
        width: auto;
    }

    .single-product .product-footer .woocommerce-tabs > .product-tabs > li > a {
        width: auto;
    }

    .single-product .product-footer .woocommerce-tabs > .tab-panels > .woocommerce-Tabs-panel {
        padding: 24px 18px;
        border-radius: 14px;
    }
}

.single-product .product-section {
    border-top: 1px solid #ececec;
}
.bieu-mau-san-pham,
.bieu-mau-vo,
.bieu-mau-bang,
.bieu-mau-truong-nhom,
.bieu-mau-truong,
.bieu-mau-kich-thuoc-luoi,
.bieu-mau-hop-gia,
.bieu-mau-thong-diep-bao-gia,
.bieu-mau-cum-dat-hang,
.bieu-mau-thong-tin-block.bieu-mau-san-pham-thong-so-the {
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.bieu-mau-vo {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--bieu-mau-khoang-cach-ket-qua);
    overflow: visible;
    background: var(--bieu-mau-white);
    border: 1px solid var(--bieu-mau-line);
    border-radius: var(--bieu-mau-vo-radius);
    box-shadow: var(--bieu-mau-shadow);
}

.bieu-mau-bang {
    position: relative;
    padding: 22px;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.bieu-mau-bang::before {
    content: none;
}

.bieu-mau-bang-cau-hinh {
    z-index: 2;
    display: grid;
    align-content: start;
    row-gap: var(--bieu-mau-khoang-cach-cum);
    padding-bottom: 0;
    background: transparent;
}

.bieu-mau-bang-cau-hinh > .bieu-mau-truong-nhom,
.bieu-mau-bang-cau-hinh > .bieu-mau-truong-hang,
.bieu-mau-bang-cau-hinh > .bieu-mau-cum-hinh-dang,
.bieu-mau-bang-cau-hinh > .luong-thiet-ke-block {
    margin-top: 0;
    margin-bottom: 0;
}

.bieu-mau-bang-ket-qua {
    z-index: 1;
    color: var(--bieu-mau-text);
    background: linear-gradient(180deg, #ffffff 0%, #faf9f7 100%);
    margin-top: 0;
    padding: 0 var(--bieu-mau-ket-qua-padding-ngang) var(--bieu-mau-ket-qua-padding-duoi);
    border-radius: 0 0 var(--bieu-mau-vo-radius) var(--bieu-mau-vo-radius);
}

.single-product .product-info [class*="breadcrumb"],
.single-product .product-main .summary.entry-summary [class*="breadcrumb"],
.single-product .product-main > .row.content-row > .entry-summary [class*="breadcrumb"] {
    font-weight: 700;
}

.single-product .product-info [class*="breadcrumb"] a,
.single-product .product-main .summary.entry-summary [class*="breadcrumb"] a,
.single-product .product-main > .row.content-row > .entry-summary [class*="breadcrumb"] a {
    font-weight: 700;
}

.bieu-mau-bang-ket-qua::before {
    content: "";
    display: block;
    height: 1px;
    margin: 0 0 var(--bieu-mau-khoang-cach-ket-qua);
    background: repeating-linear-gradient(
        to right,
        rgba(191, 184, 174, 0.9) 0 12px,
        transparent 12px 20px
    );
}

.bieu-mau-truong-nhom {
    position: relative;
    margin: 0 0 var(--bieu-mau-khoang-cach-cum);
}

.bieu-mau-truong-nhom.is-lua-chon-truc-quan-open {
    position: relative;
    z-index: 10025;
}

.bieu-mau-truong-nhom:last-child {
    margin-bottom: 0;
}

.bieu-mau-truong-hang {
    display: grid;
    gap: var(--bieu-mau-khoang-cach-o);
    margin: 0 0 var(--bieu-mau-khoang-cach-hang);
}

.bieu-mau-truong-hang:last-child {
    margin-bottom: 0;
}

.bieu-mau-truong-hang--1 {
    grid-template-columns: minmax(0, 1fr);
}

.bieu-mau-truong-hang--2 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.bieu-mau-truong-hang--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.bieu-mau-truong-hang-muc {
    min-width: 0;
}

.bieu-mau-truong-hang > .bieu-mau-truong-hang-muc > .bieu-mau-truong-nhom {
    margin-bottom: 0;
}

.bieu-mau-truong-hang:has(.bieu-mau-bang-dung-group) {
    margin-bottom: 0;
}

.luong-thiet-ke-block {
    --luong-thiet-ke-switch-width: min(80%, 520px);
    margin-bottom: 16px;
}

.luong-thiet-ke-stage {
    display: none;
    position: relative;
    width: var(--luong-thiet-ke-switch-width);
    margin: 16px auto 0;
    overflow: hidden;
    transition:
        height 0.42s cubic-bezier(0.16, 1, 0.3, 1),
        margin-top 0.34s cubic-bezier(0.16, 1, 0.3, 1);
    will-change: height;
}

.luong-thiet-ke-stage.is-active {
    display: block;
}

.luong-thiet-ke-stage-bang {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    transition:
        opacity 0.3s ease,
        transform 0.3s ease,
        visibility 0s linear 0s;
}

.luong-thiet-ke-stage-bang.is-collapsed {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(4px);
    transition:
        opacity 0.24s ease,
        transform 0.24s ease,
        visibility 0s linear 0.3s;
}

.bieu-mau-truong {
    display: block;
}

.bieu-mau-cum-hinh-dang {
    margin-bottom: 0;
    padding: 0;
}

.bieu-mau-cum-hinh-dang .bieu-mau-truong-dau {
    margin-bottom: 14px;
}

.bieu-mau-thong-tin-block.bieu-mau-san-pham-thong-so-the {
    max-width: none;
    margin: 10px 0 38px;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.bieu-mau-thong-tin-block.bieu-mau-san-pham-thong-so-the .bieu-mau-thong-tin-tieu-de {
    margin-bottom: 10px;
    font-size: var(--text-bac-1-size);
    font-weight: 500;
    line-height: var(--text-bac-1-line-height);
    letter-spacing: 0;
    color: #4a464d;
}

.bieu-mau-thong-tin-block.bieu-mau-san-pham-thong-so-the .bieu-mau-thong-tin-danh-sach-thong-so {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 230px));
    justify-content: center;
    gap: 18px 48px;
    width: 100%;
    max-width: 560px;
    margin: 0;
    padding: 0;
    list-style: none;
    border-top: 0;
}

.bieu-mau-di-dong-san-pham-header {
    display: none;
}

@media (min-width: 768px) {
    .single-product .product-gallery > .bieu-mau-san-pham-thong-so-khe,
    .single-product .product-gallery .bieu-mau-san-pham-thong-so-khe {
        display: block;
        width: 100%;
    }

    .single-product .product-gallery .bieu-mau-san-pham-thong-so-khe .bieu-mau-san-pham-thong-so-the {
        margin: 22px 0 0;
    }

    .single-product .product-gallery > .bieu-mau-di-dong-san-pham-header,
    .single-product .product-gallery .bieu-mau-di-dong-san-pham-header {
        display: none !important;
    }
}

@media (max-width: 980px) {
    .single-product .product-gallery,
    .single-product .product-gallery .is-sticky-column__inner {
        display: flex;
        flex-direction: column;
    }

    .single-product .product-gallery > .bieu-mau-di-dong-san-pham-header,
    .single-product .product-gallery .bieu-mau-di-dong-san-pham-header {
        display: block;
        order: 1;
        padding: 0 14px;
        margin: 0 0 18px;
    }

    .single-product .product-gallery .bieu-mau-di-dong-san-pham-header .product-title,
    .single-product .product-gallery .bieu-mau-di-dong-san-pham-header .product_title {
        margin: 0;
        color: #fb5b20;
    }

    .single-product .product-gallery .bieu-mau-di-dong-san-pham-header .is-divider.small {
        display: none;
    }

    .single-product .product-gallery > .bieu-mau-san-pham-thong-so-khe,
    .single-product .product-gallery .bieu-mau-san-pham-thong-so-khe {
        order: 2;
    }

    .single-product .product-gallery [class*="product-gallery"] {
        order: 3;
        margin-bottom: 18px;
    }

    .bieu-mau-thong-tin-block.bieu-mau-san-pham-thong-so-the {
        margin: 8px 0 30px;
        padding: 0;
        border-radius: 0;
    }

    .bieu-mau-thong-tin-block.bieu-mau-san-pham-thong-so-the .bieu-mau-thong-tin-tieu-de {
        margin-bottom: 10px;
    }

    .bieu-mau-thong-tin-block.bieu-mau-san-pham-thong-so-the .bieu-mau-thong-tin-danh-sach-thong-so {
        padding-left: 0;
    }

    .bieu-mau-cum-hinh-dang {
        margin-bottom: 0;
    }
}

.bieu-mau-kich-thuoc-nhom {
    margin-bottom: var(--bieu-mau-khoang-cach-hang);
}

.bieu-mau-truong-tieu-de,
.bieu-mau-truong-nhom:not(.bieu-mau-kich-thuoc-nhom) > .bieu-mau-truong > .bieu-mau-nhan,
.bieu-mau-kich-thuoc-nhom .bieu-mau-nhan {
    display: block;
    margin-bottom: 10px;
    font-size: var(--text-bac-2-size);
    font-weight: 400;
    line-height: var(--text-bac-2-line-height);
    letter-spacing: 0;
    color: #4b4750;
}

.bieu-mau-truong-dau {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.bieu-mau-truong-dau .bieu-mau-truong-tieu-de {
    margin-bottom: 0;
}

.bieu-mau-nhan-ghi-chu {
    display: inline;
    margin-left: 6px;
    font-size: var(--text-bac-4-size);
    font-weight: 400;
    line-height: inherit;
    color: #7a747d;
}

.luong-thiet-ke-ghi-chu {
    display: block;
    margin-bottom: 6px;
    font-size: var(--text-bac-5-size);
    font-weight: var(--text-bac-5-weight);
    font-style: normal;
    line-height: var(--text-bac-5-line-height);
    letter-spacing: 0;
    color: #9a9da3;
}

.bieu-mau-kich-thuoc-nhom .bieu-mau-truong-dau {
    margin: 0 0 10px;
}

.bieu-mau-luoi-hinh-dang {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--bieu-mau-khoang-cach-hang);
}

.bieu-mau-luoi-hinh-dang-count-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.bieu-mau-the-hinh-dang {
    -webkit-appearance: none;
    appearance: none;
    position: relative;
    display: grid;
    justify-items: center;
    gap: 7px;
    width: 100%;
    min-height: 92px;
    margin: 0;
    padding: 10px 8px 9px;
    line-height: 1;
    color: var(--bieu-mau-black);
    background: transparent;
    border: 1px solid transparent;
    border-radius: 14px;
    box-shadow: none;
    cursor: pointer;
    opacity: 1;
    transform: none;
    transform-origin: center;
    transition:
        border-color 0.22s ease,
        background 0.22s ease,
        box-shadow 0.22s ease;
}

.bieu-mau-the-hinh-dang::before {
    content: none;
}

.bieu-mau-the-hinh-dang:hover {
    background: rgba(0, 0, 0, 0.018);
    border-color: rgba(0, 0, 0, 0.08);
    box-shadow: none;
}

.bieu-mau-the-hinh-dang.is-active,
.bieu-mau-the-hinh-dang.is-active:hover {
    color: var(--bieu-mau-black);
    background: var(--bieu-mau-white);
    border-color: #7f7974;
    box-shadow: none;
}

.bieu-mau-the-hinh-dang.is-active::after {
    content: "\2713";
    position: absolute;
    top: 8px;
    right: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    color: #ffffff;
    background: var(--bieu-mau-orange);
    border-radius: 999px;
    box-shadow: none;
}

.bieu-mau-the-hinh-dang-khung-xem-truoc {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 34px;
}

.bieu-mau-the-hinh-dang-anh {
    display: block;
    width: auto;
    height: 28px;
    max-width: 100%;
    max-height: 100%;
    opacity: 0.62;
}

.bieu-mau-the-hinh-dang.is-active .bieu-mau-the-hinh-dang-anh {
    opacity: 0.9;
}

.bieu-mau-the-hinh-dang-bieu-tuong {
    display: block;
    border: 1.5px solid var(--bieu-mau-black);
    box-shadow: none;
}

.bieu-mau-the-hinh-dang.is-active .bieu-mau-the-hinh-dang-bieu-tuong {
    border-color: var(--bieu-mau-black);
}

.bieu-mau-the-hinh-dang-khung-xem-truoc[data-kieu-xem-truoc="tron"] .bieu-mau-the-hinh-dang-bieu-tuong {
    width: 24px;
    height: 24px;
    border-radius: 999px;
}

.bieu-mau-the-hinh-dang-khung-xem-truoc[data-kieu-xem-truoc="vuong"] .bieu-mau-the-hinh-dang-bieu-tuong {
    width: 22px;
    height: 22px;
    border-radius: 4px;
}

.bieu-mau-the-hinh-dang-khung-xem-truoc[data-kieu-xem-truoc="chu_nhat"] .bieu-mau-the-hinh-dang-bieu-tuong {
    width: 30px;
    height: 20px;
    border-radius: 4px;
}

.bieu-mau-the-hinh-dang-khung-xem-truoc[data-kieu-xem-truoc="theo_hinh"] .bieu-mau-the-hinh-dang-bieu-tuong {
    position: relative;
    width: 30px;
    height: 22px;
    border: 0;
}

.bieu-mau-the-hinh-dang-khung-xem-truoc[data-kieu-xem-truoc="theo_hinh"] .bieu-mau-the-hinh-dang-bieu-tuong::before,
.bieu-mau-the-hinh-dang-khung-xem-truoc[data-kieu-xem-truoc="theo_hinh"] .bieu-mau-the-hinh-dang-bieu-tuong::after {
    content: "";
    position: absolute;
}

.bieu-mau-the-hinh-dang-khung-xem-truoc[data-kieu-xem-truoc="theo_hinh"] .bieu-mau-the-hinh-dang-bieu-tuong::before {
    inset: 0;
    border: 1.5px solid var(--bieu-mau-black);
    border-radius: 6px 10px 6px 10px;
}

.bieu-mau-the-hinh-dang-khung-xem-truoc[data-kieu-xem-truoc="theo_hinh"] .bieu-mau-the-hinh-dang-bieu-tuong::after {
    right: -3px;
    bottom: -3px;
    width: 11px;
    height: 11px;
    background: var(--bieu-mau-white);
    border-right: 1.5px solid var(--bieu-mau-black);
    border-bottom: 1.5px solid var(--bieu-mau-black);
    border-radius: 0 0 7px 0;
}

.bieu-mau-the-hinh-dang.is-active .bieu-mau-the-hinh-dang-khung-xem-truoc[data-kieu-xem-truoc="theo_hinh"] .bieu-mau-the-hinh-dang-bieu-tuong::before {
    border-color: var(--bieu-mau-black);
}

.bieu-mau-the-hinh-dang.is-active .bieu-mau-the-hinh-dang-khung-xem-truoc[data-kieu-xem-truoc="theo_hinh"] .bieu-mau-the-hinh-dang-bieu-tuong::after {
    background: var(--bieu-mau-surface-2);
    border-right-color: var(--bieu-mau-black);
    border-bottom-color: var(--bieu-mau-black);
}

.bieu-mau-the-hinh-dang-nhan {
    max-width: 100%;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
    text-align: center;
    letter-spacing: 0;
    text-transform: none;
    white-space: nowrap;
    color: #746f6b;
}

.bieu-mau-the-hinh-dang-goi-y {
    margin-top: -4px;
    font-size: var(--text-bac-5-size);
    font-weight: var(--text-bac-5-weight);
    line-height: var(--text-bac-5-line-height);
    text-align: center;
    color: #6f6a72;
}

.bieu-mau-the-hinh-dang.is-active .bieu-mau-the-hinh-dang-nhan {
    font-weight: 600;
    color: var(--bieu-mau-black);
}
.bieu-mau-kich-thuoc-luoi {
    display: flex;
    gap: var(--bieu-mau-khoang-cach-o);
}

.bieu-mau-kich-thuoc-chuyen,
.bieu-mau-so-luong-chuyen {
    position: relative;
    width: 100%;
    min-height: var(--bieu-mau-chuyen-bat-tat-kich-thuoc);
    overflow: visible;
}

.bieu-mau-kich-thuoc-chuyen-chon,
.bieu-mau-kich-thuoc-chuyen-tuy-chinh,
.bieu-mau-so-luong-chuyen-chon,
.bieu-mau-so-luong-chuyen-tuy-chinh {
    transition: opacity 0.24s ease, transform 0.24s ease;
}

.bieu-mau-kich-thuoc-chuyen-chon,
.bieu-mau-so-luong-chuyen-chon {
    position: relative;
    z-index: 1;
}

.bieu-mau-kich-thuoc-chuyen-tuy-chinh,
.bieu-mau-so-luong-chuyen-tuy-chinh {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--bieu-mau-chuyen-bat-tat-kich-thuoc);
    align-items: center;
    gap: 12px;
    opacity: 0;
    pointer-events: none;
    transform: translateX(24px);
}

.bieu-mau-kich-thuoc-chuyen.is-custom-active .bieu-mau-kich-thuoc-chuyen-chon {
    opacity: 0;
    pointer-events: none;
    transform: translateX(-24px);
}

.bieu-mau-kich-thuoc-chuyen.is-custom-active .bieu-mau-kich-thuoc-chuyen-tuy-chinh {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(0);
}


.bieu-mau-kich-thuoc-chuyen-tuy-chinh-truong {
    min-width: 0;
}

.bieu-mau-bang-dung-primary {
    --bieu-mau-bang-dung-thumb-gap: 2px;
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    width: 100%;
    height: 48px;
    min-height: 48px;
    margin: 0;
    padding: var(--bieu-mau-bang-dung-thumb-gap);
    overflow: hidden;
    background: #f6f6f8;
    border: 1px solid var(--bieu-mau-line);
    border-radius: 999px;
    box-sizing: border-box;
}


.bieu-mau-bang-dung-primary-thumb {
    position: absolute;
    z-index: 0;
    top: var(--bieu-mau-bang-dung-thumb-gap);
    bottom: var(--bieu-mau-bang-dung-thumb-gap);
    left: var(--bieu-mau-bang-dung-thumb-gap);
    width: calc(50% - var(--bieu-mau-bang-dung-thumb-gap));
    background: var(--bieu-mau-black);
    border-radius: 999px;
    opacity: 0;
    transform: translateX(0);
    transition: opacity 0.2s ease, transform 0.24s cubic-bezier(0.22, 1, 0.36, 1);
    pointer-events: none;
}

.bieu-mau-bang-dung-primary[data-bang-dung-dang-chon="da_co_bang_dung"] .bieu-mau-bang-dung-primary-thumb {
    opacity: 1;
    transform: translateX(0);
}

.bieu-mau-bang-dung-primary[data-bang-dung-dang-chon="chua_co_bang_dung"] .bieu-mau-bang-dung-primary-thumb {
    opacity: 1;
    transform: translateX(100%);
}

.bieu-mau-bang-dung-lua-chon {
    -webkit-appearance: none;
    appearance: none;
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    margin: 0;
    padding: 0 12px;
    color: #171717;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-transform: none !important;
    background: transparent;
    border: 0;
    border-radius: 999px;
    box-shadow: none;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    user-select: none;
    transition: color 0.18s ease;
}

.bieu-mau-bang-dung-lua-chon:hover,
.bieu-mau-bang-dung-lua-chon:focus,
.bieu-mau-bang-dung-lua-chon:focus-visible {
    outline: none;
    color: #302c28;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.bieu-mau-bang-dung-lua-chon.is-active {
    color: #ffffff;
}

.bieu-mau-bang-dung-primary[data-bang-dung-dang-chon="da_co_bang_dung"] .bieu-mau-bang-dung-lua-chon:not(.is-active),
.bieu-mau-bang-dung-primary[data-bang-dung-dang-chon="chua_co_bang_dung"] .bieu-mau-bang-dung-lua-chon:not(.is-active),
.bieu-mau-bang-dung-primary[data-bang-dung-dang-chon="da_co_bang_dung"] .bieu-mau-bang-dung-lua-chon:not(.is-active) .bieu-mau-bang-dung-lua-chon-chu,
.bieu-mau-bang-dung-primary[data-bang-dung-dang-chon="chua_co_bang_dung"] .bieu-mau-bang-dung-lua-chon:not(.is-active) .bieu-mau-bang-dung-lua-chon-chu {
    color: #9a9da3;
}

.bieu-mau-bang-dung-lua-chon.is-active .bieu-mau-bang-dung-lua-chon-chu::before {
    content: "\2713";
    display: inline-block;
    margin-right: 6px;
    font-weight: 800;
}

.bieu-mau-bang-dung-lua-chon-chu {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-transform: none !important;
}

.bieu-mau-bang-dung-goi {
    display: grid;
    grid-template-columns: 100px minmax(0, 1fr) 22px;
    gap: 22px;
    align-items: center;
    width: 100%;
    min-height: 126px;
    margin-top: 16px;
    padding: 12px;
    box-sizing: border-box;
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 18px;
    cursor: pointer;
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.bieu-mau-bang-dung-goi[hidden] {
    display: none;
}

.bieu-mau-bang-dung-goi.is-active {
    border-color: #000000;
}

.bieu-mau-bang-dung-goi:focus-visible {
    outline: 2px solid rgba(0, 0, 0, 0.22);
    outline-offset: 3px;
}

.bieu-mau-bang-dung-goi-anh {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100px;
    min-width: 100px;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: #f4f5f7;
    border-radius: 14px;
}

.bieu-mau-bang-dung-goi-anh img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.bieu-mau-bang-dung-goi-noi-dung {
    display: grid;
    gap: 8px;
    min-width: 0;
}

.bieu-mau-bang-dung-goi-tieu-de {
    display: block;
    max-width: 100%;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.22;
    color: #000000;
}

.bieu-mau-bang-dung-goi-mo-ta {
    max-width: 100%;
    margin: 0;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.32;
    color: #000000;
}

.bieu-mau-bang-dung-goi-dau-chon {
    position: relative;
    justify-self: end;
    display: block;
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    border: 2px solid rgba(0, 0, 0, 0.36);
    border-radius: 999px;
}

.bieu-mau-bang-dung-goi.is-active .bieu-mau-bang-dung-goi-dau-chon {
    background: #000000;
    border-color: #000000;
}

.bieu-mau-bang-dung-goi.is-active .bieu-mau-bang-dung-goi-dau-chon::before {
    content: "";
    position: absolute;
    top: 3px;
    left: 5px;
    width: 4px;
    height: 8px;
    border: solid #ffffff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

@media (max-width: 560px) {
    .bieu-mau-bang-dung-goi {
        grid-template-columns: 100px minmax(0, 1fr) 20px;
        gap: 14px;
        min-height: 122px;
        padding: 10px;
    }

    .bieu-mau-bang-dung-goi-anh {
        width: 100px;
        border-radius: 12px;
    }

    .bieu-mau-bang-dung-goi-tieu-de {
        font-size: 15px;
    }

    .bieu-mau-bang-dung-goi-mo-ta {
        font-size: 12px;
        line-height: 1.28;
    }
}

.bieu-mau-truong {
    position: relative;
    z-index: 0;
}

.bieu-mau-so-luong-chuyen.is-custom-active .bieu-mau-so-luong-chuyen-chon {
    opacity: 0;
    pointer-events: none;
    transform: translateX(-24px);
}

.bieu-mau-so-luong-chuyen.is-custom-active .bieu-mau-so-luong-chuyen-tuy-chinh {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(0);
}

.bieu-mau-so-luong-chuyen-nhap-boc,
.bieu-mau-so-luong-chuyen-bat-tat,
.bieu-mau-kich-thuoc-chuyen-tuy-chinh-truong,
.bieu-mau-kich-thuoc-chuyen-bat-tat {
    min-width: 0;
}

.bieu-mau-so-luong-chuyen-bat-tat,
.bieu-mau-kich-thuoc-chuyen-bat-tat {
    -webkit-appearance: none;
    appearance: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 0;
    height: var(--bieu-mau-chuyen-bat-tat-kich-thuoc);
    margin: 0;
    padding: 0;
    line-height: 1;
    color: #5b554f;
    background: var(--bieu-mau-white);
    border: 1px solid rgba(18, 18, 18, 0.12);
    border-radius: 999px;
    box-sizing: border-box;
    cursor: pointer;
    box-shadow: inset 0 -1px 0 rgba(18, 18, 18, 0.02);
    transition:
        border-color 0.32s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.32s cubic-bezier(0.22, 1, 0.36, 1),
        color 0.32s cubic-bezier(0.22, 1, 0.36, 1),
        background-color 0.32s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.32s cubic-bezier(0.22, 1, 0.36, 1);
}

.bieu-mau-so-luong-chuyen-bat-tat:focus,
.bieu-mau-so-luong-chuyen-bat-tat:focus-visible,
.bieu-mau-kich-thuoc-chuyen-bat-tat:focus,
.bieu-mau-kich-thuoc-chuyen-bat-tat:focus-visible {
    outline: none;
    border-color: rgba(24, 21, 18, 0.76);
    box-shadow:
        inset 0 0 0 1px rgba(24, 21, 18, 0.12),
        0 0 0 1px rgba(24, 21, 18, 0.08);
}

.bieu-mau-so-luong-chuyen-bat-tat:hover,
.bieu-mau-kich-thuoc-chuyen-bat-tat:hover {
    color: #302c28;
    background: #f7f6f6;
    border-color: rgba(18, 18, 18, 0.18);
    box-shadow:
        inset 0 -1px 0 rgba(18, 18, 18, 0.03),
        0 4px 10px rgba(18, 18, 18, 0.04);
}

.bieu-mau-so-luong-chuyen-bat-tat-nhan,
.bieu-mau-kich-thuoc-chuyen-bat-tat-nhan {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.bieu-mau-so-luong-chuyen-bat-tat-bieu-tuong,
.bieu-mau-kich-thuoc-chuyen-bat-tat-bieu-tuong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
}

.bieu-mau-so-luong-chuyen-bat-tat-bieu-tuong svg,
.bieu-mau-kich-thuoc-chuyen-bat-tat-bieu-tuong svg {
    width: 100%;
    height: 100%;
    stroke: currentColor;
    stroke-width: 2.2;
    fill: none;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.bieu-mau-so-luong-chuyen-nhap {
    width: 100%;
}


.bieu-mau-kich-thuoc-luoi > .bieu-mau-truong {
    flex: 1 1 0;
    min-width: 0;
}

.bieu-mau-nhap,
.bieu-mau-chon,
#bieu-mau-width,
#bieu-mau-height,
#bieu-mau-depth,
#bieu-mau-so-luong-tuy-chinh {
    width: 100%;
    height: 48px;
    box-sizing: border-box;
    margin: 0;
    padding: 0 16px;
    font-size: var(--text-bac-3-size);
    font-weight: 550;
    line-height: var(--text-bac-3-line-height);
    letter-spacing: 0;
    color: #191613;
    background: var(--bieu-mau-white);
    border: 1px solid rgba(18, 18, 18, 0.12);
    border-radius: 999px;
    box-shadow: none;
    transition:
        border-color 0.32s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.32s cubic-bezier(0.22, 1, 0.36, 1),
        background-color 0.32s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.32s cubic-bezier(0.22, 1, 0.36, 1);
    touch-action: manipulation;
}

.bieu-mau-nhap:hover,
.bieu-mau-chon:hover,
#bieu-mau-width:hover,
#bieu-mau-height:hover,
#bieu-mau-depth:hover,
#bieu-mau-so-luong-tuy-chinh:hover {
    border-color: rgba(18, 18, 18, 0.18);
}

.bieu-mau-nhap,
#bieu-mau-width,
#bieu-mau-height,
#bieu-mau-depth,
#bieu-mau-so-luong-tuy-chinh {
    appearance: textfield;
    -moz-appearance: textfield;
}

.bieu-mau-nhap::-webkit-outer-spin-button,
.bieu-mau-nhap::-webkit-inner-spin-button,
#bieu-mau-width::-webkit-outer-spin-button,
#bieu-mau-width::-webkit-inner-spin-button,
#bieu-mau-height::-webkit-outer-spin-button,
#bieu-mau-height::-webkit-inner-spin-button,
#bieu-mau-depth::-webkit-outer-spin-button,
#bieu-mau-depth::-webkit-inner-spin-button,
#bieu-mau-so-luong-tuy-chinh::-webkit-outer-spin-button,
#bieu-mau-so-luong-tuy-chinh::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.bieu-mau-chon {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding-right: 42px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%23675d53'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 18px;
}

.bieu-mau-nhap:focus,
.bieu-mau-chon:focus,
#bieu-mau-width:focus,
#bieu-mau-height:focus,
#bieu-mau-depth:focus,
#bieu-mau-so-luong-tuy-chinh:focus {
    outline: none;
    transform: none;
    border-color: rgba(24, 21, 18, 0.76);
    box-shadow:
        inset 0 0 0 1px rgba(24, 21, 18, 0.12),
        0 0 0 1px rgba(24, 21, 18, 0.08);
    background: var(--bieu-mau-white);
}

.bieu-mau-nhap::placeholder,
#bieu-mau-width::placeholder,
#bieu-mau-height::placeholder,
#bieu-mau-depth::placeholder,
#bieu-mau-so-luong-tuy-chinh::placeholder {
    font-size: var(--text-bac-4-size);
    font-weight: var(--text-bac-4-weight);
    line-height: var(--text-bac-4-line-height);
    color: #9aa0a6;
    opacity: 1;
}

.bieu-mau-chon.is-placeholder-selected,
.bieu-mau-chon:has(option[data-placeholder="true"]:checked) {
    font-size: var(--text-bac-4-size);
    font-weight: 400;
    line-height: var(--text-bac-4-line-height);
    color: #9aa0a6;
}

.bieu-mau-chon option {
    font-size: var(--text-bac-3-size);
    font-weight: 550;
    line-height: var(--text-bac-3-line-height);
    color: #191613;
}

.bieu-mau-chon option[data-placeholder="true"] {
    font-size: var(--text-bac-4-size);
    font-weight: 400;
    line-height: var(--text-bac-4-line-height);
    color: #9aa0a6;
}

.bieu-mau-chon--an-khi-truc-quan {
    position: absolute;
    width: 1px !important;
    height: 1px !important;
    min-width: 0;
    min-height: 0;
    padding: 0 !important;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

.lua-chon-truc-quan {
    position: relative;
    z-index: 1;
    width: 100%;
}

.lua-chon-truc-quan.is-open {
    position: relative;
    z-index: 10030;
}

.single-product .product-main .product-info:has(.lua-chon-truc-quan.is-open),
.single-product .product-main .summary.entry-summary:has(.lua-chon-truc-quan.is-open),
.single-product .product-main > .row.content-row > .entry-summary:has(.lua-chon-truc-quan.is-open),
.bieu-mau-san-pham:has(.lua-chon-truc-quan.is-open),
.bieu-mau-vo:has(.lua-chon-truc-quan.is-open),
.bieu-mau-bang:has(.lua-chon-truc-quan.is-open) {
    position: relative;
    overflow: visible;
}

.lua-chon-truc-quan__trigger,
.lua-chon-truc-quan__item {
    appearance: none;
    -webkit-appearance: none;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    margin: 0;
    font: inherit;
    letter-spacing: 0;
    text-transform: none;
    color: #191613;
    background: #fff;
    border: 1px solid rgba(18, 18, 18, 0.12);
    box-shadow: none;
    cursor: pointer;
    touch-action: manipulation;
}

.lua-chon-truc-quan__trigger {
    justify-content: space-between;
    height: 48px;
    padding: 0 16px;
    border-radius: 999px;
    font-size: var(--text-bac-3-size);
    font-weight: 550;
    line-height: var(--text-bac-3-line-height);
    transition:
        border-color 0.28s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.28s cubic-bezier(0.22, 1, 0.36, 1),
        background-color 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}

.lua-chon-truc-quan__trigger:hover,
.lua-chon-truc-quan.is-open .lua-chon-truc-quan__trigger {
    border-color: rgba(18, 18, 18, 0.2);
    background: #fff;
}

.lua-chon-truc-quan__trigger:focus-visible {
    outline: none;
    border-color: rgba(24, 21, 18, 0.76);
    box-shadow:
        inset 0 0 0 1px rgba(24, 21, 18, 0.12),
        0 0 0 1px rgba(24, 21, 18, 0.08);
}

.lua-chon-truc-quan__trigger-text {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: none;
    white-space: nowrap;
    text-transform: none !important;
}

.lua-chon-truc-quan.is-empty .lua-chon-truc-quan__trigger {
    font-size: var(--text-bac-4-size);
    font-weight: var(--text-bac-4-weight);
    line-height: var(--text-bac-4-line-height);
}

.lua-chon-truc-quan.is-empty .lua-chon-truc-quan__trigger-text {
    color: #9aa0a6;
}

.lua-chon-truc-quan__chevron {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin-left: 12px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='%23675d53'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 18px;
    transition: transform 0.24s cubic-bezier(0.22, 1, 0.36, 1);
}

.lua-chon-truc-quan.is-open .lua-chon-truc-quan__chevron {
    transform: rotate(180deg);
}

body:has(.bieu-mau-truong-nhom.is-lua-chon-truc-quan-open)::before {
    content: "";
    position: fixed;
    z-index: 9990;
    inset: 0;
    opacity: 0;
    pointer-events: none;
    background: rgba(255, 255, 255, 0);
    transform: scale(1);
    transform-origin: center;
    transition: opacity 0.16s cubic-bezier(0.16, 1, 0.3, 1);
}

body:has(.lua-chon-truc-quan.is-open)::before {
    opacity: 0;
}

.lua-chon-truc-quan__popover {
    position: absolute;
    z-index: 1;
    left: 50%;
    width: min(95%, calc(100vw - 32px));
    max-width: 100%;
    max-height: min(68vh, 480px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: 8px;
    border: 1px solid rgba(18, 18, 18, 0.08);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow:
        0 28px 70px rgba(15, 15, 15, 0.16),
        0 10px 24px rgba(15, 15, 15, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.72);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate3d(-50%, -8px, 0) scale(0.9);
    transform-origin: top center;
    transition:
        opacity 0.16s cubic-bezier(0.16, 1, 0.3, 1),
        visibility 0.16s linear,
        transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    -webkit-backdrop-filter: saturate(132%) blur(18px);
    backdrop-filter: saturate(132%) blur(18px);
    contain: layout paint;
    backface-visibility: hidden;
    will-change: opacity, transform;
}

.lua-chon-truc-quan.is-open .lua-chon-truc-quan__popover {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate3d(-50%, 0, 0) scale(1);
}

.lua-chon-truc-quan.is-placement-bottom .lua-chon-truc-quan__popover,
.lua-chon-truc-quan:not(.is-placement-top) .lua-chon-truc-quan__popover {
    top: calc(100% + 10px);
    bottom: auto;
    transform-origin: top center;
}

.lua-chon-truc-quan.is-placement-top .lua-chon-truc-quan__popover {
    top: auto;
    bottom: calc(100% + 10px);
    transform: translate3d(-50%, 8px, 0) scale(0.9);
    transform-origin: bottom center;
}

.lua-chon-truc-quan.is-open.is-placement-top .lua-chon-truc-quan__popover {
    transform: translate3d(-50%, 0, 0) scale(1);
}

.lua-chon-truc-quan__popover.is-portal {
    position: fixed;
    z-index: 10040;
    max-width: none;
}

.lua-chon-truc-quan__popover.is-portal.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate3d(-50%, 0, 0) scale(1);
}

.lua-chon-truc-quan__popover.is-portal.is-placement-top {
    bottom: auto;
    transform: translate3d(-50%, 8px, 0) scale(0.9);
    transform-origin: bottom center;
}

.lua-chon-truc-quan__popover.is-portal.is-open.is-placement-top {
    transform: translate3d(-50%, 0, 0) scale(1);
}

.lua-chon-truc-quan__item {
    position: relative;
    gap: 0;
    height: auto;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    text-align: left;
    transition:
        border-color 0.24s cubic-bezier(0.22, 1, 0.36, 1),
        background-color 0.24s cubic-bezier(0.22, 1, 0.36, 1);
}

.lua-chon-truc-quan__item--truc-quan {
    gap: 12px;
    min-height: 84px;
    padding: 8px 10px;
    border: 1px solid transparent;
    border-radius: 14px;
}

.lua-chon-truc-quan__item--truc-quan + .lua-chon-truc-quan__item--truc-quan {
    margin-top: 7px;
}

.lua-chon-truc-quan__item--truc-quan:hover,
.lua-chon-truc-quan__item--truc-quan:focus-visible {
    outline: none;
    border-color: rgba(18, 18, 18, 0.1);
    background: #fbfbfd;
}

.lua-chon-truc-quan__item--truc-quan.is-active {
    border-color: #111111;
    background: #ffffff;
}

.lua-chon-truc-quan__preview {
    --lua-chon-truc-quan-preview-rong: 96px;
    --lua-chon-truc-quan-preview-cao: 60px;
    --lua-chon-truc-quan-preview-bo-goc-ngang: 8.1%;
    --lua-chon-truc-quan-preview-bo-goc-doc: 12.2%;
    flex: 0 0 var(--lua-chon-truc-quan-preview-rong);
    width: var(--lua-chon-truc-quan-preview-rong);
    height: var(--lua-chon-truc-quan-preview-cao);
    overflow: hidden;
    border-radius:
        var(--lua-chon-truc-quan-preview-bo-goc-ngang)
        / var(--lua-chon-truc-quan-preview-bo-goc-doc);
    background: transparent;
}

.lua-chon-truc-quan__media {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    object-fit: cover;
    image-rendering: auto;
    background: transparent;
}

.lua-chon-truc-quan__media--placeholder {
    background: #050505;
}

.lua-chon-truc-quan__body {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
}

.lua-chon-truc-quan__title {
    display: block;
    min-width: 0;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.25;
    text-transform: none;
    color: #151515;
}

.lua-chon-truc-quan__description {
    display: block;
    min-width: 0;
    font-size: 13px;
    font-weight: 450;
    line-height: 1.35;
    text-transform: none;
    color: #6e6e73;
}

.lua-chon-truc-quan__radio {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    border: 1.5px solid rgba(18, 18, 18, 0.78);
    border-radius: 999px;
    background: #fff;
}

.lua-chon-truc-quan__item.is-active .lua-chon-truc-quan__radio {
    border-width: 4px;
    border-color: var(--bieu-mau-orange);
}

.lua-chon-truc-quan__title-row {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 10px;
}

.lua-chon-truc-quan__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 0;
    min-height: 24px;
    padding: 3px 14px 4px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    color: #ffffff;
    background: var(--bieu-mau-orange);
    white-space: nowrap;
}

.lua-chon-truc-quan__popover--truc-quan {
    padding: 8px;
    border-radius: 20px;
}

.lua-chon-truc-quan__popover--don-gian {
    display: block;
    width: min(100%, calc(100vw - 32px));
    max-height: min(56vh, 320px);
    padding: 8px 10px;
    overflow: hidden auto;
    border-radius: 11px;
}

.lua-chon-truc-quan__item--don-gian {
    display: flex;
    align-items: center;
    width: 100%;
    height: auto;
    min-height: 36px;
    margin: 0;
    padding: 10px 12px;
    border: 0;
    border-radius: 7px;
    line-height: 1.25;
    background: #ffffff;
    box-shadow: none;
}

.lua-chon-truc-quan__item--don-gian + .lua-chon-truc-quan__item--don-gian {
    margin-top: 0;
}

.lua-chon-truc-quan__item--don-gian:not(:last-child)::before {
    content: "";
    position: absolute;
    right: 8px;
    bottom: 0;
    left: 8px;
    height: 1px;
    background: #ececef;
    pointer-events: none;
}

.lua-chon-truc-quan__item--don-gian.is-active {
    background: #ffffff;
}

.lua-chon-truc-quan__item--don-gian:hover,
.lua-chon-truc-quan__item--don-gian:focus-visible,
.lua-chon-truc-quan__item--don-gian.is-active:hover,
.lua-chon-truc-quan__item--don-gian.is-active:focus-visible {
    background: #f5f6f7;
}

.lua-chon-truc-quan__item--don-gian .lua-chon-truc-quan__body {
    justify-content: center;
    gap: 0;
}

.lua-chon-truc-quan__item--don-gian .lua-chon-truc-quan__title-row {
    gap: 8px;
}

.lua-chon-truc-quan__item--don-gian .lua-chon-truc-quan__title {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    color: #111111;
}
.bieu-mau-so-luong-chuyen .bieu-mau-nhap {
    width: 100%;
    text-align: left;
}

.luong-thiet-ke-block {
    position: relative;
    z-index: 1;
    margin-top: 0;
    scroll-margin-top: 120px;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

@keyframes bieuMauMissingFieldPulse {
    0% {
        border-color: rgba(18, 18, 18, 0.12);
        box-shadow: none;
    }

    52% {
        border-color: rgba(24, 21, 18, 0.64);
        box-shadow:
            inset 0 0 0 1px rgba(24, 21, 18, 0.1),
            0 0 0 6px rgba(31, 27, 23, 0.06);
    }

    100% {
        border-color: rgba(18, 18, 18, 0.12);
        box-shadow: none;
    }
}

.bieu-mau-chon.la-thieu-bat-buoc.la-thieu-bat-buoc-nhay,
.bieu-mau-nhap.la-thieu-bat-buoc.la-thieu-bat-buoc-nhay,
.lua-chon-truc-quan__trigger.la-thieu-bat-buoc.la-thieu-bat-buoc-nhay,
.khung-tao-don-nhap-lien-he.la-thieu-bat-buoc.la-thieu-bat-buoc-nhay,
.bieu-mau-so-luong-chuyen-bat-tat.la-thieu-bat-buoc.la-thieu-bat-buoc-nhay,
.luong-thiet-ke-primary.la-thieu-bat-buoc.la-thieu-bat-buoc-nhay {
    animation: bieuMauMissingFieldPulse 860ms cubic-bezier(0.22, 0.61, 0.36, 1);
}

@media (prefers-reduced-motion: reduce) {
    .lua-chon-truc-quan__popover,
    .lua-chon-truc-quan__chevron {
        transition: none;
    }

    .bieu-mau-chon.la-thieu-bat-buoc.la-thieu-bat-buoc-nhay,
    .bieu-mau-nhap.la-thieu-bat-buoc.la-thieu-bat-buoc-nhay,
        .lua-chon-truc-quan__trigger.la-thieu-bat-buoc.la-thieu-bat-buoc-nhay,
    .khung-tao-don-nhap-lien-he.la-thieu-bat-buoc.la-thieu-bat-buoc-nhay,
    .bieu-mau-so-luong-chuyen-bat-tat.la-thieu-bat-buoc.la-thieu-bat-buoc-nhay,
    .luong-thiet-ke-primary.la-thieu-bat-buoc.la-thieu-bat-buoc-nhay {
        animation: none;
    }
}

.luong-thiet-ke-dau {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.luong-thiet-ke-dau .bieu-mau-truong-tieu-de {
    margin: 0;
}

.luong-thiet-ke-ghi-chu {
    margin: 0;
    text-align: right;
    white-space: nowrap;
    text-transform: none !important;
}

.khung-goi-y {
    margin-top: 12px;
    padding: 24px 24px 22px;
    background: #ffffff;
    border: 1px solid #e6e1dc;
    border-radius: 20px;
    box-shadow: none;
}

.khung-goi-y-thong-diep {
    display: grid;
    gap: 12px;
    max-width: none;
    margin: 0 0 18px;
    text-align: left;
}

.khung-goi-y-thong-diep-tieu-de,
.khung-goi-y-thong-diep-doan {
    margin: 0;
    color: #111111;
    white-space: normal;
    font-style: normal;
}

.khung-goi-y-thong-diep-tieu-de {
    font-size: var(--text-bac-1-size);
    font-weight: var(--text-bac-1-weight);
    line-height: var(--text-bac-1-line-height);
    letter-spacing: 0;
}

.khung-goi-y-thong-diep-doan {
    font-size: var(--text-bac-5-size);
    font-weight: var(--text-bac-5-weight);
    line-height: var(--text-bac-5-line-height);
    color: #4a4a4a;
}

.khung-goi-y-san-pham {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: 20px;
    align-items: center;
    padding-top: 18px;
    border-top: 2px solid #111111;
}

.khung-goi-y-hinh-anh {
    display: block;
    width: 92px;
    height: 92px;
    overflow: hidden;
    background: #f5f5f5;
    border-radius: 12px;
    justify-self: start;
}

.khung-goi-y-anh {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.khung-goi-y-noi-dung {
    display: grid;
    width: 100%;
    justify-self: stretch;
    justify-items: end;
    gap: 8px;
    min-width: 0;
    text-align: right;
    align-content: center;
}

.khung-goi-y-tieu-de-phu {
    display: inline-block;
    width: auto;
    max-width: 100%;
    align-self: end;
    text-align: right;
    font-size: var(--text-bac-5-size);
    font-weight: 700;
    line-height: var(--text-bac-5-line-height);
    letter-spacing: 0;
    text-transform: uppercase;
    color: #666059;
}

.khung-goi-y-tieu-de {
    display: inline-block;
    width: 100%;
    max-width: none;
    text-align: right;
    font-size: var(--text-bac-3-size);
    font-weight: 700;
    line-height: var(--text-bac-3-line-height);
    color: #171717;
    text-decoration: none;
}

.khung-goi-y-tieu-de:hover {
    color: #171717;
    text-decoration: none;
}

.khung-goi-y-nut {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    justify-self: end;
    min-height: 38px;
    padding: 0 16px;
    font-size: var(--text-bac-5-size);
    font-weight: 650;
    color: #ffffff;
    background: #050505;
    border-radius: 999px;
    text-decoration: none;
}

.khung-goi-y-nut:hover {
    color: #ffffff;
    text-decoration: none;
}

.luong-thiet-ke-primary {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    width: var(--luong-thiet-ke-switch-width);
    height: 44px;
    min-height: 44px;
    margin: 0 auto;
    padding: 2px;
    overflow: hidden;
    background: var(--background-xam-nhat);
    border: 1px solid var(--bieu-mau-line);
    border-radius: 999px;
    box-shadow: none;
    touch-action: pan-y;
    user-select: none;
}

.luong-thiet-ke-primary-thumb {
    position: absolute;
    top: 2px;
    bottom: 2px;
    left: 2px;
    width: calc(50% - 2px);
    background: var(--bieu-mau-orange);
    border-radius: 999px;
    opacity: 0;
    transform: translateX(0);
    transition: transform 0.22s ease, opacity 0.22s ease;
    pointer-events: none;
}

.luong-thiet-ke-primary[data-lua-chon-dang-chon="da_co_file"] .luong-thiet-ke-primary-thumb {
    opacity: 1;
    transform: translateX(0);
}

.luong-thiet-ke-primary[data-lua-chon-dang-chon="can_thiet_ke"] .luong-thiet-ke-primary-thumb {
    opacity: 1;
    transform: translateX(100%);
}

.luong-thiet-ke-lua-chon {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    height: 40px;
    min-height: 40px;
    margin: 0;
    padding: 0 16px;
    font-size: var(--text-bac-3-size);
    font-weight: 550;
    line-height: var(--text-bac-3-line-height);
    text-align: center;
    color: #171717;
    background: transparent;
    border: 0;
    border-radius: 0;
    text-transform: none;
    cursor: pointer;
    opacity: 1;
    transition: color 0.22s ease;
}

.luong-thiet-ke-lua-chon::before {
    content: none;
}

.luong-thiet-ke-lua-chon:first-child {
    border-top-left-radius: 999px;
    border-bottom-left-radius: 999px;
}

.luong-thiet-ke-lua-chon:last-child {
    border-top-right-radius: 999px;
    border-bottom-right-radius: 999px;
}

.luong-thiet-ke-lua-chon:hover {
    background: transparent;
}

.luong-thiet-ke-lua-chon:disabled,
.luong-thiet-ke-lua-chon.is-disabled {
    cursor: not-allowed;
    opacity: 1;
    color: #b9b2ab;
}

.luong-thiet-ke-lua-chon:disabled .luong-thiet-ke-lua-chon-chu,
.luong-thiet-ke-lua-chon.is-disabled .luong-thiet-ke-lua-chon-chu {
    color: #b9b2ab;
}

.luong-thiet-ke-lua-chon-chu {
    max-width: 100%;
    line-height: 1.25;
    white-space: nowrap;
    text-transform: none;
}

.luong-thiet-ke-lua-chon.is-active {
    color: #ffffff;
    font-weight: 600;
    background: transparent;
}

.luong-thiet-ke-lua-chon.is-active::before {
    content: "✓";
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
}

.luong-thiet-ke-lua-chon.is-active .luong-thiet-ke-lua-chon-chu {
    color: #ffffff;
}

.luong-thiet-ke-primary[data-lua-chon-dang-chon="da_co_file"] .luong-thiet-ke-lua-chon:not(.is-active),
.luong-thiet-ke-primary[data-lua-chon-dang-chon="can_thiet_ke"] .luong-thiet-ke-lua-chon:not(.is-active) {
    color: #9a9da3;
}

.luong-thiet-ke-primary[data-lua-chon-dang-chon="da_co_file"] .luong-thiet-ke-lua-chon:not(.is-active) .luong-thiet-ke-lua-chon-chu,
.luong-thiet-ke-primary[data-lua-chon-dang-chon="can_thiet_ke"] .luong-thiet-ke-lua-chon:not(.is-active) .luong-thiet-ke-lua-chon-chu {
    color: #9a9da3;
}

.luong-thiet-ke-secondary {
    display: grid;
    gap: 10px;
    margin-top: 0;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    overflow: visible;
}

.luong-thiet-ke-secondary-luoi {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    padding: 0;
    margin: 0;
    background: transparent;
    border: 0;
}

.goi-thiet-ke-chon-phu {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) minmax(132px, max-content);
    column-gap: 12px;
    row-gap: 0;
    width: 100%;
    padding: var(--bieu-mau-goi-thiet-ke-khoang-tho-doc) 0;
    margin: 0 !important;
    text-align: left;
    color: #232127;
    background: transparent;
    border: 0;
    border-bottom: 1px solid #d9d2c9;
    border-radius: 0 !important;
    box-shadow: none;
    box-sizing: border-box;
    cursor: pointer;
    transition: color 0.2s ease, opacity 0.2s ease;
}

.goi-thiet-ke-chon-phu:last-child {
    border-bottom: 0;
}

.goi-thiet-ke-chon-phu::before {
    content: "";
    grid-column: 1;
    grid-row: 1 / span 2;
    align-self: start;
    justify-self: start;
    width: 26px;
    height: 26px;
    border: 1.5px solid #8e857c;
    border-radius: 999px;
    background: #ffffff;
    box-sizing: border-box;
}

.goi-thiet-ke-chon-phu:hover {
    color: #171717;
    box-shadow: none;
    transform: none;
    opacity: 0.9;
}

.luong-thiet-ke-secondary[data-goi-thiet-ke-dang-chon] .goi-thiet-ke-chon-phu:not(.is-active) {
    opacity: 0.42;
}

.luong-thiet-ke-secondary[data-goi-thiet-ke-dang-chon] .goi-thiet-ke-chon-phu:not(.is-active)::before {
    border-color: #c7bfb6;
}

.luong-thiet-ke-secondary[data-goi-thiet-ke-dang-chon] .goi-thiet-ke-chon-phu:not(.is-active):hover {
    opacity: 0.58;
}

.goi-thiet-ke-chon-phu.is-active {
    background: transparent;
    border-bottom-color: #e2d8cc;
    box-shadow: none;
}

.goi-thiet-ke-chon-phu.is-active::after {
    content: "\2713";
    grid-column: 1;
    grid-row: 1 / span 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: start;
    justify-self: start;
    width: 26px;
    height: 26px;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    color: #ffffff;
}

.goi-thiet-ke-chon-phu.is-active::before {
    background: var(--bieu-mau-orange);
    border-color: var(--bieu-mau-orange);
}

.goi-thiet-ke-chon-phu:has(.goi-thiet-ke-chon-phu-chon:focus-visible) {
    color: #171717;
}

.goi-thiet-ke-chon-phu:has(.goi-thiet-ke-chon-phu-chon:focus-visible)::before {
    border-color: #171717;
}

.goi-thiet-ke-chon-phu-chon {
    display: contents;
}

.goi-thiet-ke-chon-phu-dau {
    display: contents;
}

.goi-thiet-ke-chon-phu-tieu-de {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
    max-width: none;
    justify-self: start;
    align-self: start;
    font-size: var(--text-bac-3-size);
    font-weight: 700;
    line-height: var(--text-bac-3-line-height);
    color: inherit;
    text-align: left;
    text-transform: none !important;
    letter-spacing: 0;
    text-wrap: pretty;
}

.goi-thiet-ke-chon-phu-gia {
    grid-column: 3;
    grid-row: 1;
    align-self: start;
    justify-self: end;
    min-width: 96px;
    font-size: var(--text-bac-3-size);
    font-weight: 700;
    line-height: var(--text-bac-3-line-height);
    color: var(--bieu-mau-orange);
    white-space: nowrap;
    text-align: right;
    text-transform: none !important;
    letter-spacing: 0;
}

.goi-thiet-ke-chon-phu-mo-ta {
    display: block;
    grid-column: 2;
    grid-row: 2;
    width: 100%;
    max-width: none;
    min-height: 0;
    padding-top: var(--bieu-mau-goi-thiet-ke-khoang-cach-noi-dung);
    justify-self: stretch;
    align-self: start;
    font-size: var(--text-bac-4-size);
    font-weight: 400;
    line-height: var(--text-bac-4-line-height);
    color: #171717;
    text-align: left;
    text-transform: none !important;
    letter-spacing: 0;
    text-wrap: pretty;
}

.goi-thiet-ke-chon-phu-chi-tiet-bat-tat,
button.goi-thiet-ke-chon-phu-chi-tiet-bat-tat,
button[type="button"].goi-thiet-ke-chon-phu-chi-tiet-bat-tat {
    display: inline-flex !important;
    align-items: center;
    grid-column: 3;
    grid-row: 2;
    align-self: start;
    justify-self: end;
    gap: 5px;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: var(--bieu-mau-goi-thiet-ke-khoang-cach-noi-dung) 0 0 !important;
    color: #171717;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0;
    box-shadow: none !important;
    appearance: none !important;
    -webkit-appearance: none;
    font: inherit;
    font-size: var(--text-bac-4-size);
    font-weight: 400;
    line-height: var(--text-bac-4-line-height) !important;
    text-align: right;
    vertical-align: top;
    text-transform: none !important;
    letter-spacing: 0;
    white-space: nowrap;
    cursor: pointer;
    transition: opacity 0.2s ease;
}

.goi-thiet-ke-chon-phu-chi-tiet-nhan {
    display: inline-block;
    line-height: 1.45;
    text-transform: none !important;
    letter-spacing: 0;
}

.goi-thiet-ke-chon-phu-chi-tiet-bat-tat:hover {
    opacity: 0.78;
}

.goi-thiet-ke-chon-phu-chi-tiet-bieu-tuong {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    color: #ffffff;
    background: #050505;
}

.goi-thiet-ke-chon-phu-chi-tiet {
    display: grid;
    grid-column: 1 / 4;
    max-height: 900px;
    gap: 12px;
    margin-left: 0;
    margin-top: 8px;
    padding: 20px 24px 22px 34px;
    background: #eeeeee;
    border: 0;
    border-radius: 20px;
    opacity: 1;
    transform: translateY(0);
    overflow: hidden;
    transition:
        opacity 0.22s ease,
        transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
        max-height 0.34s cubic-bezier(0.22, 1, 0.36, 1),
        margin-top 0.3s cubic-bezier(0.22, 1, 0.36, 1),
        padding-top 0.3s cubic-bezier(0.22, 1, 0.36, 1),
        padding-bottom 0.3s cubic-bezier(0.22, 1, 0.36, 1);
}

.goi-thiet-ke-chon-phu-chi-tiet.is-collapsed {
    max-height: 0;
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 0;
    opacity: 0;
    transform: translateY(-6px);
    pointer-events: none;
}

.goi-thiet-ke-chon-phu-chi-tiet-luoi {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px 20px;
}

.goi-thiet-ke-chon-phu-chi-tiet-muc {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    min-width: 0;
}

.goi-thiet-ke-chon-phu-chi-tiet-muc-cham {
    flex: 0 0 6px;
    width: 6px;
    height: 6px;
    margin-top: 8px;
    border-radius: 999px;
    background: #171717;
}

.goi-thiet-ke-chon-phu-chi-tiet-muc-ban-sao {
    display: flex;
    flex-wrap: wrap;
    gap: 0 4px;
    min-width: 0;
    font-size: var(--text-bac-4-size);
    line-height: var(--text-bac-4-line-height);
    color: #171717;
    text-wrap: pretty;
}

.goi-thiet-ke-chon-phu-chi-tiet-muc-nhan {
    font-weight: 500;
    color: #171717;
}

.goi-thiet-ke-chon-phu-chi-tiet-muc-gia-tri {
    font-weight: 600;
    color: #171717;
    white-space: nowrap;
    text-transform: none !important;
}

.goi-thiet-ke-chon-phu-chi-tiet-ghi-chu-1 {
    display: grid;
    gap: 3px;
}

.goi-thiet-ke-chon-phu-chi-tiet-ghi-chu {
    margin: 0;
    font-size: var(--text-bac-5-size);
    line-height: var(--text-bac-5-line-height);
    color: #171717;
    text-wrap: pretty;
}

.goi-thiet-ke-chon-phu-chi-tiet-ghi-chu-nhan {
    font-weight: 600;
    color: #171717;
}

.goi-thiet-ke-chon-phu-chi-tiet-ghi-chu-chu {
    font-weight: 400;
}

.goi-thiet-ke-chon-phu-dau,
.goi-thiet-ke-chon-phu-tieu-de,
.goi-thiet-ke-chon-phu-gia,
.goi-thiet-ke-chon-phu-mo-ta,
.goi-thiet-ke-chon-phu-chi-tiet-bat-tat,
.goi-thiet-ke-chon-phu-chi-tiet-muc-ban-sao,
.goi-thiet-ke-chon-phu-chi-tiet-muc-nhan,
.goi-thiet-ke-chon-phu-chi-tiet-muc-gia-tri,
.goi-thiet-ke-chon-phu-chi-tiet-ghi-chu,
.goi-thiet-ke-chon-phu-chi-tiet-ghi-chu-nhan,
.goi-thiet-ke-chon-phu-chi-tiet-ghi-chu-chu {
    font-family: inherit;
}

.luong-thiet-ke-tai-len-bang {
    display: grid;
    gap: 10px;
    margin-top: 0;
    padding-left: 18px;
    overflow: visible;
}

.luong-thiet-ke-tai-len-bang-thong-diep {
    display: grid;
    gap: 5px;
    padding: 0;
    background: #ffffff;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.luong-thiet-ke-tai-len-bang-chu {
    margin: 0;
    width: 100%;
    max-width: none;
    font-size: var(--text-bac-5-size);
    font-weight: 500;
    line-height: var(--text-bac-5-line-height);
    letter-spacing: 0;
    text-align: left;
    color: #5a554f;
    text-transform: none !important;
    text-wrap: auto;
}

.luong-thiet-ke-tai-len-bang-chu-dam {
    color: #1f1d1a;
    font-size: var(--text-bac-5-size);
    font-weight: 650;
    line-height: var(--text-bac-5-line-height);
}

@media (min-width: 768px) {
    .luong-thiet-ke-stage {
        width: 100%;
    }

    .luong-thiet-ke-tai-len-bang {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        padding-left: 18px;
    }

    .luong-thiet-ke-tai-len-bang-thong-diep {
        width: 100%;
    }

    .luong-thiet-ke-tai-len-bang-chu {
        width: 100%;
        max-width: none;
        text-align: left;
        text-wrap: auto;
    }
}

.bieu-mau-hop-gia {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
        "nhan"
        "gia"
        "ghi-chu";
    align-items: start;
    column-gap: 0;
    row-gap: 8px;
    width: 100%;
    margin-top: 0;
    margin-right: auto;
    margin-bottom: 22px;
    margin-left: auto;
    padding: 18px 20px 20px;
    background: var(--bieu-mau-white);
    border: 1px solid var(--bieu-mau-line);
    border-radius: 18px;
    backdrop-filter: none;
}

.bieu-mau-hop-gia.is-hidden {
    display: none !important;
}

.bieu-mau-hop-gia-nhan {
    grid-area: nhan;
    display: block;
    justify-self: end;
    margin: 0;
    padding: 0;
    font-size: var(--text-bac-4-size);
    font-weight: 700;
    line-height: var(--text-bac-4-line-height);
    letter-spacing: 0;
    text-transform: none;
    text-align: right;
    color: #77737a;
    background: transparent;
    border: 0;
    border-radius: 0;
}

.bieu-mau-hop-gia-tri,
#bieu-mau-tong-gia {
    grid-area: gia;
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    justify-self: end;
    min-height: 43px;
    font-size: 42px;
    font-weight: 700;
    line-height: 1.02;
    letter-spacing: 0;
    color: #ff5722;
    text-align: right;
}

.bieu-mau-hop-gia-so {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    min-width: 0;
}

.bieu-mau-hop-gia-loading {
    display: none;
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    border: 3px solid rgba(255, 87, 34, 0.22);
    border-top-color: #ff5722;
    border-radius: 999px;
    animation: bieu-mau-gia-loading-xoay 0.72s linear infinite;
}

.bieu-mau-hop-gia.is-dang-tinh-gia .bieu-mau-hop-gia-so {
    display: none;
}

.bieu-mau-hop-gia.is-dang-tinh-gia .bieu-mau-hop-gia-loading {
    display: inline-block;
}

@keyframes bieu-mau-gia-loading-xoay {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .bieu-mau-hop-gia-loading {
        animation-duration: 1.4s;
    }
}

.bieu-mau-hop-gia-ghi-chu {
    grid-area: ghi-chu;
    justify-self: end;
    max-width: none;
    padding: 0;
    color: #77737a;
    font-size: 12px;
    font-style: italic;
    font-weight: 400;
    line-height: 1.3;
    text-align: right;
    white-space: nowrap;
    text-transform: none !important;
}

.bieu-mau-thong-diep-bao-gia {
    margin-top: 0;
    margin-bottom: 14px;
    padding: 14px 15px;
    font-size: var(--text-bac-4-size);
    line-height: var(--text-bac-4-line-height);
    color: #505056;
    background: var(--bieu-mau-orange-soft);
    border: 1px solid var(--bieu-mau-orange-line);
    border-radius: 18px;
}

.bieu-mau-thong-diep-bao-gia-noi-dung {
    font-size: inherit;
    line-height: inherit;
    color: inherit;
}

.bieu-mau-cum-dat-hang {
    display: grid;
    margin-top: 4px;
    gap: 10px;
}

.bieu-mau-huong-dan-dat-hang {
    width: 100%;
    margin: 0 0 8px;
    padding: 14px 15px;
    max-height: 120px;
    color: #505056;
    background: var(--bieu-mau-orange-soft);
    border: 1px solid var(--bieu-mau-orange-line);
    border-radius: 18px;
    box-shadow: none;
    opacity: 1;
    transform: translateY(0);
    overflow: hidden;
    transition:
        opacity 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        max-height 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        margin 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        padding 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        border-color 0.32s ease;
}

.bieu-mau-huong-dan-dat-hang.is-hidden {
    display: block !important;
    max-height: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    opacity: 0;
    transform: translateY(-8px);
    border-color: transparent;
    pointer-events: none;
}

.bieu-mau-huong-dan-dat-hang-tieu-de {
    display: block;
    font-size: var(--text-bac-5-size);
    font-weight: 700;
    line-height: var(--text-bac-5-line-height);
    text-align: center;
    color: inherit;
}

.bieu-mau-huong-dan-dat-hang-chi-tiet {
    display: block;
    margin-top: 5px;
    font-size: var(--text-bac-4-size);
    font-weight: var(--text-bac-4-weight);
    line-height: var(--text-bac-4-line-height);
    text-align: center;
    color: inherit;
}

.bieu-mau-cum-dat-hang-day-nut {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
}

@media (min-width: 768px) {
    .bieu-mau-cum-dat-hang-day-nut {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        column-gap: 28px;
        row-gap: 0;
    }

    .bieu-mau-san-pham .button_phu {
        grid-column: 1;
        grid-row: 1;
    }

    .bieu-mau-san-pham .button_chinh {
        grid-column: 2;
        grid-row: 1;
    }
}

.bieu-mau-san-pham .bieu-mau-nut-hanh-dong {
    width: 100%;
    min-height: 45px;
    margin: 0;
    padding: 0 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: var(--text-bac-3-size);
    font-weight: 700;
    line-height: var(--text-bac-3-line-height);
    text-align: center;
    text-decoration: none;
    text-transform: none;
    letter-spacing: 0;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    border: 1px solid var(--button-phu-vien);
    border-radius: 999px;
    box-shadow: none;
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease, opacity 0.18s ease;
}

.bieu-mau-san-pham .bieu-mau-nut-hanh-dong:hover {
    transform: none;
}

.bieu-mau-san-pham .bieu-mau-nut-hanh-dong.button_chinh:hover {
    background: #1b1b1b;
    box-shadow: none;
}

.bieu-mau-san-pham .bieu-mau-nut-hanh-dong.button_phu:hover {
    background: var(--button-phu-nen-hover);
    border-color: var(--button-phu-vien-hover);
    box-shadow: none;
}

.bieu-mau-san-pham .bieu-mau-nut-hanh-dong:active {
    transform: none;
    box-shadow: none;
}

.bieu-mau-san-pham .bieu-mau-nut-hanh-dong.button_phu:active {
    background: var(--button-phu-nen-active);
    border-color: var(--button-phu-vien-active);
}

.bieu-mau-san-pham .bieu-mau-nut-hanh-dong.la-khoa,
.bieu-mau-san-pham .bieu-mau-nut-hanh-dong[aria-disabled="true"] {
    opacity: 1;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.bieu-mau-san-pham .bieu-mau-nut-hanh-dong.la-dang-xu-ly {
    opacity: 1;
    cursor: progress;
    transform: none;
}

.nut-xu-ly {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.nut-xu-ly-chu {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.16s ease, transform 0.16s ease;
}

.nut-xu-ly::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, 0.42);
    border-top-color: #ffffff;
    border-radius: 999px;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -50%) rotate(0deg);
    animation: nut-xu-ly-xoay 0.72s linear infinite;
    animation-play-state: paused;
    transition: opacity 0.16s ease;
}

.nut-xu-ly.la-dang-xu-ly {
    cursor: progress;
}

.nut-xu-ly.la-dang-xu-ly .nut-xu-ly-chu {
    opacity: 0;
    transform: scale(0.985);
}

.nut-xu-ly.la-dang-xu-ly::after {
    opacity: 1;
    animation-play-state: running;
}

.nut-xu-ly.la-dang-xu-ly.button_chinh,
.khung-tao-don-gui.nut-xu-ly.la-dang-xu-ly {
    color: #ffffff;
    background: #8f8f8f;
    border-color: transparent;
}

.nut-xu-ly.la-dang-xu-ly.button_phu {
    color: #121212;
    background: #f0f0f2;
    border-color: #d8d8dc;
}

.nut-xu-ly.button_phu::after {
    border-color: rgba(18, 18, 18, 0.24);
    border-top-color: #121212;
}

@keyframes nut-xu-ly-xoay {
    to {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .nut-xu-ly-chu,
    .nut-xu-ly::after {
        transition-duration: 0.01ms;
    }

    .nut-xu-ly::after {
        animation-duration: 1.4s;
    }
}

.bieu-mau-san-pham .button_chinh {
    color: var(--bieu-mau-white);
    background: #050505;
    border: 1px solid transparent;
    box-shadow: none;
}

.bieu-mau-san-pham .button_chinh.la-khoa,
.bieu-mau-san-pham .button_chinh[aria-disabled="true"] {
    color: var(--bieu-mau-white);
    background: #050505;
    border-color: transparent;
}

.bieu-mau-san-pham .button_phu {
    color: var(--button-phu-chu);
    background: var(--button-phu-nen);
    border: 1px solid var(--button-phu-vien);
}

.bieu-mau-san-pham .button_phu.la-khoa,
.bieu-mau-san-pham .button_phu[aria-disabled="true"] {
    color: var(--button-phu-chu);
    background: var(--button-phu-nen);
    border-color: var(--button-phu-vien);
}

.bieu-mau-san-pham .bieu-mau-nut-hanh-dong-bao-gia {
    color: var(--bieu-mau-white);
    background: var(--bieu-mau-orange);
    border: 1px solid var(--bieu-mau-orange);
}

.khung-tao-don {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    overscroll-behavior: none;
}

.khung-tao-don-nen {
    position: absolute;
    inset: 0;
    background: #0c0c10;
    opacity: calc(var(--bang-keo-lop-phu, 1) * 0.72);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    transition: opacity 180ms cubic-bezier(0.22, 1, 0.36, 1);
}

.khung-tao-don.is-dang-keo-lop-phu .khung-tao-don-nen {
    transition: none;
}

.khung-tao-don-hop {
    position: relative;
    z-index: 1;
    width: min(560px, calc(100vw - 40px));
    height: min(76vh, 700px);
    max-height: calc(100vh - 32px);
    overflow: hidden;
    padding: 0;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
}

.khung-tao-don-to {
    --bieu-mau-tao-don-noi-dung-rong: 100%;
    --bieu-mau-tao-don-footer-rong: var(--bieu-mau-tao-don-noi-dung-rong);
    --khung-tao-don-khoang-cach-noi-dung-thanh-toan: 22px;
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    background: #ffffff;
    border: 0;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 18px 44px rgba(20, 20, 24, 0.12);
}

.khung-tao-don-tieu-de {
    position: relative;
    flex: 0 0 28px;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 28px;
    padding: 0;
    background: #050505;
    border-bottom: 0;
}

.khung-tao-don-step-cac-cham {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.khung-tao-don-step-cham {
    display: block;
    width: 8px;
    min-width: 8px;
    height: 8px;
    min-height: 8px;
    margin: 0;
    padding: 0;
    appearance: none;
    background: rgba(255, 255, 255, 0.42);
    border: 0;
    border-radius: 50%;
    box-shadow: none;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.khung-tao-don-step-cham.is-active {
    background: #ffffff;
}

.khung-tao-don-step-cham.is-active {
    transform: scale(1.05);
}

.bieu-mau-sr-only,
.khung-tao-don-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.single-product .next-prev-thumbs {
    display: none !important;
}

.hop-tao-don__body {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    flex: 1 1 auto;
    min-height: 0;
    gap: 0;
    overflow: visible;
    padding: 18px 22px 18px;
}

.khung-tao-don-bang {
    min-width: 0;
    height: 100%;
}

.khung-tao-don-bang.is-hidden {
    display: none;
}

.khung-tao-don-bang-lien-he {
    width: 100%;
    max-width: none;
    margin: 0;
}

.khung-tao-don-bang-tom-tat {
    max-width: 560px;
    margin: 0;
    padding-left: 0;
}

.khung-tao-don-lien-he-hop,
.khung-tao-don-tom-tat-hop {
    height: 100%;
    min-height: 0;
    padding: 0;
}

.khung-tao-don-lien-he-hop {
    display: flex;
    flex-direction: column;
}

.khung-tao-don-noi-dung {
    display: grid;
    align-content: start;
    gap: 30px;
    height: 100%;
    min-height: 0;
    overflow-y: auto;
    width: 100%;
    padding-right: 0;
}

.khung-tao-don-bang-lien-he .khung-tao-don-noi-dung {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    position: relative;
    z-index: 2;
    padding-top: 18px;
    overflow: visible;
}

.khung-tao-don-lien-he-luong {
    display: grid;
    gap: 28px;
    width: var(--bieu-mau-tao-don-noi-dung-rong);
    margin: 0;
}

.khung-tao-don-lien-he-vo {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

.khung-tao-don-lien-he-khu {
    display: grid;
    gap: 12px;
}
.khung-tao-don-lien-he-tieu-de-hang {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.khung-tao-don-lien-he-tieu-de {
    font-size: var(--text-bac-4-size);
    font-weight: 700;
    line-height: var(--text-bac-4-line-height);
    color: #171512;
}

.khung-tao-don-dia-chi {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    gap: 18px;
    width: 100%;
    margin: 0;
    padding: 0;
}

.hop-tao-don-dia-chi-manager__body {
    display: flex;
    flex-direction: column;
    gap: 18px;
    flex: 1 1 auto;
    min-height: 0;
    overflow: visible;
    padding-right: 2px;
}

.khung-tao-don-dia-chi-chuyen {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    white-space: nowrap;
    cursor: pointer;
}

.khung-tao-don-dia-chi-chuyen input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.khung-tao-don-dia-chi-chuyen-track {
    position: relative;
    width: 46px;
    height: 26px;
    background: #d3d1ce;
    border-radius: 999px;
    transition: background-color 0.2s ease;
}

.khung-tao-don-dia-chi-chuyen-track::after {
    content: "";
    position: absolute;
    top: 3px;
    left: 3px;
    width: 20px;
    height: 20px;
    background: #ffffff;
    border-radius: 50%;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.16);
    transition: transform 0.2s ease;
}

.khung-tao-don-dia-chi-chuyen input:checked + .khung-tao-don-dia-chi-chuyen-track {
    background: var(--bieu-mau-orange);
}

.khung-tao-don-dia-chi-chuyen input:checked + .khung-tao-don-dia-chi-chuyen-track::after {
    transform: translateX(20px);
}

.khung-tao-don-dia-chi-chuyen-nhan {
    font-size: var(--text-bac-5-size);
    font-weight: 600;
    line-height: var(--text-bac-5-line-height);
    color: #47413b;
}

.khung-tao-don-dia-chi-bieu-mau {
    display: contents;
}

.khung-tao-don-dia-chi-truong {
    position: relative;
    min-width: 0;
}

.khung-tao-don-dia-chi-truong-full {
    grid-column: 1 / -1;
}

.khung-tao-don-dia-chi-chuyen-hang {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin: 0;
    padding: 0;
}

.khung-tao-don-dia-chi-chuyen-khe {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
}

.khung-tao-don-dia-chi.is-province-district-ward-mode .hop-tao-don-dia-chi-manager__body,
.khung-tao-don-dia-chi.is-province-ward-mode .hop-tao-don-dia-chi-manager__body {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px 14px;
    align-content: start;
}

.khung-tao-don-dia-chi.is-province-district-ward-mode .khung-tao-don-dia-chi-truong-full,
.khung-tao-don-dia-chi.is-province-ward-mode .khung-tao-don-dia-chi-truong-full {
    grid-column: 1 / -1;
}

.khung-tao-don-dia-chi.is-province-district-ward-mode .khung-tao-don-dia-chi-truong-tinh,
.khung-tao-don-dia-chi.is-province-ward-mode .khung-tao-don-dia-chi-truong-tinh {
    grid-column: 1;
    grid-row: 1;
}

.khung-tao-don-dia-chi.is-province-district-ward-mode .khung-tao-don-dia-chi-truong-quan-huyen {
    grid-column: 2;
    grid-row: 1;
}

.khung-tao-don-dia-chi.is-province-district-ward-mode .khung-tao-don-dia-chi-truong-phuong-xa {
    grid-column: 1;
    grid-row: 2;
}

.khung-tao-don-dia-chi.is-province-ward-mode .khung-tao-don-dia-chi-truong-phuong-xa {
    grid-column: 2;
    grid-row: 1;
}

.khung-tao-don-dia-chi.is-province-district-ward-mode .khung-tao-don-dia-chi-truong-full {
    grid-row: 3;
}

.khung-tao-don-dia-chi.is-province-ward-mode .khung-tao-don-dia-chi-truong-full {
    grid-row: 2;
}

.khung-tao-don-dia-chi.is-province-district-ward-mode .khung-tao-don-dia-chi-loi {
    grid-column: 1 / -1;
    grid-row: 4;
}

.khung-tao-don-dia-chi.is-province-ward-mode .khung-tao-don-dia-chi-loi {
    grid-column: 1 / -1;
    grid-row: 3;
}

.khung-tao-don-tim-dia-chi {
    position: relative;
    width: 100%;
}

.khung-tao-don-tim-dia-chi-nhap {
    padding-right: 42px;
    background-image: linear-gradient(45deg, transparent 50%, #9a9389 50%), linear-gradient(135deg, #9a9389 50%, transparent 50%);
    background-position: calc(100% - 22px) calc(50% - 2px), calc(100% - 16px) calc(50% - 2px);
    background-size: 6px 6px, 6px 6px;
    background-repeat: no-repeat;
}

.khung-tao-don-tim-dia-chi-danh-sach {
    --hop-tao-don-dia-chi-menu-radius: 20px;
    --hop-tao-don-dia-chi-menu-padding: 6px;
    --hop-tao-don-dia-chi-menu-border-width: 1px;
    --hop-tao-don-dia-chi-menu-item-radius: calc(
        var(--hop-tao-don-dia-chi-menu-radius)
        - var(--hop-tao-don-dia-chi-menu-padding)
        - var(--hop-tao-don-dia-chi-menu-border-width)
    );
    position: absolute;
    top: calc(100% + 8px);
    bottom: auto;
    left: 0;
    width: 100%;
    min-width: 100%;
    max-width: none;
    z-index: 14;
    display: flex;
    flex-direction: column;
    gap: 4px;
    max-height: 220px;
    padding: var(--hop-tao-don-dia-chi-menu-padding);
    overflow-y: auto;
    background: #ffffff;
    border: var(--hop-tao-don-dia-chi-menu-border-width) solid #d9d1c8;
    border-radius: var(--hop-tao-don-dia-chi-menu-radius);
    box-shadow: 0 18px 34px rgba(0, 0, 0, 0.08);
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: #9a9389 transparent;
}

.khung-tao-don-tim-dia-chi-danh-sach.is-open-up {
    top: auto;
    bottom: calc(100% + 8px);
}

.khung-tao-don-tim-dia-chi-danh-sach.is-open-down {
    top: calc(100% + 8px);
    bottom: auto;
}

.khung-tao-don-tim-dia-chi-lua-chon,
.khung-tao-don-tim-dia-chi-ngang {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    width: 100%;
    min-height: 34px;
    margin: 0 !important;
    padding: 0 10px;
    font-size: var(--text-bac-4-size);
    line-height: 1;
    text-align: left;
    border-radius: var(--hop-tao-don-dia-chi-menu-item-radius);
}

button.khung-tao-don-tim-dia-chi-lua-chon {
    appearance: none;
    -webkit-appearance: none;
    display: flex !important;
    align-items: center;
    justify-content: flex-start;
    height: 34px;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 0 10px !important;
    font: inherit;
    font-size: var(--text-bac-4-size);
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0;
    text-transform: none;
    text-align: left;
    color: #171512;
    background: #ffffff;
    border: 0 !important;
    border-radius: var(--hop-tao-don-dia-chi-menu-item-radius);
    box-shadow: none !important;
    outline: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: top;
    cursor: pointer;
    transition: background-color 0.18s ease, color 0.18s ease;
}

button.khung-tao-don-tim-dia-chi-lua-chon::-moz-focus-inner {
    padding: 0;
    border: 0;
}

button.khung-tao-don-tim-dia-chi-lua-chon:hover,
button.khung-tao-don-tim-dia-chi-lua-chon.is-active {
    color: #171512;
    background: rgba(23, 21, 18, 0.08);
}

.khung-tao-don-tim-dia-chi-ngang {
    color: #8a8378;
    background: #f7f5f1;
}

.khung-tao-don-dia-chi-loi {
    margin: 0;
    max-height: 0;
    padding: 0;
    opacity: 0;
    overflow: hidden;
    transform: translateY(-8px);
    font-size: var(--text-bac-5-size);
    line-height: var(--text-bac-5-line-height);
    font-weight: 600;
    color: #d4561c;
    text-align: center;
    pointer-events: none;
    will-change: opacity, transform, max-height, margin-top, padding;
    transition:
        opacity 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        max-height 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        margin-top 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        padding 0.42s cubic-bezier(0.22, 1, 0.36, 1);
}

.khung-tao-don-dia-chi-loi.has-message {
    margin-top: 14px;
    max-height: 56px;
    opacity: 1;
    transform: translateY(0);
}

.khung-tao-don-dia-chi-loi.has-message.is-dismissing {
    max-height: 56px;
    opacity: 0;
    transform: translateY(-6px);
}

.khung-tao-don-lien-he-luoi {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px 18px;
}

.khung-tao-don-lien-he-truong {
    min-width: 0;
}

.khung-tao-don-nhap:not(.input_box_1):not(.input_box_2) {
    display: block;
    width: 100%;
    min-height: 52px;
    padding: 0 18px;
    font-size: var(--text-bac-3-size);
    font-style: normal;
    line-height: 1.45;
    color: #6f6961;
    -webkit-appearance: none;
    appearance: none;
    outline: none;
    transition: background-color 0.2s ease, color 0.2s ease;
}

.khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2) {
    min-height: 48px;
    height: 48px;
    margin: 0 !important;
    padding: 0 18px;
    font-size: var(--text-bac-3-size);
    -webkit-appearance: none;
    appearance: none;
}

.khung-tao-don-nhap-dia-chi-dong:not(.input_box_1):not(.input_box_2) {
    min-height: 65px;
    height: 65px;
    padding: 10px 18px;
    font-size: var(--text-bac-3-size);
    line-height: 1.4;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    resize: none;
}

.khung-tao-don-nhap-lien-he.is-error {
    border-color: var(--bieu-mau-orange);
    box-shadow: 0 0 0 1px var(--bieu-mau-orange-soft);
}

.khung-tao-don :is(
    input[type="text"].khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    input[type="text"].khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2),
    input[type="tel"].khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    input[type="tel"].khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2),
    textarea.khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    textarea.khung-tao-don-nhap-dia-chi-dong:not(.input_box_1):not(.input_box_2)
) {
    color: #7c766f !important;
    background: #f3f3f4 !important;
    background-color: #f3f3f4 !important;
    border: 1px solid transparent !important;
    border-color: transparent !important;
    border-radius: 24px !important;
    -webkit-border-radius: 24px !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
    outline: none !important;
}

.khung-tao-don :is(
    input[type="text"].khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    input[type="text"].khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2),
    input[type="tel"].khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    input[type="tel"].khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2),
    textarea.khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    textarea.khung-tao-don-nhap-dia-chi-dong:not(.input_box_1):not(.input_box_2)
)::placeholder {
    color: #aaa49e !important;
    opacity: 1 !important;
}

.khung-tao-don :is(
    input[type="text"].khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    input[type="text"].khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2),
    input[type="tel"].khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    input[type="tel"].khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2),
    textarea.khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    textarea.khung-tao-don-nhap-dia-chi-dong:not(.input_box_1):not(.input_box_2)
):not(:placeholder-shown):not(:focus):not(:active),
.khung-tao-don :is(
    input[type="text"].khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    input[type="text"].khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2),
    input[type="tel"].khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    input[type="tel"].khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2),
    textarea.khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    textarea.khung-tao-don-nhap-dia-chi-dong:not(.input_box_1):not(.input_box_2)
):-webkit-autofill:not(:focus):not(:active),
.khung-tao-don :is(
    input[type="text"].khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    input[type="text"].khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2),
    input[type="tel"].khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    input[type="tel"].khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2),
    textarea.khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    textarea.khung-tao-don-nhap-dia-chi-dong:not(.input_box_1):not(.input_box_2)
):-webkit-autofill:hover:not(:focus):not(:active) {
    color: #171512 !important;
    -webkit-text-fill-color: #171512 !important;
    caret-color: #171512 !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    border-color: #d8d8d8 !important;
    -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
    box-shadow: 0 0 0 1000px #ffffff inset !important;
}

.khung-tao-don :is(
    input[type="text"].khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    input[type="text"].khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2),
    input[type="tel"].khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    input[type="tel"].khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2),
    textarea.khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    textarea.khung-tao-don-nhap-dia-chi-dong:not(.input_box_1):not(.input_box_2)
):is(:focus, :active),
.khung-tao-don :is(
    input[type="text"].khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    input[type="text"].khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2),
    input[type="tel"].khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    input[type="tel"].khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2),
    textarea.khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    textarea.khung-tao-don-nhap-dia-chi-dong:not(.input_box_1):not(.input_box_2)
):-webkit-autofill:focus,
.khung-tao-don :is(
    input[type="text"].khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    input[type="text"].khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2),
    input[type="tel"].khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    input[type="tel"].khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2),
    textarea.khung-tao-don-nhap:not(.input_box_1):not(.input_box_2),
    textarea.khung-tao-don-nhap-dia-chi-dong:not(.input_box_1):not(.input_box_2)
):-webkit-autofill:active {
    color: #171512 !important;
    -webkit-text-fill-color: #171512 !important;
    caret-color: #171512 !important;
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: 1px solid #171512 !important;
    border-color: #171512 !important;
    border-radius: 24px !important;
    -webkit-border-radius: 24px !important;
    box-shadow: 0 0 0 1000px #ffffff inset !important;
    -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
    outline: none !important;
}

.khung-tao-don-cuoi-hang {
    width: var(--bieu-mau-tao-don-noi-dung-rong);
    margin-left: auto;
    margin-right: auto;
}

.khung-tao-don-bang-tom-tat .khung-tao-don-noi-dung {
    gap: 12px;
}

.khung-tao-don-tom-tat-code {
    display: inline-flex;
    align-items: baseline;
    justify-content: flex-start;
    gap: 7px;
    max-width: none;
    min-width: 0;
    color: #111111;
    text-align: left;
    white-space: nowrap;
    text-transform: none !important;
}

.khung-tao-don-tom-tat-code.is-hidden {
    display: none;
}

.khung-tao-don-tom-tat-code-nhan {
    display: inline-block;
    font-size: var(--text-bac-5-size);
    font-weight: 500;
    line-height: var(--text-bac-5-line-height);
    color: #666666;
    letter-spacing: 0;
}

.khung-tao-don-tom-tat-code-gia-tri {
    display: inline-block;
    min-width: 0;
    font-size: var(--text-bac-4-size);
    font-weight: 700;
    line-height: var(--text-bac-4-line-height);
    color: #111111;
    letter-spacing: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.khung-tao-don-tom-tat-dau-trang {
    display: flex;
    justify-content: flex-start;
    width: 100%;
    margin: 0;
}

.khung-tao-don-the-san-pham {
    display: grid;
    width: 100%;
    margin: 12px 0 0;
}

.khung-tao-don-the-san-pham .the-san-pham-dung-chung {
    width: 100%;
    box-sizing: border-box;
}
.khung-tao-don-thanh-toan-danh-sach {
    display: none;
    gap: 10px;
    width: var(--bieu-mau-tao-don-noi-dung-rong);
    margin: 0;
    padding: 16px 18px 0;
    box-sizing: border-box;
    border-top: 1px solid rgba(17, 17, 17, 0.08);
}

.khung-tao-don.la-tom-tat-step .khung-tao-don-thanh-toan-danh-sach {
    display: grid;
}

.khung-tao-don-thanh-toan-hang {
    display: grid;
    grid-template-columns: minmax(0, 1.38fr) minmax(84px, 0.56fr) minmax(120px, 0.78fr);
    align-items: center;
    gap: 12px;
}

.khung-tao-don-thanh-toan-nhan,
.khung-tao-don-thanh-toan-gia-tri {
    font-size: var(--text-bac-4-size);
    line-height: var(--text-bac-4-line-height);
    color: #111111;
}

.khung-tao-don-thanh-toan-nhan {
    font-weight: 400;
    grid-column: 1;
}

.khung-tao-don-thanh-toan-gia-tri {
    font-weight: 500;
    text-align: right;
    grid-column: 3;
}

.khung-tao-don-thanh-toan-ghi-chu-vat {
    display: block;
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: stretch;
    max-width: 100%;
    margin: 0;
    font-size: var(--text-bac-5-size);
    font-weight: 400;
    line-height: var(--text-bac-5-line-height);
    text-align: right;
    white-space: nowrap;
    color: #777777;
}

.khung-tao-don-tong-thanh-toan-noi-bat {
    display: none;
    grid-template-columns: minmax(0, 1.38fr) minmax(84px, 0.56fr) minmax(120px, 0.78fr);
    align-items: center;
    gap: 16px;
    width: 100%;
    margin: 0;
    min-height: 50px;
    padding: 16px 18px;
    box-sizing: border-box;
    color: #111111;
    background: transparent;
    border-top: 1px solid rgba(17, 17, 17, 0.08);
    border-radius: 0;
    min-width: 0;
}

.khung-tao-don.la-tom-tat-step .khung-tao-don-tong-thanh-toan-noi-bat {
    display: grid;
    width: var(--bieu-mau-tao-don-noi-dung-rong);
    margin: 0;
}

.khung-tao-don-tong-thanh-toan-noi-bat-nhan {
    display: block;
    font-size: var(--text-bac-4-size);
    font-weight: 700;
    line-height: var(--text-bac-4-line-height);
    white-space: nowrap;
    color: #777777;
    grid-column: 1;
}

.khung-tao-don-tong-thanh-toan-noi-bat-gia-tri {
    display: block;
    font-size: clamp(17px, 2vw, 20px);
    font-weight: 700;
    line-height: 1.1;
    text-align: right;
    white-space: nowrap;
    color: var(--bieu-mau-orange);
    grid-column: 3;
}

.khung-tao-don.la-tom-tat-step .hop-tao-don__body {
    grid-template-rows: minmax(0, 1fr);
    padding: 18px 22px 8px;
}

.khung-tao-don.la-tom-tat-step .khung-tao-don-bang-tom-tat {
    max-width: none;
    width: 100%;
    min-height: 0;
    overflow: hidden;
}

.khung-tao-don.la-tom-tat-step .khung-tao-don-tom-tat-hop {
    width: 100%;
    max-width: none;
    margin: 0;
}

.khung-tao-don.la-tom-tat-step .khung-tao-don-bang-tom-tat .khung-tao-don-noi-dung {
    gap: 12px;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    width: 100%;
    padding-top: 0;
}

.khung-tao-don-gui {
    display: block;
    width: 100%;
    min-width: 0;
    height: 45px;
    margin: 0;
    font-size: var(--text-bac-3-size);
    font-weight: 700;
    letter-spacing: 0;
    text-transform: none;
    color: #ffffff;
    background: #050505;
    border: 1px solid #050505;
    border-radius: 999px;
    cursor: pointer;
}

.khung-tao-don-hanh-dong {
    display: flex;
    justify-content: stretch;
    width: 100%;
    margin-top: 0;
    grid-column: 1;
}

.khung-tao-don-cuoi {
    display: grid;
    gap: 16px;
    flex: 0 0 auto;
    position: relative;
    z-index: 1;
    padding: var(--khung-tao-don-khoang-cach-noi-dung-thanh-toan) 30px 30px;
    box-sizing: border-box;
    background: #ffffff;
}

.khung-tao-don-cuoi-phan-cach {
    display: none;
    height: 5px;
    background: #050505;
}

.khung-tao-don-cuoi-hang {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    width: var(--bieu-mau-tao-don-noi-dung-rong);
    margin: 0;
    align-items: center;
    transform: translateY(-7px);
}

@media (max-width: 980px) {
    .khung-tao-don {
        padding: 16px;
    }

    .khung-tao-don-hop {
        width: min(540px, calc(100vw - 24px));
    }

    .hop-tao-don__body {
        padding: 18px 18px 22px;
    }

    .khung-tao-don.la-tom-tat-step .khung-tao-don-tom-tat-hop {
        width: 100%;
    }

}

@media (max-width: 640px) {
    .khung-tao-don-thanh-toan-hang,
    .khung-tao-don-tong-thanh-toan-noi-bat {
        grid-template-columns: minmax(0, 1.34fr) minmax(66px, 0.46fr) minmax(96px, 0.74fr);
        column-gap: 8px;
    }

    .khung-tao-don-thanh-toan-nhan,
    .khung-tao-don-thanh-toan-gia-tri,
    .khung-tao-don-tong-thanh-toan-noi-bat-nhan {
        font-size: var(--text-bac-5-size);
    }

    .khung-tao-don-tong-thanh-toan-noi-bat-gia-tri {
        font-size: var(--text-bac-3-size);
    }

    .khung-tao-don-thanh-toan-gia-tri,
    .khung-tao-don-tong-thanh-toan-noi-bat-gia-tri {
        white-space: nowrap;
    }

    .khung-tao-don-tong-thanh-toan-noi-bat {
        min-height: 46px;
        padding: 12px 18px;
    }
}

.bieu-mau-thong-tin-block {
    padding: 18px 0 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.bieu-mau-thong-tin-block-thong-so {
    background: linear-gradient(180deg, #ffffff 0%, #fbfbfb 100%);
}

.bieu-mau-thong-tin-block.bieu-mau-san-pham-thong-so-the .bieu-mau-thong-tin-danh-sach-thong-so li {
    --bieu-mau-thong-so-bieu-tuong-kich-thuoc: 48px;
    --bieu-mau-thong-so-bieu-tuong-net-kich-thuoc: 34px;
    position: relative;
    display: grid;
    grid-template-columns: var(--bieu-mau-thong-so-bieu-tuong-kich-thuoc) minmax(0, 1fr);
    align-items: center;
    column-gap: 10px;
    margin: 0;
    margin-left: 0;
    min-height: var(--bieu-mau-thong-so-bieu-tuong-kich-thuoc);
    padding: 0;
    font-size: var(--text-bac-4-size);
    line-height: var(--text-bac-4-line-height);
    box-sizing: border-box;
    list-style: none;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.bieu-mau-thong-tin-block.bieu-mau-san-pham-thong-so-the .bieu-mau-thong-tin-danh-sach-thong-so li + li {
    margin-top: 0;
}

.bieu-mau-thong-tin-block.bieu-mau-san-pham-thong-so-the .bieu-mau-thong-tin-danh-sach-thong-so li + li::after {
    content: none;
}

.bieu-mau-thong-tin-block.bieu-mau-san-pham-thong-so-the .bieu-mau-thong-tin-danh-sach-thong-so li::before {
    content: none;
    display: none;
}

@media (min-width: 850px) {
    .single-product .product-main .summary.entry-summary [class*="breadcrumb"],
    .single-product .product-info [class*="breadcrumb"],
    .single-product .product-main > .row.content-row > .entry-summary [class*="breadcrumb"] {
        margin-bottom: 8px;
        font-size: var(--text-bac-3-size);
        line-height: var(--text-bac-3-line-height);
        font-weight: 700;
        color: #4a4a4f;
        text-transform: capitalize;
    }

    .single-product .product-main .summary.entry-summary [class*="breadcrumb"] a,
    .single-product .product-info [class*="breadcrumb"] a,
    .single-product .product-main > .row.content-row > .entry-summary [class*="breadcrumb"] a {
        font-weight: 700;
    }

    .single-product .product-main .summary.entry-summary .product-title,
    .single-product .product-main .summary.entry-summary .product_title,
    .single-product .product-main > .row.content-row > .entry-summary .product-title,
    .single-product .product-main > .row.content-row > .entry-summary .product_title {
        margin-bottom: 20px;
        color: #fb5b20;
    }

    .single-product .product-main .summary.entry-summary .is-divider.small,
    .single-product .product-main > .row.content-row > .entry-summary .is-divider.small {
        display: none;
    }
}

.bieu-mau-thong-so-hang-dong {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
    min-width: 0;
}

.bieu-mau-thong-so-hang-bieu-tuong {
    display: inline-flex;
    width: var(--bieu-mau-thong-so-bieu-tuong-kich-thuoc);
    height: var(--bieu-mau-thong-so-bieu-tuong-kich-thuoc);
    align-items: center;
    justify-content: center;
    color: #4a4540;
    background: transparent;
    border: 0;
    border-radius: 0;
    color: #77736f;
}

.bieu-mau-thong-so-hang-bieu-tuong svg,
.bieu-mau-thong-so-hang-bieu-tuong img {
    display: block;
    width: var(--bieu-mau-thong-so-bieu-tuong-net-kich-thuoc);
    height: var(--bieu-mau-thong-so-bieu-tuong-net-kich-thuoc);
}

.bieu-mau-thong-so-hang-bieu-tuong svg {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.25;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.bieu-mau-thong-so-hang-bieu-tuong .bieu-mau-thong-so-icon-file,
.bieu-mau-thong-so-hang-bieu-tuong .bieu-mau-thong-so-icon-file path {
    fill: currentColor;
    stroke: none;
}

.bieu-mau-thong-so-hang-khoa,
.bieu-mau-thong-so-hang-gia-tri {
    display: block;
    min-width: 0;
    font-size: var(--text-bac-4-size);
    text-align: left;
    line-height: var(--text-bac-4-line-height);
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.bieu-mau-thong-so-hang-khoa {
    font-size: var(--text-bac-5-size);
    font-weight: 400;
    color: #4f4b52;
    letter-spacing: 0;
}

.bieu-mau-thong-so-hang-gia-tri {
    font-size: var(--text-bac-3-size);
    font-weight: 400;
    color: #4f4b52;
    text-align: left;
}

@media (max-width: 640px) {
    .bieu-mau-thong-tin-block.bieu-mau-san-pham-thong-so-the .bieu-mau-thong-tin-danh-sach-thong-so {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px 16px;
        max-width: 390px;
    }

    .bieu-mau-thong-tin-block.bieu-mau-san-pham-thong-so-the .bieu-mau-thong-tin-danh-sach-thong-so li {
        --bieu-mau-thong-so-bieu-tuong-kich-thuoc: 42px;
        --bieu-mau-thong-so-bieu-tuong-net-kich-thuoc: 30px;
        min-height: var(--bieu-mau-thong-so-bieu-tuong-kich-thuoc);
        padding: 10px;
        column-gap: 8px;
    }

    .bieu-mau-thong-tin-block.bieu-mau-san-pham-thong-so-the .bieu-mau-thong-tin-tieu-de {
        margin-bottom: 8px;
    }

    .bieu-mau-thong-so-hang-dong {
        gap: 3px;
    }

    .bieu-mau-thong-so-hang-khoa,
    .bieu-mau-thong-so-hang-gia-tri {
        line-height: 1.55;
    }

    .bieu-mau-thong-so-hang-khoa {
        font-size: var(--text-bac-5-size);
    }

    .bieu-mau-thong-so-hang-gia-tri {
        font-size: var(--text-bac-3-size);
        line-height: var(--text-bac-3-line-height);
    }

    .bieu-mau-thong-so-hang-dong {
        max-width: none;
    }
}

.bieu-mau-thong-tin-tieu-de {
    margin: 0 0 12px;
    font-size: var(--text-bac-1-size);
    font-weight: var(--text-bac-1-weight);
    line-height: var(--text-bac-1-line-height);
    letter-spacing: 0;
}

.bieu-mau-thong-tin-danh-sach {
    margin: 0;
    padding: 0;
    list-style: none;
}

.bieu-mau-thong-tin-danh-sach li {
    position: relative;
    padding-left: 16px;
    font-size: var(--text-bac-4-size);
    line-height: var(--text-bac-4-line-height);
    color: #65656b;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.bieu-mau-thong-tin-danh-sach li + li {
    margin-top: 8px;
}

.bieu-mau-thong-tin-danh-sach li::before {
    content: "";
    position: absolute;
    top: 9px;
    left: 0;
    width: 5px;
    height: 5px;
    background: #8a8a8f;
    border-radius: 999px;
}

.single-product .product-info [class*="product-details__short-description"],
.single-product .product-info .product-short-description {
    position: relative;
    margin-top: 18px;
    padding-top: 24px;
    background: transparent;
}

.single-product .product-info [class*="product-details__short-description"]::before,
.single-product .product-info .product-short-description::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: min(100%, 460px);
    height: 4px;
    background: var(--bieu-mau-black);
}

.single-product .product-info .is-divider:not(.small) {
    display: none;
}

.single-product .product-info .is-divider.small,
.single-product .product-main .summary.entry-summary .is-divider.small,
.single-product .product-main > .row.content-row > .entry-summary .is-divider.small {
    display: none;
}

.single-product .product_meta,
.single-product .product-footer .social-icons,
.single-product .product-footer .share-icons,
.single-product .product-info .social-icons,
.single-product .product-info .share-icons {
    display: none !important;
}

@media (max-width: 849px) {
    .single-product .product-info .is-divider.small,
    .single-product .product-main .summary.entry-summary .is-divider.small,
    .single-product .product-main > .row.content-row > .entry-summary .is-divider.small {
        margin-bottom: 18px;
    }
}

.is-hidden {
    display: none !important;
}

@media (prefers-reduced-motion: reduce) {
    .luong-thiet-ke-stage,
    .luong-thiet-ke-stage-bang,
    .luong-thiet-ke-stage-bang.is-collapsed,
    .luong-thiet-ke-secondary,
    .luong-thiet-ke-tai-len-bang {
        opacity: 1;
        transform: none;
        transition: none;
    }
}

@media (max-width: 767px) {
    .bieu-mau-san-pham,
    .khung-tao-don {
        --bieu-mau-chuyen-bat-tat-kich-thuoc: 46px;
        --bieu-mau-vo-radius: 20px;
    }

    .single-product div.product,
    .single-product .product-main,
    .single-product .product-gallery,
    .single-product .product-gallery-slider,
    .single-product .product-info,
    .single-product .summary,
    .single-product .summary.entry-summary,
    .single-product [class*="product-gallery"] {
        overflow-x: hidden;
        max-width: 100%;
        min-width: 0;
        width: 100%;
        box-sizing: border-box;
    }

    .single-product .product-main > .row.content-row {
        display: flex;
        flex-direction: column;
        margin-left: 0;
        margin-right: 0;
    }

    .single-product .product-main .product-info,
    .single-product .product-main .summary.entry-summary,
    .single-product .product-main > .row.content-row > .entry-summary,
    .single-product .product-gallery .bieu-mau-san-pham-thong-so-khe {
        padding-left: 14px;
        padding-right: 14px;
    }

    .single-product .product-main .product-gallery {
        padding-left: 0;
        padding-right: 0;
    }

    .single-product .product-gallery .woocommerce-product-gallery,
    .single-product .product-gallery .woocommerce-product-gallery__wrapper,
    .single-product .product-gallery .product-gallery-slider,
    .single-product .product-gallery .flickity-viewport,
    .single-product .product-gallery [class*="product-gallery__image"],
    .single-product .product-gallery [class*="product-gallery__image"] > a,
    .single-product .product-gallery [class*="product-gallery__image"] img,
    .single-product .product-gallery .wp-post-image {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    .single-product .product-gallery [class*="product-gallery__image"] > a,
    .single-product .product-gallery [class*="product-gallery__image"] img,
    .single-product .product-gallery .wp-post-image {
        display: block;
    }

    .single-product .product-main .summary.entry-summary [class*="breadcrumb"],
    .single-product .product-main .summary.entry-summary .product-title,
    .single-product .product-main .summary.entry-summary .product_title,
    .single-product .product-main .summary.entry-summary .is-divider.small,
    .single-product .product-main > .row.content-row > .entry-summary [class*="breadcrumb"],
    .single-product .product-main > .row.content-row > .entry-summary .product-title,
    .single-product .product-main > .row.content-row > .entry-summary .product_title,
    .single-product .product-main > .row.content-row > .entry-summary .is-divider.small {
        display: none !important;
    }

    .khung-tao-don {
        align-items: flex-end;
        justify-content: center;
        padding: 0;
    }

    .khung-tao-don-hop {
        width: 100%;
        height: auto;
        max-height: 100dvh;
        border-radius: 0;
        box-shadow: none;
    }

    .khung-tao-don-to {
        --bieu-mau-tao-don-noi-dung-rong: 100%;
        --bieu-mau-tao-don-footer-rong: var(--bieu-mau-tao-don-noi-dung-rong);
        --bang-keo-di-dong-cao-toi-thieu: min(76dvh, 700px);
        height: auto;
        max-height: 100dvh;
        border: 0;
        border-radius: 26px 26px 0 0;
        box-shadow: 0 -16px 40px rgba(15, 16, 24, 0.12);
    }

    .khung-tao-don .khung-tao-don-to.bang-keo-di-dong {
        width: 100%;
        min-width: 0;
    }

    .khung-tao-don .khung-tao-don-to.bang-keo-di-dong--ngan {
        padding-top: 0;
    }

    .khung-tao-don .khung-tao-don-to.bang-keo-di-dong--ngan::before {
        content: none;
    }

    .khung-tao-don .khung-tao-don-to > .tay-nam-bang {
        position: absolute;
        top: 8px;
        left: 50%;
        z-index: 4;
        margin: 0;
        transform: translateX(-50%);
    }

    .khung-tao-don-tieu-de {
        flex-basis: 52px;
        min-height: 52px;
        box-sizing: border-box;
        padding-top: 22px;
        background: transparent;
    }

    .khung-tao-don-step-cham {
        background: rgba(17, 17, 17, 0.28);
    }

    .khung-tao-don-step-cham.is-active {
        background: #111111;
    }

    .hop-tao-don__body {
        min-height: 0;
        padding: 18px 24px 10px;
    }

    .khung-tao-don .hop-tao-don__body.bang-keo-di-dong__than {
        overflow-y: auto;
        overflow-x: hidden;
        overscroll-behavior: contain;
        touch-action: pan-y;
        -webkit-overflow-scrolling: touch;
    }

    .khung-tao-don-noi-dung {
        gap: 22px;
        padding-right: 0;
    }

    .khung-tao-don-bang-lien-he .khung-tao-don-noi-dung {
        padding-top: 8px;
    }

    .khung-tao-don-lien-he-luong {
        gap: 24px;
    }

    .khung-tao-don-dia-chi {
        width: 100%;
        gap: 16px;
    }

    .khung-tao-don-lien-he-khu {
        gap: 12px;
    }

    .khung-tao-don-lien-he-luoi {
        gap: 22px;
    }

    .khung-tao-don-lien-he-luoi-lien-he {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
    }

    .khung-tao-don-lien-he-tieu-de-hang {
        align-items: center;
        flex-wrap: nowrap;
        gap: 10px;
    }

    .khung-tao-don-dia-chi.is-province-district-ward-mode .hop-tao-don-dia-chi-manager__body,
    .khung-tao-don-dia-chi.is-province-ward-mode .hop-tao-don-dia-chi-manager__body {
        display: block;
    }

    .khung-tao-don-dia-chi-bieu-mau {
        display: grid;
        grid-template-columns: 1fr;
        gap: 22px;
    }

    .khung-tao-don-dia-chi.is-province-district-ward-mode .khung-tao-don-dia-chi-truong-full,
    .khung-tao-don-dia-chi.is-province-ward-mode .khung-tao-don-dia-chi-truong-full {
        grid-column: auto;
        grid-row: auto;
    }

    .khung-tao-don-dia-chi.is-province-district-ward-mode .khung-tao-don-dia-chi-truong-tinh,
    .khung-tao-don-dia-chi.is-province-district-ward-mode .khung-tao-don-dia-chi-truong-quan-huyen,
    .khung-tao-don-dia-chi.is-province-district-ward-mode .khung-tao-don-dia-chi-truong-phuong-xa,
    .khung-tao-don-dia-chi.is-province-ward-mode .khung-tao-don-dia-chi-truong-tinh,
    .khung-tao-don-dia-chi.is-province-ward-mode .khung-tao-don-dia-chi-truong-phuong-xa,
    .khung-tao-don-dia-chi.is-province-district-ward-mode .khung-tao-don-dia-chi-loi,
    .khung-tao-don-dia-chi.is-province-ward-mode .khung-tao-don-dia-chi-loi {
        grid-column: auto;
        grid-row: auto;
    }

    .khung-tao-don-dia-chi-loi.has-message {
        margin-top: 14px;
    }

    .khung-tao-don-bang-lien-he {
        max-width: none;
    }

    .khung-tao-don-bang-tom-tat {
        max-width: none;
    }

    .khung-tao-don-bang-lien-he .khung-tao-don-noi-dung {
        overflow-y: visible;
        overflow-x: hidden;
    }

    .khung-tao-don.la-tom-tat-step .khung-tao-don-bang-tom-tat .khung-tao-don-noi-dung {
        overflow-y: auto;
        overflow-x: hidden;
        overscroll-behavior: contain;
    }

    .khung-tao-don-dia-chi-chuyen-nhan {
        font-size: var(--text-bac-5-size);
    }

    .khung-tao-don-cuoi {
        gap: 18px;
        padding: 0 24px calc(22px + env(safe-area-inset-bottom, 0px));
        border-top: 1px solid rgba(23, 21, 18, 0.08);
        box-shadow: 0 -8px 18px rgba(15, 16, 24, 0.05);
    }

    .khung-tao-don:not(.la-tom-tat-step) .khung-tao-don-cuoi {
        padding-top: var(--khung-tao-don-khoang-cach-noi-dung-thanh-toan);
    }

    .khung-tao-don-thanh-toan-danh-sach {
        padding-top: 16px;
        border-top: 0;
    }

    .khung-tao-don-cuoi-hang {
        grid-template-columns: minmax(0, 1fr);
        gap: 0;
        transform: none;
    }

    .khung-tao-don-hanh-dong {
        grid-column: 1;
    }

    .khung-tao-don-cuoi-phan-cach {
        height: 4px;
    }

    .khung-tao-don-nhap:not(.input_box_1):not(.input_box_2) {
        min-height: 48px;
        padding: 0 16px;
        font-size: var(--text-bac-3-size);
        border-radius: 24px;
    }

    .khung-tao-don-nhap-lien-he:not(.input_box_1):not(.input_box_2) {
        min-height: 48px;
        height: 48px;
        padding: 0 16px;
        font-size: var(--text-bac-3-size);
    }

    .khung-tao-don-nhap-dia-chi-dong:not(.input_box_1):not(.input_box_2) {
        min-height: 70px;
        height: 70px;
        padding: 11px 16px;
        font-size: var(--text-bac-3-size);
        border-radius: 24px !important;
    }

    .khung-tao-don-tom-tat-code {
        gap: 5px;
        max-width: none;
    }

    .khung-tao-don-tom-tat-code-nhan {
        font-size: var(--text-bac-5-size);
    }

    .khung-tao-don-tom-tat-code-gia-tri {
        font-size: var(--text-bac-1-size);
    }
    .khung-tao-don.la-tom-tat-step .hop-tao-don__body {
    grid-template-rows: minmax(0, 1fr);
        padding: 18px 14px 4px;
    }

    .khung-tao-don.la-tom-tat-step .khung-tao-don-bang-tom-tat {
        max-width: none;
        width: 100%;
    min-height: 0;
    overflow: hidden;
    }

    .khung-tao-don.la-tom-tat-step .khung-tao-don-tom-tat-hop {
        width: 100%;
        max-width: none;
        margin: 0;
    }

    .khung-tao-don.la-tom-tat-step .khung-tao-don-bang-tom-tat .khung-tao-don-noi-dung {
        gap: 8px;
        width: 100%;
        padding-top: 0;
    }

    .khung-tao-don.la-tom-tat-step .khung-tao-don-tom-tat-code {
        max-width: none;
    }

    .khung-tao-don.la-tom-tat-step .khung-tao-don-tom-tat-code-gia-tri {
        font-size: var(--text-bac-4-size);
    }
    .khung-tao-don-cuoi {
        gap: 10px;
    }

    .bieu-mau-bang {
        padding: 20px 18px;
        border-radius: 20px;
    }

    .bieu-mau-bang-cau-hinh {
        padding-bottom: 0;
    }

    .bieu-mau-bang-ket-qua {
        padding: 0 var(--bieu-mau-ket-qua-padding-ngang) var(--bieu-mau-ket-qua-padding-duoi);
    }

    .bieu-mau-san-pham,
    .khung-tao-don {
        --bieu-mau-khoang-cach-cum: 24px;
        --bieu-mau-khoang-cach-hang: 10px;
        --bieu-mau-khoang-cach-o: 10px;
        --bieu-mau-goi-thiet-ke-khoang-cach-noi-dung: 3px;
        --bieu-mau-khoang-cach-ket-qua: 16px;
        --bieu-mau-ket-qua-padding-ngang: 22px;
        --bieu-mau-ket-qua-padding-duoi: 26px;
    }

    .bieu-mau-kich-thuoc-nhom {
        margin-bottom: var(--bieu-mau-khoang-cach-hang);
    }

    .bieu-mau-truong-tieu-de,
    .bieu-mau-truong-nhom:not(.bieu-mau-kich-thuoc-nhom) > .bieu-mau-truong > .bieu-mau-nhan,
    .bieu-mau-kich-thuoc-nhom .bieu-mau-nhan,
    .bieu-mau-thong-tin-tieu-de {
        font-size: var(--text-bac-2-size);
    }

    .bieu-mau-truong-dau {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .luong-thiet-ke-block {
        --luong-thiet-ke-switch-width: 100%;
        margin-top: 0;
        margin-bottom: 10px;
    }

    .luong-thiet-ke-stage {
        margin-top: 14px;
        width: 100%;
    }

    .bieu-mau-luoi-hinh-dang,
    .luong-thiet-ke-primary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .bieu-mau-luoi-hinh-dang {
        width: 90%;
        margin: 0;
    }

    .bieu-mau-luoi-hinh-dang.bieu-mau-luoi-hinh-dang-count-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        width: 100%;
    }

    .bieu-mau-kich-thuoc-luoi {
        gap: var(--bieu-mau-khoang-cach-o);
    }

    .bieu-mau-nhap,
    .bieu-mau-chon,
    #bieu-mau-width,
    #bieu-mau-height,
    #bieu-mau-depth,
    #bieu-mau-so-luong-tuy-chinh {
        height: 46px;
        padding: 0 14px;
        font-size: 16px;
        border-radius: 999px;
    }

    .bieu-mau-nhap::placeholder,
    #bieu-mau-width::placeholder,
    #bieu-mau-height::placeholder,
    #bieu-mau-depth::placeholder,
    #bieu-mau-so-luong-tuy-chinh::placeholder {
        font-size: var(--text-bac-4-size);
        font-weight: var(--text-bac-4-weight);
        line-height: var(--text-bac-4-line-height);
    }

    .bieu-mau-chon.is-placeholder-selected,
    .bieu-mau-chon:has(option[data-placeholder="true"]:checked) {
        font-size: var(--text-bac-4-size);
        font-weight: 400;
        line-height: var(--text-bac-4-line-height);
    }

    .bieu-mau-so-luong-chuyen-tuy-chinh {
        grid-template-columns: minmax(0, 1fr) var(--bieu-mau-chuyen-bat-tat-kich-thuoc);
        gap: 10px;
    }

    .bieu-mau-kich-thuoc-chuyen-tuy-chinh {
        grid-template-columns: minmax(0, 1fr) var(--bieu-mau-chuyen-bat-tat-kich-thuoc);
        gap: 10px;
    }

    .bieu-mau-the-hinh-dang,
    .luong-thiet-ke-lua-chon,
    .goi-thiet-ke-chon-phu,
    .bieu-mau-nut-hanh-dong,
    .bieu-mau-hop-gia,
    .bieu-mau-thong-diep-bao-gia,
    .bieu-mau-thong-tin-block {
        border-radius: 16px;
    }

    .luong-thiet-ke-primary {
        height: 44px;
    }

    .luong-thiet-ke-lua-chon {
        gap: 5px;
        padding: 0 10px;
        font-size: var(--text-bac-3-size);
    }

    .luong-thiet-ke-lua-chon.is-active::before {
        font-size: 12px;
    }

    .bieu-mau-the-hinh-dang {
        width: 100%;
        margin: 0;
        min-height: 88px;
        padding: 12px 8px 10px;
    }

    .bieu-mau-hop-gia-tri,
    #bieu-mau-tong-gia {
        font-size: 32px;
    }

    .bieu-mau-nut-hanh-dong {
        width: 100%;
    }

    .bieu-mau-huong-dan-dat-hang {
        width: 100%;
    }

    .bieu-mau-thong-tin-block.bieu-mau-san-pham-thong-so-the {
        margin-bottom: 14px;
        padding: 0;
        border-radius: 0;
    }

    .bieu-mau-thong-tin-block.bieu-mau-san-pham-thong-so-the .bieu-mau-thong-tin-danh-sach-thong-so {
        gap: 12px 16px;
    }

    .luong-thiet-ke-ghi-chu,
    .bieu-mau-kich-thuoc-ghi-chu {
        white-space: normal;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .khung-goi-y {
        padding: 22px 18px 20px;
    }

    .khung-goi-y-thong-diep {
        gap: 10px;
        margin-bottom: 18px;
    }

    .khung-goi-y-thong-diep-tieu-de {
        font-size: var(--text-bac-1-size);
    }

    .khung-goi-y-thong-diep-doan {
        font-size: var(--text-bac-5-size);
    }

    .khung-goi-y-tieu-de-phu {
        font-size: var(--text-bac-5-size);
        letter-spacing: 0;
        white-space: nowrap;
    }

    .khung-goi-y-san-pham {
        grid-template-columns: 84px minmax(0, 1fr);
        gap: 12px;
        padding-top: 16px;
    }

    .khung-goi-y-hinh-anh {
        width: 84px;
        height: 84px;
    }

    .khung-goi-y-tieu-de {
        font-size: var(--text-bac-3-size);
    }

    .khung-goi-y-noi-dung {
        width: 100%;
        justify-self: stretch;
    }

}

@media (max-width: 560px) {
    .bieu-mau-san-pham {
        margin-top: 12px;
    }

    .bieu-mau-luoi-hinh-dang-count-3 .bieu-mau-the-hinh-dang-nhan {
        font-size: 12px;
        white-space: nowrap;
    }

    .single-product .product-main .product-info,
    .single-product .product-main .summary.entry-summary,
    .single-product .product-main > .row.content-row > .entry-summary {
        padding-left: 16px;
        padding-right: 16px;
    }

    .bieu-mau-so-luong-chuyen-tuy-chinh {
        grid-template-columns: minmax(0, 1fr) var(--bieu-mau-chuyen-bat-tat-kich-thuoc);
        gap: 10px;
    }

    .bieu-mau-kich-thuoc-chuyen-tuy-chinh {
        grid-template-columns: minmax(0, 1fr) var(--bieu-mau-chuyen-bat-tat-kich-thuoc);
        gap: 10px;
    }

    .bieu-mau-kich-thuoc-luoi {
        flex-direction: row;
        gap: var(--bieu-mau-khoang-cach-o);
    }

    .bieu-mau-truong-hang--1,
    .bieu-mau-truong-hang--3 {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
    }

    .bieu-mau-truong-hang--2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .bieu-mau-truong-dau {
        gap: 8px;
    }

    .bieu-mau-thong-tin-block.bieu-mau-san-pham-thong-so-the {
        padding: 12px 14px;
        border-radius: 18px;
    }

    .bieu-mau-truong-tieu-de,
    .bieu-mau-truong-nhom:not(.bieu-mau-kich-thuoc-nhom) > .bieu-mau-truong > .bieu-mau-nhan,
    .bieu-mau-kich-thuoc-nhom .bieu-mau-nhan,
    .bieu-mau-thong-tin-tieu-de {
        font-size: var(--text-bac-2-size);
    }

    .luong-thiet-ke-block {
        margin-bottom: 8px;
    }

    .luong-thiet-ke-secondary {
        gap: 4px;
    }

    .luong-thiet-ke-tai-len-bang {
        gap: 8px;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        padding-left: 14px;
    }

    .luong-thiet-ke-tai-len-bang-thong-diep {
        gap: 5px;
        padding: 10px;
        border-radius: 0;
    }

    .luong-thiet-ke-tai-len-bang-chu {
        max-width: none;
        font-size: var(--text-bac-5-size);
        line-height: var(--text-bac-5-line-height);
    }

    .luong-thiet-ke-tai-len-bang-chu-dam {
        font-size: var(--text-bac-5-size);
        line-height: var(--text-bac-5-line-height);
    }

    .goi-thiet-ke-chon-phu {
        grid-template-columns: 24px minmax(0, 1fr) minmax(118px, max-content);
        column-gap: 10px;
    }

    .goi-thiet-ke-chon-phu::before,
    .goi-thiet-ke-chon-phu.is-active::after {
        width: 20px;
        height: 20px;
    }

    .goi-thiet-ke-chon-phu.is-active::after {
        font-size: 11px;
    }

    .goi-thiet-ke-chon-phu-tieu-de {
        max-width: none;
        font-size: var(--text-bac-3-size);
        line-height: var(--text-bac-3-line-height);
    }

    .goi-thiet-ke-chon-phu-gia {
        min-width: 88px;
        font-size: var(--text-bac-3-size);
        line-height: var(--text-bac-3-line-height);
    }

    .goi-thiet-ke-chon-phu-mo-ta {
        max-width: none;
        width: 100%;
        min-height: 0;
        font-size: var(--text-bac-4-size);
        line-height: var(--text-bac-4-line-height);
    }

    .goi-thiet-ke-chon-phu-chi-tiet-bat-tat {
        gap: 5px;
        font-size: var(--text-bac-4-size);
        line-height: var(--text-bac-4-line-height);
    }

    .goi-thiet-ke-chon-phu-chi-tiet-bieu-tuong {
        width: 17px;
        height: 17px;
        font-size: 10px;
    }

    .goi-thiet-ke-chon-phu-chi-tiet {
        gap: 12px;
        grid-column: 1 / 4;
        max-height: 980px;
        margin-left: 0;
        margin-top: 8px;
        padding: 16px 16px 18px 24px;
        border-radius: 18px;
    }

    .goi-thiet-ke-chon-phu-chi-tiet-luoi {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
    }

    .goi-thiet-ke-chon-phu-chi-tiet-muc {
        gap: 8px;
    }

    .goi-thiet-ke-chon-phu-chi-tiet-muc-cham {
        width: 6px;
        height: 6px;
        margin-top: 7px;
    }

    .goi-thiet-ke-chon-phu-chi-tiet-muc-ban-sao,
    .goi-thiet-ke-chon-phu-chi-tiet-ghi-chu {
        font-size: var(--text-bac-5-size);
        line-height: var(--text-bac-5-line-height);
    }

    .bieu-mau-hop-gia {
        column-gap: 12px;
        padding: 16px 16px 18px;
    }

    .bieu-mau-hop-gia-tri,
    #bieu-mau-tong-gia {
        font-size: 28px;
    }

    .bieu-mau-hop-gia-ghi-chu {
        max-width: none;
        font-size: 11px;
    }
}

@media (max-width: 380px) {
    .bieu-mau-kich-thuoc-luoi,
    .bieu-mau-luoi-hinh-dang {
        gap: var(--bieu-mau-khoang-cach-o);
    }

    .khung-goi-y-san-pham {
        grid-template-columns: 78px minmax(0, 1fr);
        gap: 12px;
        padding-top: 14px;
    }

    .khung-goi-y-hinh-anh {
        width: 78px;
        height: 78px;
    }

    .khung-goi-y-thong-diep-tieu-de {
        font-size: var(--text-bac-1-size);
    }

    .khung-goi-y-thong-diep-doan {
        font-size: var(--text-bac-5-size);
        line-height: var(--text-bac-5-line-height);
    }

    .khung-goi-y-tieu-de-phu {
        font-size: var(--text-bac-5-size);
        line-height: var(--text-bac-5-line-height);
        letter-spacing: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .khung-goi-y-tieu-de {
        font-size: var(--text-bac-3-size);
    }

    .khung-goi-y-noi-dung {
        width: 100%;
        justify-self: stretch;
    }

    .bieu-mau-kich-thuoc-luoi {
        flex-direction: row;
    }

    .bieu-mau-kich-thuoc-nhom .bieu-mau-nhan {
        font-size: var(--text-bac-2-size);
    }

    .luong-thiet-ke-lua-chon {
        gap: 5px;
        padding: 0 8px;
        font-size: var(--text-bac-3-size);
    }

    .luong-thiet-ke-lua-chon.is-active::before {
        font-size: 11px;
    }

    .bieu-mau-nhap,
    #bieu-mau-width,
    #bieu-mau-height,
    #bieu-mau-depth,
    #bieu-mau-so-luong-tuy-chinh {
        font-size: 16px;
    }

    .bieu-mau-the-hinh-dang-goi-y {
        font-size: var(--text-bac-5-size);
    }
}


.bieu-mau-kho-trai {
    display: grid;
    gap: 8px;
    padding: 12px 14px;
    border: 1px solid #e2e5e9;
    border-radius: 12px;
    background: #f8f9fa;
}

.bieu-mau-kho-trai[hidden] {
    display: none;
}

.bieu-mau-kho-trai-dong {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
}

.bieu-mau-kho-trai-nhan {
    color: #666;
}

.bieu-mau-kho-trai-gia-tri {
    color: #222;
    text-align: right;
}

.bieu-mau-kho-trai-ghi-chu {
    color: #777;
    font-size: 13px;
    line-height: 1.45;
}

.bieu-mau-kho-trai-ghi-chu[hidden] {
    display: none;
}