/* MHM UI Fix - Subheader nav button - v1.0 */
.subheader .toogle-nav-wrapper > div:first-child {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-orient: horizontal !important;
    -webkit-box-direction: normal !important;
    -ms-flex-direction: row !important;
    flex-direction: row !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    gap: 8px !important;
    cursor: pointer;
    white-space: nowrap !important;
}
.subheader .toogle-nav-wrapper strong {
    white-space: nowrap !important;
    display: inline !important;
    word-break: keep-all !important;
    -webkit-writing-mode: horizontal-tb !important;
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
    overflow: visible !important;
    font-size: 14px;
    font-weight: 600;
}
.subheader .toogle-nav-wrapper .icon-bar {
    -ms-flex-negative: 0 !important;
    flex-shrink: 0 !important;
    display: -webkit-inline-box !important;
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
    -webkit-box-orient: vertical !important;
    -webkit-box-direction: normal !important;
    -ms-flex-direction: column !important;
    flex-direction: column !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    -webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
}
.subheader .toogle-nav-wrapper .icon-bar .bar {
    width: 14px !important;
    height: 2px !important;
    display: block !important;
    margin: 2px auto !important;
    border-radius: 2px !important;
    background: currentColor !important;
}

/* Align the top corners of the first product content card with the section above */
#template-product .details-main > .section.sec_tab:first-of-type .product-content.card {
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}

/* Remove the empty header strip on the first product content card so the outer shell stays visually centered */
#template-product .details-main > .section.sec_tab:first-of-type .product-content.card > .title_module_main.heading-bar {
    display: none !important;
}

#template-product .details-main > .section.sec_tab:first-of-type .product-content.card .content > *:first-child {
    margin-top: 0 !important;
}

/* Extend the lower white area to the same outer width as the upper section */
#template-product .details-main > .section.sec_tab:first-of-type > .container {
    background: #fff;
    border-radius: 0.25rem;
}

#template-product .mhm-fallback-specs h3 {
    font-size: 24px;
    line-height: 1.3;
    margin: 0 0 16px;
    color: var(--text-color);
}

#template-product .mhm-fallback-specs table {
    margin-bottom: 24px;
}

@media (min-width: 992px) {
    #template-index .sub_banner--bottom .sub_banner__item.banner.mhm-sim-banner-animated {
        position: relative;
        display: block;
        overflow: hidden;
        border-radius: 14px;
        isolation: isolate;
    }

    #template-index .sub_banner--bottom .sub_banner__item.banner.mhm-sim-banner-animated::before {
        content: "";
        position: absolute;
        top: 16px;
        left: 116px;
        width: 292px;
        height: 102px;
        border-radius: 28px;
        background: linear-gradient(135deg, rgba(255, 255, 255, 0.99), rgba(255, 249, 240, 0.94));
        box-shadow: 0 16px 36px rgba(191, 33, 13, 0.14);
        z-index: 1;
    }

    #template-index .sub_banner--bottom .sub_banner__item.banner.mhm-sim-banner-animated .mhm-sim-banner-copy {
        position: absolute;
        top: 24px;
        left: 148px;
        z-index: 2;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        pointer-events: none;
    }

    #template-index .sub_banner--bottom .sub_banner__item.banner.mhm-sim-banner-animated .mhm-sim-banner-title {
        display: block;
        font-size: 31px;
        font-weight: 900;
        line-height: 1.05;
        letter-spacing: -0.03em;
        background: linear-gradient(90deg, #a70c0c 0%, #ef2f1f 35%, #ffbd47 50%, #ef2f1f 65%, #a70c0c 100%);
        background-size: 220% auto;
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
        text-shadow: 0 8px 20px rgba(222, 48, 24, 0.14);
        animation: mhmSimShine 3.8s linear infinite, mhmSimFloat 5.2s ease-in-out infinite;
    }

    #template-index .sub_banner--bottom .sub_banner__item.banner.mhm-sim-banner-animated .mhm-sim-banner-sub {
        display: block;
        font-size: 15px;
        font-weight: 700;
        line-height: 1.2;
        color: #7b5b1f;
        letter-spacing: 0.02em;
        animation: mhmSimPulse 3.2s ease-in-out infinite;
    }

    #template-index .sub_banner--bottom .sub_banner__item.banner.mhm-sim-banner-animated .mhm-sim-banner-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 32px;
        padding: 0 14px;
        border: 1px solid rgba(221, 172, 71, 0.72);
        border-radius: 999px;
        background: linear-gradient(135deg, rgba(255, 251, 240, 0.98), rgba(255, 244, 214, 0.98));
        box-shadow: 0 10px 24px rgba(214, 163, 49, 0.14);
        color: #c08a19;
        font-size: 13px;
        font-weight: 800;
        letter-spacing: 0.01em;
        animation: mhmSimBadgeGlow 2.6s ease-in-out infinite;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    #template-index .sub_banner--bottom .sub_banner__item.banner.mhm-sim-banner-animated::before {
        left: 108px;
        width: 278px;
    }

    #template-index .sub_banner--bottom .sub_banner__item.banner.mhm-sim-banner-animated .mhm-sim-banner-copy {
        left: 136px;
    }

    #template-index .sub_banner--bottom .sub_banner__item.banner.mhm-sim-banner-animated .mhm-sim-banner-title {
        font-size: 28px;
    }
}

@keyframes mhmSimShine {
    0% {
        background-position: 0% 50%;
    }

    100% {
        background-position: 220% 50%;
    }
}

@keyframes mhmSimFloat {
    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-3px);
    }
}

@keyframes mhmSimPulse {
    0%,
    100% {
        opacity: 0.84;
        transform: translateX(0);
    }

    50% {
        opacity: 1;
        transform: translateX(3px);
    }
}

@keyframes mhmSimBadgeGlow {
    0%,
    100% {
        transform: scale(1);
        box-shadow: 0 10px 24px rgba(214, 163, 49, 0.14);
    }

    50% {
        transform: scale(1.04);
        box-shadow: 0 14px 28px rgba(214, 163, 49, 0.24);
    }
}

@media (min-width: 992px) {
    #template-index .home-banner-group {
        row-gap: 0 !important;
    }

    #template-index .home-banner-left,
    #template-index .home-banner-left .section_slider,
    #template-index .home-banner-left .home-slider {
        margin-bottom: 0 !important;
    }

    #template-index .home-banner-group > .sub_banner--bottom {
        margin-top: 8px !important;
    }

    #template-index .home-banner-left .slick-dots,
    #template-index .home-banner-left .home-slider__dot-fake {
        bottom: 8px !important;
        margin-bottom: 0 !important;
    }
}

#template-index .mhm-sim-recommend-section {
    margin: 18px 0 22px;
}

#template-index .mhm-sim-recommend-section .container {
    padding-top: 0;
    padding-bottom: 0;
    border: 0;
    border-radius: 0;
    background: #fff;
}

#template-index .mhm-sim-recommend-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

#template-index .mhm-sim-recommend-title {
    display: inline-flex;
    flex-direction: column;
    gap: 3px;
    color: #1f2933;
    text-decoration: none !important;
}

#template-index .mhm-sim-recommend-title span {
    color: #d71920;
    font-size: 22px;
    font-weight: 800;
    line-height: 1.2;
}

#template-index .mhm-sim-recommend-title small {
    color: #7b5b1f;
    font-size: 13px;
    font-weight: 600;
}

#template-index .mhm-sim-recommend-all {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 0 16px;
    border-radius: 6px;
    background: #d71920;
    color: #fff !important;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none !important;
    box-shadow: 0 8px 18px rgba(215, 25, 32, 0.18);
}

#template-index .mhm-sim-recommend-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

#template-index .mhm-sim-recommend-card {
    display: flex;
    min-height: 116px;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    padding: 16px;
    border: 1px solid #f1d8c6;
    border-radius: 8px;
    background: #fff;
    color: #2d3748;
    text-decoration: none !important;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

#template-index .mhm-sim-recommend-card:hover {
    transform: translateY(-2px);
    border-color: #d71920;
    box-shadow: 0 12px 24px rgba(215, 25, 32, 0.12);
}

#template-index .mhm-sim-recommend-card strong {
    color: #d71920;
    font-size: 16px;
    line-height: 1.3;
}

#template-index .mhm-sim-recommend-card span {
    color: #4b5563;
    font-size: 13px;
    line-height: 1.45;
}

#template-index .mhm-sim-recommend-section .heading-bar {
    margin-bottom: 12px;
    border-bottom: 1px solid #e9edf2;
}

#template-index .mhm-sim-recommend-section .heading-bar__title .link {
    color: var(--text-color);
    font-size: 20px;
    font-weight: bold;
    text-decoration: none !important;
}

#template-index .mhm-sim-view-all {
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 14px;
    border-radius: 6px;
    background: #e1251b;
    color: #fff !important;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none !important;
}

#template-index .mhm-sim-product-list {
    margin-left: -6px;
    margin-right: -6px;
}

#template-index .mhm-sim-product-list .product-col {
    flex: 0 0 20%;
    max-width: 20%;
    padding: 0 6px;
}

#template-index .mhm-sim-product-card {
    position: relative;
    display: block;
    min-height: 360px;
    padding: 20px 10px 12px;
    border: 1px solid #f0f1f4;
    border-radius: 12px;
    background: #fff;
    color: #1f2933;
    text-decoration: none !important;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06);
    overflow: hidden;
    transition: box-shadow 0.18s ease, transform 0.18s ease;
}

#template-index .mhm-sim-product-list .product-col:first-child .mhm-sim-product-card {
    border-left: 1px solid #f0f1f4;
}

#template-index .mhm-sim-product-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(17, 24, 39, 0.08);
}

#template-index .mhm-sim-hot-label {
    position: absolute;
    top: 0;
    left: 12px;
    z-index: 2;
    min-width: 58px;
    padding: 5px 9px;
    border-radius: 0 0 7px 7px;
    background: #d71920;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
}

#template-index .mhm-sim-card-visual {
    display: block;
    height: 164px;
    margin: 0 auto 13px;
    padding: 9px;
    border: 1px solid #cfe6f7;
    border-radius: 7px;
    background: #fff;
}

#template-index .mhm-sim-plan-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 34px;
    padding: 0 8px;
    border-radius: 5px 5px 0 0;
    color: #fff;
}

#template-index .mhm-sim-provider-mobifone .mhm-sim-plan-head {
    background: #0878c9;
}

#template-index .mhm-sim-provider-viettel .mhm-sim-plan-head {
    background: #00a18f;
}

#template-index .mhm-sim-provider-vinaphone .mhm-sim-plan-head {
    background: #149bd7;
}

#template-index .mhm-sim-plan-head strong {
    color: #fff;
    font-size: 15px;
    font-weight: 900;
    line-height: 1;
}

#template-index .mhm-sim-plan-head span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 66px;
    padding: 3px 8px;
    border-radius: 999px;
    background: #fff;
    font-size: 11px;
    font-weight: 900;
    line-height: 1;
}

#template-index .mhm-sim-provider-mobifone .mhm-sim-plan-head span {
    color: #0878c9;
}

#template-index .mhm-sim-provider-viettel .mhm-sim-plan-head span {
    color: #00a18f;
}

#template-index .mhm-sim-provider-vinaphone .mhm-sim-plan-head span {
    color: #149bd7;
}

#template-index .mhm-sim-plan-icons {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    padding: 10px 0 8px;
}

#template-index .mhm-sim-plan-icons span {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 37px;
    padding: 0 4px;
    border-right: 1px solid #edf2f7;
    color: #56616f;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.25;
    text-align: center;
}

#template-index .mhm-sim-plan-icons span:last-child {
    border-right: 0;
}

#template-index .mhm-sim-plan-note {
    min-height: 48px;
    padding: 8px 6px 0;
    border-top: 1px solid #edf2f7;
    color: #4b5563;
    font-size: 11px;
    line-height: 1.35;
}

#template-index .mhm-sim-plan-note::before {
    content: "\2713  ";
    color: #0aa56a;
    font-weight: 900;
}

#template-index .mhm-sim-product-card .product-info {
    padding: 0;
}

#template-index .mhm-sim-product-card .product-name {
    min-height: 40px;
    margin: 0 0 7px;
    color: var(--text-color);
    font-size: 14px;
    font-weight: bold;
    line-height: 1.4;
}

#template-index .mhm-sim-network {
    min-height: 20px;
    margin-bottom: 7px;
    color: #6c757d;
    font-size: 13px;
    font-weight: 400;
}

#template-index .mhm-sim-product-card .price-box {
    display: block;
}

#template-index .mhm-sim-product-card .price {
    color: var(--price-color);
    font-size: 16px;
    font-weight: bold;
}

#template-index .mhm-sim-promo {
    margin-top: 7px;
    padding: 4px 6px;
    border-radius: 4px;
    background: #dbeafe;
    color: #1d4ed8;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.3;
}

#template-index .mhm-sim-note {
    margin-top: 5px;
    padding: 7px 8px;
    border-radius: 6px;
    background: #f8fafc;
    color: #334155;
    font-size: 12px;
    line-height: 1.35;
}

@media (max-width: 991px) {
    #template-index .mhm-sim-recommend-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #template-index .mhm-sim-product-list {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 0;
        overflow-x: auto;
        overflow-y: hidden;
        padding: 2px 0 10px;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
    }

    #template-index .mhm-sim-product-list .product-col {
        flex: 0 0 42%;
        max-width: 42%;
        min-width: 42%;
        padding: 0 6px;
        scroll-snap-align: start;
    }

    #template-index .mhm-sim-product-card {
        border: 1px solid #edf0f4;
    }

    #template-index .mhm-sim-product-list::-webkit-scrollbar {
        height: 4px;
    }

    #template-index .mhm-sim-product-list::-webkit-scrollbar-thumb {
        border-radius: 999px;
        background: rgba(225, 37, 27, 0.35);
    }
}

@media (max-width: 575px) {
    #template-index .mhm-sim-recommend-head {
        align-items: flex-start;
        flex-direction: column;
    }

    #template-index .mhm-sim-recommend-grid {
        grid-template-columns: 1fr;
    }

    #template-index .mhm-sim-product-list .product-col {
        flex-basis: 72%;
        max-width: 72%;
        min-width: 72%;
    }
}

/* MHM sim mobile horizontal scroll: keep Sim so dep products in one swipeable row */
@media (max-width: 991px) {
    #template-index .mhm-sim-recommend-section {
        overflow: hidden !important;
    }

    #template-index .mhm-sim-product-list,
    #template-index .mhm-sim-recommend-section .mhm-sim-product-list,
    #template-index .mhm-sim-recommend-section .row.product-list {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        gap: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 2px 0 12px !important;
        scroll-snap-type: x mandatory !important;
        -webkit-overflow-scrolling: touch !important;
    }

    #template-index .mhm-sim-product-list > .product-col,
    #template-index .mhm-sim-product-list > [class*="col-"],
    #template-index .mhm-sim-recommend-section .row.product-list > .product-col,
    #template-index .mhm-sim-recommend-section .row.product-list > [class*="col-"] {
        display: block !important;
        flex: 0 0 36% !important;
        width: 36% !important;
        max-width: 36% !important;
        min-width: 36% !important;
        padding-left: 4px !important;
        padding-right: 4px !important;
        scroll-snap-align: start !important;
    }

    #template-index .mhm-sim-product-list .mhm-sim-product-card,
    #template-index .mhm-sim-recommend-section .mhm-sim-product-card {
        height: 100% !important;
        min-height: 0 !important;
        padding: 18px 6px 8px !important;
        border-radius: 8px !important;
        box-shadow: none !important;
    }

    #template-index .mhm-sim-recommend-section .mhm-sim-view-all {
        position: absolute !important;
        left: 50% !important;
        bottom: 0 !important;
        z-index: 2 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 0 !important;
        min-height: 0 !important;
        padding: 7px 20px !important;
        border: 1px solid #d83a34 !important;
        border-radius: 4px !important;
        background: #fff !important;
        color: #d83a34 !important;
        box-shadow: none !important;
        font-size: 14px !important;
        font-weight: 400 !important;
        line-height: 1.5 !important;
        text-decoration: none !important;
        transform: translateX(-50%) !important;
        white-space: nowrap !important;
    }

    #template-index .mhm-sim-recommend-section .mhm-sim-view-all::after {
        content: "\203A" !important;
        display: inline-flex !important;
        align-items: center !important;
        margin-left: 5px !important;
        color: #d83a34 !important;
        font-size: 18px !important;
        font-weight: 300 !important;
        line-height: 1 !important;
    }

    #template-index .mhm-sim-recommend-section {
        position: relative !important;
        padding-bottom: 54px !important;
    }

    #template-index .mhm-sim-recommend-section .heading-bar {
        flex-wrap: nowrap !important;
        gap: 8px !important;
    }

    #template-index .mhm-sim-recommend-section .heading-bar__title .link {
        font-size: 18px !important;
    }

    #template-index .mhm-sim-hot-label {
        left: 7px !important;
        min-width: 46px !important;
        padding: 4px 6px !important;
        font-size: 9px !important;
    }

    #template-index .mhm-sim-card-visual {
        height: 118px !important;
        margin-bottom: 8px !important;
        padding: 6px !important;
    }

    #template-index .mhm-sim-plan-head {
        height: 28px !important;
        padding: 0 5px !important;
    }

    #template-index .mhm-sim-plan-head strong {
        font-size: 12px !important;
    }

    #template-index .mhm-sim-plan-head span {
        min-width: 48px !important;
        padding: 2px 5px !important;
        font-size: 8px !important;
    }

    #template-index .mhm-sim-plan-icons {
        padding: 7px 0 5px !important;
    }

    #template-index .mhm-sim-plan-icons span {
        min-height: 28px !important;
        padding: 0 2px !important;
        font-size: 8px !important;
        line-height: 1.15 !important;
    }

    #template-index .mhm-sim-plan-note {
        min-height: 34px !important;
        padding: 5px 4px 0 !important;
        font-size: 9px !important;
        line-height: 1.25 !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }

    #template-index .mhm-sim-product-card .product-name {
        min-height: 34px !important;
        margin-bottom: 4px !important;
        font-size: 12px !important;
        line-height: 1.35 !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }

    #template-index .mhm-sim-product-card .price {
        font-size: 13px !important;
    }

    #template-index .mhm-sim-promo {
        margin-top: 4px !important;
        padding: 3px 4px !important;
        font-size: 9px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    #template-index .mhm-sim-note {
        margin-top: 4px !important;
        padding: 4px !important;
        font-size: 9px !important;
        line-height: 1.25 !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
    }

    #template-index .mhm-sim-product-list::-webkit-scrollbar,
    #template-index .mhm-sim-recommend-section .row.product-list::-webkit-scrollbar {
        height: 4px !important;
    }

    #template-index .mhm-sim-product-list::-webkit-scrollbar-thumb,
    #template-index .mhm-sim-recommend-section .row.product-list::-webkit-scrollbar-thumb {
        border-radius: 999px !important;
        background: rgba(225, 37, 27, 0.35) !important;
    }
}

@media (max-width: 575px) {
    #template-index .mhm-sim-product-list > .product-col,
    #template-index .mhm-sim-product-list > [class*="col-"],
    #template-index .mhm-sim-recommend-section .row.product-list > .product-col,
    #template-index .mhm-sim-recommend-section .row.product-list > [class*="col-"] {
        flex-basis: 45% !important;
        width: 45% !important;
        max-width: 45% !important;
        min-width: 45% !important;
    }

    #template-index .mhm-sim-card-visual {
        height: 106px !important;
    }

    #template-index .mhm-sim-plan-head strong {
        font-size: 11px !important;
    }
}

/* MHM home product carousel guard: prevent extra products from wrapping into a second row */
@media (min-width: 1200px) {
    #template-index .section_product_tag .row.product-list.carousel:not(.slick-initialized) {
        display: flex !important;
        flex-wrap: nowrap !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        max-height: 390px;
        overflow: hidden !important;
    }

    #template-index .section_product_tag .row.product-list.carousel:not(.slick-initialized) > .product-col {
        flex: 0 0 20% !important;
        max-width: 20% !important;
        min-width: 20% !important;
    }

    #template-index .section_product_tag .row.product-list.carousel:not(.slick-initialized) > .product-col:nth-child(n+6) {
        display: none !important;
    }
}

#template-index .section_product_tag .row.product-list.carousel.slick-initialized {
    overflow: hidden !important;
}

#template-index .section_product_tag .row.product-list.carousel.slick-initialized .slick-list {
    overflow: hidden !important;
}

/* MHM home limit 5: keep product category sections to one clean desktop row */
@media (min-width: 1200px) {
    #template-index .section_product_tag .row.product-list.carousel,
    #template-index .section_product_tag .row.product-list.carousel.slick-initialized,
    #template-index .section_product_tag .row.product-list.carousel.slick-initialized .slick-list {
        max-height: 390px !important;
        overflow: hidden !important;
    }

    #template-index .section_product_tag .row.product-list.carousel:not(.slick-initialized) {
        display: flex !important;
        flex-wrap: nowrap !important;
    }

    #template-index .section_product_tag .row.product-list.carousel:not(.slick-initialized) > .product-col {
        flex: 0 0 20% !important;
        max-width: 20% !important;
        min-width: 20% !important;
    }

    #template-index .section_product_tag .row.product-list.carousel:not(.slick-initialized) > .product-col:nth-of-type(n+6) {
        display: none !important;
    }

    #template-index .section_product_tag .row.product-list.carousel.slick-initialized .slick-track {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        max-height: 390px !important;
        overflow: hidden !important;
    }

    #template-index .section_product_tag .row.product-list.carousel.slick-initialized .slick-slide {
        height: auto !important;
    }

    #template-index .section_product_tag .row.product-list.carousel.slick-initialized .slick-slide > div:nth-child(n+2) {
        display: none !important;
    }
}
/* mhm-cart-modal-zindex-fix: keep add-to-cart popup clickable above its backdrop */
body.opacitycart #popupCartModal.modal.show,
body.opacitycart #popupCartModal[style*="display: block"] {
    z-index: 20010 !important;
    pointer-events: auto !important;
}

body.opacitycart .modal-backdrop.show {
    z-index: 20000 !important;
}

body.opacitycart #popupCartModal .modal-dialog,
body.opacitycart #popupCartModal .modal-content,
body.opacitycart #popupCartModal .close,
body.opacitycart #popupCartModal a,
body.opacitycart #popupCartModal button {
    pointer-events: auto !important;
}
/* mhm-mobile-cart-checkout-safe-area: keep mobile checkout CTA above browser controls */
@media (max-width: 767px) {
    body.cart-available {
        padding-bottom: calc(128px + env(safe-area-inset-bottom, 0px)) !important;
    }

    .cart-sticky-cta {
        left: 0 !important;
        right: 0 !important;
        bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
        z-index: 2147483000 !important;
        padding: 8px 12px 12px !important;
        background: #fff !important;
        box-shadow: 0 -8px 24px rgba(0, 0, 0, 0.16) !important;
        pointer-events: auto !important;
    }

    .cart-sticky-cta .cart-cta {
        min-height: 62px !important;
        align-items: center !important;
    }

    .cart-sticky-cta .btn-proceed-checkout-mobile {
        min-height: 48px !important;
        height: auto !important;
        line-height: 1.25 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        white-space: nowrap !important;
        position: relative !important;
        z-index: 2 !important;
        touch-action: manipulation !important;
    }

    .cart-sticky-cta .totals_price_mobile {
        margin-left: 4px !important;
    }
    .cart-sticky-cta .toggle-delivery {
        min-height: 56px !important;
        justify-content: center !important;
    }
}


/* Codex nav category icon refresh start */
.menu-item__link[href="/collections/tu-lanh"] > i:first-child,
.menu-item__link[href="/collections/may-giat"] > i:first-child {
  width: 24px !important;
  height: 24px !important;
  margin-right: 8px !important;
  display: inline-block !important;
  vertical-align: middle !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 24px !important;
}
.menu-item__link[href="/collections/tu-lanh"] > i:first-child {
  background-image: url("https://theme.hstatic.net/1000063620/1001199704/14/mhm-nav-fridge.png?v=1260") !important;
}
.menu-item__link[href="/collections/may-giat"] > i:first-child {
  background-image: url("https://theme.hstatic.net/1000063620/1001199704/14/mhm-nav-washer.png?v=1260") !important;
}
.menu-item__link[href="/collections/tu-lanh"] > i:first-child:before,
.menu-item__link[href="/collections/may-giat"] > i:first-child:before {
  content: "" !important;
}
.menu-item__link[href="/collections/tu-lanh"] > span,
.menu-item__link[href="/collections/may-giat"] > span,
.menu-item__link[href="/collections/dien-may-gia-dung"] > span,
.menu-item__link[href="/collections/dien-may-gia-dung-2"] > span {
  font-size: 0 !important;
}
.menu-item__link[href="/collections/tu-lanh"] > span:after {
  content: "\2744\FE0F  T\1EE7  l\1EA1nh";
  font-size: 14px !important;
}
.menu-item__link[href="/collections/may-giat"] > span:after {
  content: "\1F9FA  M\E1 y gi\1EB7 t";
  font-size: 14px !important;
}
.menu-item__link[href="/collections/dien-may-gia-dung"] > i:first-child,
.menu-item__link[href="/collections/dien-may-gia-dung-2"] > i:first-child {
  width: 24px !important;
  color: #f39c12 !important;
  font-size: 0 !important;
  line-height: 24px !important;
  display: inline-block !important;
  text-align: center !important;
}
.menu-item__link[href="/collections/dien-may-gia-dung"] > i:first-child:before,
.menu-item__link[href="/collections/dien-may-gia-dung-2"] > i:first-child:before {
  content: "\f015" !important;
  font-family: "Font Awesome 5 Free", "FontAwesome" !important;
  font-weight: 900 !important;
  font-size: 17px !important;
  color: #f39c12 !important;
}
.menu-item__link[href="/collections/dien-may-gia-dung"] > span:after,
.menu-item__link[href="/collections/dien-may-gia-dung-2"] > span:after {
  content: "\1F373  \110 \1ED3  gia d\1EE5 ng";
  font-size: 14px !important;
}
/* Codex nav category icon refresh end */

/* Codex nav category sub icon alignment */
.menu-item__link[href="/collections/tu-lanh"] > span:after,
.menu-item__link[href="/collections/may-giat"] > span:after,
.menu-item__link[href="/collections/dien-may-gia-dung"] > span:after,
.menu-item__link[href="/collections/dien-may-gia-dung-2"] > span:after {
  display: inline-block !important;
  vertical-align: middle !important;
}


/* Codex nav category main icon size */
.menu-item__link[href="/collections/tu-lanh"] > i:first-child,
.menu-item__link[href="/collections/may-giat"] > i:first-child {
  width: 28px !important;
  height: 28px !important;
  margin-left: -2px !important;
  margin-right: 6px !important;
  background-size: 26px 26px !important;
  line-height: 28px !important;
}


/* Codex collection pagination */
.mhm-collection-pagination {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 24px 0 10px !important;
  padding: 8px 0 !important;
  clear: both !important;
}
.mhm-collection-pagination .mhm-page-link {
  min-width: 34px !important;
  height: 34px !important;
  padding: 0 10px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 6px !important;
  background: #fff !important;
  color: #333 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  text-decoration: none !important;
}
.mhm-collection-pagination a.mhm-page-link:hover,
.mhm-collection-pagination .mhm-page-link.is-active {
  background: #ed1c24 !important;
  border-color: #ed1c24 !important;
  color: #fff !important;
}


/* Codex header suggest categories */
#search-header .mhm-header-suggest-tags {
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 7px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}
#search-header .mhm-header-suggest-row {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 6px 15px !important;
  min-height: 18px !important;
}
#search-header .mhm-header-suggest-row--top,
#search-header .mhm-header-suggest-row--bottom {
  justify-content: flex-start !important;
}
#search-header .mhm-header-suggest-tag {
  display: inline-flex !important;
  align-items: center !important;
  color: #fff !important;
  text-decoration: none !important;
  font-family: "Be Vietnam Pro", "Montserrat", "Segoe UI", sans-serif !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  opacity: 1 !important;
  white-space: nowrap !important;
  letter-spacing: .02em !important;
  text-transform: uppercase !important;
  transition: opacity .18s ease, transform .18s ease !important;
}
#search-header .mhm-header-suggest-tag:hover {
  opacity: .92 !important;
  transform: translateY(-1px) !important;
  text-decoration: underline !important;
}
#search-header .mhm-header-suggest-icon {
  display: none !important;
}
@media (min-width: 992px) {
  #search-header .mhm-header-suggest-tags {
    padding-left: 0 !important;
  }
}
@media (max-width: 767px) {
  #search-header .mhm-header-suggest-tags {
    margin-top: 8px !important;
    gap: 7px !important;
  }
  #search-header .mhm-header-suggest-row {
    gap: 7px 13px !important;
  }
  #search-header .mhm-header-suggest-tag {
    font-size: 11px !important;
    letter-spacing: .015em !important;
  }
}

/* Codex header suggest typography polish */
#search-header .mhm-header-suggest-tag {
  font-family: "Be Vietnam Pro", "Montserrat", "Segoe UI", sans-serif !important;
  font-weight: 800 !important;
  letter-spacing: .035em !important;
  -webkit-font-smoothing: antialiased !important;
  text-rendering: geometricPrecision !important;
}
#search-header .mhm-header-suggest-tag span {
  font-family: inherit !important;
}
@media (max-width: 767px) {
  #search-header .mhm-header-suggest-tag {
    letter-spacing: .025em !important;
  }
}


/* Codex phone submenu two columns */
.navigation .mhm-phone-submenu {
  min-width: 760px !important;
  max-width: 840px !important;
  padding: 18px 22px !important;
}
.navigation .mhm-phone-menu-grid {
  display: grid !important;
  grid-template-columns: minmax(220px, 0.9fr) minmax(360px, 1.35fr) !important;
  gap: 28px !important;
  align-items: start !important;
}
.navigation .mhm-phone-menu-col {
  min-width: 0 !important;
}
.navigation .mhm-phone-menu-title {
  margin: 0 0 12px !important;
  color: #1f2933 !important;
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
}
.navigation .mhm-phone-menu-list {
  display: grid !important;
  gap: 8px 10px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.navigation .mhm-phone-brand-list {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.navigation .mhm-phone-hot-list {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
.navigation .mhm-phone-menu-list .submenu__item {
  margin: 0 !important;
  padding: 0 !important;
}
.navigation .mhm-phone-menu-list .link {
  display: flex !important;
  align-items: center !important;
  min-height: 34px !important;
  padding: 7px 10px !important;
  border: 1px solid #edf0f4 !important;
  border-radius: 7px !important;
  background: #fff !important;
  color: #111827 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  text-decoration: none !important;
  transition: color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease !important;
}
.navigation .mhm-phone-hot-list .link {
  border-color: #ffe0df !important;
  background: linear-gradient(180deg, #fff, #fff8f8) !important;
}
.navigation .mhm-phone-menu-list .link:hover {
  color: #ed1c24 !important;
  border-color: #ed1c24 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 8px 18px rgba(237, 28, 36, .10) !important;
}
@media (max-width: 991px) {
  .navigation .mhm-phone-submenu {
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 12px 14px !important;
  }
  .navigation .mhm-phone-menu-grid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
  }
  .navigation .mhm-phone-brand-list,
  .navigation .mhm-phone-hot-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 420px) {
  .navigation .mhm-phone-brand-list,
  .navigation .mhm-phone-hot-list {
    grid-template-columns: 1fr !important;
  }
}


/* Codex phone menu polish */
.navigation .mhm-phone-hot-title {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}
.navigation .mhm-phone-fire {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 16px !important;
  height: 16px !important;
  border-radius: 999px !important;
  background: #fff1e7 !important;
  font-size: 11px !important;
  line-height: 1 !important;
  box-shadow: 0 4px 10px rgba(237, 92, 28, .12) !important;
}
.navigation .mhm-phone-menu-item > .menu-item__link > span {
  color: inherit !important;
}


/* Codex phone submenu cover polish */
.navigation .mhm-phone-menu-item .menu-item__link > span {
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
}
.navigation .mhm-phone-sub-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 15px !important;
  height: 15px !important;
  border-radius: 4px !important;
  background: rgba(47, 128, 237, .10) !important;
  font-size: 11px !important;
  line-height: 1 !important;
  flex: 0 0 15px !important;
}
.navigation .mhm-phone-submenu {
  width: calc(100vw - 245px) !important;
  min-width: 820px !important;
  max-width: none !important;
  min-height: 420px !important;
  background: #fff !important;
  box-shadow: 0 8px 26px rgba(15, 23, 42, .10) !important;
  border-right: 1px solid #e5e7eb !important;
  border-bottom: 1px solid #e5e7eb !important;
  z-index: 30 !important;
}
.navigation .mhm-phone-menu-grid {
  min-height: 370px !important;
}
.navigation .mhm-phone-hot-list {
  padding-bottom: 12px !important;
}
@media (max-width: 991px) {
  .navigation .mhm-phone-submenu {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    box-shadow: none !important;
  }
  .navigation .mhm-phone-menu-grid {
    min-height: 0 !important;
  }
}


/* Codex phone submenu balance width */
@media (min-width: 992px) {
  .navigation .mhm-phone-submenu {
    width: 780px !important;
    min-width: 780px !important;
    max-width: 780px !important;
    min-height: 410px !important;
    padding: 18px 20px !important;
    overflow: visible !important;
    background: #fff !important;
  }
  .navigation .mhm-phone-menu-grid {
    grid-template-columns: 310px 1fr !important;
    gap: 26px !important;
    min-height: 360px !important;
  }
  .navigation .mhm-phone-brand-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .navigation .mhm-phone-hot-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .navigation .mhm-phone-menu-list .link {
    min-height: 32px !important;
    padding: 7px 10px !important;
    font-size: 12px !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }
}
