/*
 * Happiness brand theme
 * Loaded after all first-party frontend styles so legacy colours can be
 * replaced without changing the WebForms markup or layout.
 */

:root {
    --brand-primary: #0098AF;
    --brand-primary-dark: #006473;
    --brand-primary-light: #D5EDEF;
    --brand-primary-soft: #F5FBFC;
    --brand-accent: #EA0000;
    --brand-accent-dark: #B90000;
    --brand-accent-soft: #FFF0F0;
    --text-primary: #17383D;
    --text-secondary: #5E7377;
    --text-light: #FFFFFF;
    --border-light: #D5EDEF;
    --background-page: #F5FBFC;
    --background-white: #FFFFFF;
    --gradient-primary: linear-gradient(135deg, #006473 0%, #0098AF 55%, #35B9C9 100%);
    --gradient-soft: linear-gradient(135deg, #FFFFFF 0%, #F5FBFC 55%, #D5EDEF 100%);
    --gradient-accent: linear-gradient(135deg, #EA0000 0%, #B90000 100%);
    --gradient-cta: linear-gradient(135deg, #006473 0%, #0098AF 70%, #EA0000 140%);
    --gradient-contrast: linear-gradient(135deg, #004E5A 0%, #006473 58%, #007F92 100%);
    --shadow-soft: 0 8px 24px rgba(0, 100, 115, .10);
    --shadow-hover: 0 14px 32px rgba(0, 100, 115, .18);
    /* Compatibility with variables already used by the legacy CSS. */
    --default-color-1: var(--brand-primary);
    --default-color-2: var(--brand-primary-dark);
    --default-color-3: var(--brand-accent);
    --default-color-4: var(--brand-primary-light);
    --default-gra: var(--gradient-contrast);
    --isures-sdc-primary: var(--brand-primary);
    --isures-sdc-secondary: var(--brand-primary-soft);
}

/* The six legacy Plus Jakarta files are absent. Rebind their family aliases
 * to existing local Inter files to avoid 404s and unpredictable serif fallbacks. */

@font-face {
    font-family: pb;
    src: url('/Styles/font/MediFrance/Inter/static/Inter-Bold.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: peb;
    src: url('/Styles/font/MediFrance/Inter/static/Inter-ExtraBold.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: pl;
    src: url('/Styles/font/MediFrance/Inter/static/Inter-Light.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: pm;
    src: url('/Styles/font/MediFrance/Inter/static/Inter-Medium.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: pr;
    src: url('/Styles/font/MediFrance/Inter/static/Inter-Regular.ttf') format('truetype');
    font-display: swap;
}

@font-face {
    font-family: psb;
    src: url('/Styles/font/MediFrance/Inter/static/Inter-SemiBold.ttf') format('truetype');
    font-display: swap;
}

html {
    background: var(--background-page);
    color: var(--text-primary);
    scroll-behavior: smooth;
}

body {
    background: var(--background-page);
    color: var(--text-primary);
}

body,
button,
input,
select,
textarea {
    color: var(--text-primary);
}

a {
    color: var(--brand-primary-dark);
    transition: color .2s ease, background-color .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}

::selection {
    background: var(--brand-primary-dark);
    color: var(--text-light);
}

/* Forms: excludes the rendered article/CKEditor content area. */

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="search"],
select,
textarea {
    background-color: var(--background-white);
    border-color: var(--border-light);
    color: var(--text-primary);
    font-size: 16px;
}

    input[type="text"]:focus,
    input[type="email"]:focus,
    input[type="tel"]:focus,
    input[type="number"]:focus,
    input[type="password"]:focus,
    input[type="search"]:focus,
    select:focus,
    textarea:focus {
        outline: none;
    }

    input::placeholder,
    textarea::placeholder {
        color: #789095;
        opacity: 1;
    }

input[type="checkbox"],
input[type="radio"] {
    accent-color: var(--brand-primary);
}

/* Desktop header and navigation. */

.relative-head-top {
    background: var(--brand-primary-dark);
    background: var(--gradient-contrast);
    color: var(--text-light);
}

.middle-header {
    background: var(--gradient-contrast);
}

    .middle-header.fixed,
    .header.stuck .middle-header {
        box-shadow: var(--shadow-soft);
    }

.bottom-header {
    background: var(--text-light);
    color: var(--text-light);
    box-shadow: 0 5px 18px rgba(0, 100, 115, .14);
}

    .menu-top .list > li > a,
    .menu-top a,
    .bottom-header a {
        color: var(--brand-primary-dark);
    }

.menu-top .list > li > a {
    position: relative;
}

    .menu-top .list > li > a:after {
        background: var(--brand-accent);
        bottom: 0;
        content: "";
        height: 3px;
        left: 50%;
        position: absolute;
        transform: translateX(-50%) scaleX(0);
        transition: transform .2s ease;
        width: calc(100% - 24px);
    }

    .menu-top .list > li:hover > a,
    .menu-top .list > li.active > a,
    .menu-top .list > li > a.active {
        background: var(--brand-primary-dark);
        color: var(--text-light);
    }

        .menu-top .list > li:hover > a:after,
        .menu-top .list > li.active > a:after,
        .menu-top .list > li > a.active:after {
            transform: translateX(-50%) scaleX(1);
        }

.menu-top .drop,
.menu-top .submenu,
.menu-top ul ul {
    background: var(--background-white);
    border: 1px solid var(--border-light);
    box-shadow: var(--shadow-soft);
}

    .menu-top .drop a,
    .menu-top .submenu a,
    .menu-top ul ul a {
        color: var(--brand-primary-dark);
    }

        .menu-top .drop a:hover,
        .menu-top .submenu a:hover,
        .menu-top ul ul a:hover {
            background: var(--brand-primary-soft);
            color: var(--brand-accent);
        }

.searchbox .txt,
.header-search__form,
.searchBox-mobile_background__main {
    background: var(--background-white);
    border-color: var(--border-light);
}

    .searchbox .btn,
    .header-search__form a,
    .header-search__form input[type="submit"] {
        background: var(--brand-primary-dark);
        color: var(--text-light);
    }

        .searchbox .btn:hover {
            background: var(--brand-primary-dark);
        }

.countcart,
.countnotice,
.count_cart {
    background: var(--brand-accent);
    color: var(--text-light);
}

.WdiscountProHeader a {
    background: var(--brand-accent);
}

    .WdiscountProHeader a:hover {
        background: var(--brand-accent-dark);
    }

.WHotProHeader a:hover strong,
.WHotlineHeader a:hover strong {
    color: var(--brand-primary-light);
}

.WHotProHeader a:hover .decorIconSvgDiscount svg path {
    fill: var(--brand-accent);
}

.WHotlineHeader a {
    background: var(--gradient-primary);
    border-radius: 10px;
}

.WDecorBackHotHeader svg path {
    fill: var(--gradient-primary);
}

.WDecorBackHotHeader svg stop:first-child {
    stop-color: var(--gradient-primary);
}

.WDecorBackHotHeader svg stop:last-child {
    stop-color: var(--gradient-primary);
}

.WAddressHeaderL svg stop:first-child {
    stop-color: var(--brand-primary);
}

.WAddressHeaderL svg stop:last-child {
    stop-color: var(--brand-primary-dark);
}

.decorIconSvgDiscount svg path,
.decorSvgCartHome svg path {
}

.cart-top,
#search-result,
.box-login {
    background: var(--background-white);
    border: 1px solid var(--border-light);
    box-shadow: var(--shadow-soft);
}

    .cart-top a,
    .box-login a {
        color: #fff;
    }

        .cart-top a:hover,
        #search-result a:hover,
        .box-login a:hover {
            background: var(--brand-primary-soft);
            color: var(--brand-accent);
        }

/* Mobile header and slide-out menu. */

.header-mobile,
.relative-head-top-mobile {
    background: var(--brand-primary-dark);
    background: var(--gradient-contrast);
    color: var(--text-light);
}

    .header-mobile.stuck {
        box-shadow: var(--shadow-soft);
    }

.menu-rs .container-rs {
    background: var(--background-white);
    color: var(--text-primary);
}

.menu-rs.show .container-rs {
    background: var(--background-white);
}

.menu-rs-top {
    background: #fff;
    color: var(--text-light);
}

.menu-rs .container-rs .list .list-item,
.menu-rs .container-rs .list li .drop .drop-item a {
    color: var(--brand-primary-dark);
}

.menu-rs .list li,
.menu-rs .list > a {
    border-color: var(--border-light);
}

.menu-rs .container-rs .list li:hover > .list-item,
.menu-rs .container-rs .list li.show > .list-item,
.menu-rs .container-rs .list .list-item.active {
    background: var(--brand-primary-soft);
    color: var(--brand-accent);
}

.menu-rs .container-rs .list li .drop .drop-item a:hover {
    background: var(--brand-primary-soft);
    color: var(--brand-accent);
}

.login-res-main-menu {
    background: var(--gradient-contrast);
}

.btn-res-login-menu .btn-login-menu {
    background: var(--gradient-contrast);
    color: var(--text-light);
}

.btn-res-login-menu .btn-res-menu {
    background: var(--background-white);
    border-color: var(--brand-primary);
    color: var(--brand-primary-dark);
}

.hotline-menu-rs svg path {
    stroke: var(--brand-accent);
}

.menu-rs-search a {
    background: var(--brand-accent);
}

.menu-icon-social a {
    background: var(--brand-primary-dark);
    color: var(--text-light);
}

.mobile-menu-icon {
    background: var(--brand-accent);
}

    .mobile-menu-icon svg path {
        stroke: var(--text-light);
    }

.searchBox-mobile {
    background: var(--gradient-contrast);
}

.bottom-header-mobile {
    background: var(--gradient-contrast);
}

.name-compa-menu-mm span {
    color: var(--brand-accent);
    display: none;
}

.header-search__form a#ctl00_top_HeadMobile_btnmenurssearch {
    width: 44px;
}

.c-cart .decorSvgCartHome svg path {
    fill: var(--brand-accent);
    stroke: var(--brand-accent);
}

/* Shared section headings. */

.title-category h1,
.title-category h2,
.title-category h3,
.title-category strong,
.title-tab-menu-side h4,
.title-inner-page,
.title-detail,
.title-detail-p h3,
h2.tit-detail-about,
.content-abouts h2,
.content-abouts h3,
.page-post-detail__content > h1 {
    color: var(--brand-primary-dark);
}

.title-category:after,
.tab-title:after {
    background: var(--brand-accent);
}

.title-tab-menu-side > span,
.title-category span,
.desc {
    color: var(--text-secondary);
}

.decorSvgProduct svg path,
.decorNewsSvgHome svg path {
    fill: #FEFA0E;
}

/* Home sections: alternate white, soft aqua and one strong brand treatment. */

.WListWhyMedi {
    background: var(--gradient-soft);
    border-color: var(--border-light);
}

ul.listWhyMedi li {
    border-color: var(--border-light);
}

.RcontentWhyMemi h2 {
    color: var(--brand-primary-dark);
}

.RcontentWhyMemi h4 {
    color: var(--text-secondary);
}

.product-default.product-seller,
.full-product-homee,
.WAboutHome {
    background-color: var(--background-white);
}

    .product-default.product-seller.product-new-home {
        background: var(--brand-primary-soft);
        background: var(--gradient-soft);
    }

    .product-default.product-seller.product-combo-home .title-tab-menu-side h4,
    .product-default.product-seller.product-combo-home .title-tab-menu-side > span,
    .WBackSeller .title-big-seller,
    .WBackSeller .WTitleSeller h4 {
        color: var(--text-light);
    }

.title-big-seller:before,
h1.title-count:before {
    background-image: none;
}

.title-big-seller,
h1.title-count {
    background: var(--brand-primary-dark);
    background: var(--gradient-contrast);
    border-radius: 14px;
    box-shadow: var(--shadow-soft);
}

.WTitleSeller h4 {
    color: var(--text-light);
}

.banner-default.mini-banner-home img {
    border-radius: 14px;
}

.slogan-header-home-mobile .text-highlight {
    color: var(--brand-accent);
}

/* Product-category navigation used on the home banner and filter sidebar. */

.menu-icon {
    display: block;
    width: 1.5rem;
    height: 1.5rem;
    flex: 0 0 24px;
    object-fit: contain;
}

.menu-icon-c2 {
    width: 20px;
    height: 20px;
    flex-basis: 20px;
}

.menu-icon-c3 {
    width: 18px;
    height: 18px;
    flex-basis: 18px;
}

li.nav-item-pro:hover a.nav-link-pro,
.price-side.price-filter ul.list-pro-home li.nav-item-pro a:hover {
    background: #f1f4f8;
    color: var(--text-light);
}

ul.nav-drop-pro.rs {
    background: var(--background-white);
    border-color: var(--border-light);
}

li.drop-item-pro a.drop-link {
    border-color: var(--border-light);
    color: var(--text-primary);
}

li.drop-item-pro:hover a.drop-link {
    background: var(--brand-primary-soft);
    color: var(--brand-accent);
}

/* Product cards. Style the visual card only, not its grid/list wrappers. */

.WContentProChild {
    background: var(--gradient-soft);
}

.WProItemSeller,
.product-side .product-list > li.product {
    background: var(--background-white);
    border: 1px solid var(--border-light);
    border-radius: 14px;
    box-sizing: border-box;
    box-shadow: var(--shadow-soft);
    overflow: hidden;
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

    .WProItemSeller:hover,
    .product-side .product-list > li.product:hover {
        border-color: #9EDCE2;
        box-shadow: var(--shadow-hover);
        transform: translateY(-4px);
    }

    .title-product,
    .title-product a,
    .WProItemSeller .title-product a {
        color: var(--text-primary);
    }

        .product-default ul li:hover .title-product,
        .product-list li:hover .title-product,
        .title-product a:hover {
            color: var(--brand-primary-dark);
        }

.cost-product span,
.cost-product.w-content-price-seller span,
.price-new,
.info_contain .price {
    color: var(--brand-accent);
}

.cost-product p,
.price-old {
    color: #819397;
    text-decoration-color: #819397;
}

.WSellerStarProHome {
}

.product-all-modern-page .WSellerStarProHome {
    border-right: unset;
}

.WSalePercentBestSeller,
.WSalePercent,
.sale,
.hot-pro,
.new-pro {
    background-color: var(--brand-accent);
    color: var(--text-light);
}

.product-default .link-cart,
.product-list li .link-cart {
    background: var(--brand-primary-dark);
    color: var(--text-light);
}

    .product-default .link-cart:hover,
    .product-list li .link-cart:hover {
        background: var(--brand-accent);
        color: var(--text-light);
    }

.link-product-bests-eller a:hover {
    background: var(--brand-accent);
    color: var(--text-light);
}

.link-product-bests-eller svg path,
.decorSvgCartHome svg path {
    fill: var(--text-light);
}

.seller-content-product.swiper[class*="mySwiper"] .swiper-pagination-bullet,
.swiper-pagination-bullet {
    background: var(--border-light);
}

    .seller-content-product.swiper[class*="mySwiper"] .swiper-pagination-bullet-active,
    .seller-content-product.swiper[class*="mySwiper"] .swiper-pagination-bullet:hover,
    .swiper-pagination-bullet-active,
    .swiper-pagination-bullet:hover {
        background: var(--brand-primary);
    }

/* Shared buttons and calls to action. */

.btn-detail-flashSale a,
.GuiYkien .btn,
.btn-more span,
.btnReturn,
.btnContinue,
.my-user-btn,
.link-news-child-item a.btn {
    background: var(--brand-primary-dark);
    background: var(--gradient-contrast);
    border-color: transparent;
    border-radius: 8px;
    box-shadow: 0 5px 14px rgba(0, 100, 115, .12);
    color: var(--text-light);
    border-radius: 50px;
}

    .btn-detail-seller a:hover,
    .btn-detail-flashSale a:hover,
    .list-child-link a:hover,
    .GuiYkien .btn:hover,
    .btn-more span:hover,
    .btnReturn:hover,
    .my-user-btn:hover,
    .link-news-child-item a.btn:hover {
        background: var(--brand-primary-dark);
        box-shadow: var(--shadow-hover);
        color: var(--text-light);
        transform: translateY(-2px);
    }

.a-link-product a.addcart,
.processbtn.btnAddCart,
.btnAddCart,
.box-buy .btnBuy,
.btnContinue,
.btthanhtoann input[type="submit"],
.btthanhtoann button,
#btnthanhtoan {
    background: var(--gradient-accent);
    border-color: var(--brand-accent);
    color: var(--text-light);
}

    .link-product-bests-eller a.addcart:hover,
    .a-link-product a.addcart:hover,
    .processbtn.btnAddCart:hover,
    .btnAddCart:hover,
    .box-buy .btnBuy:hover,
    .btnContinue:hover,
    .btthanhtoann input[type="submit"]:hover,
    .btthanhtoann button:hover,
    #btnthanhtoan:hover {
        background: var(--brand-accent-dark);
        box-shadow: 0 10px 22px rgba(185, 0, 0, .2);
        color: var(--text-light);
    }

li.view-full-product {
    background: var(--gradient-contrast);
}

/* Breadcrumb, category sidebar, article and product detail. */

.bread-crums,
.bread-crum,
.breadcrum {
    background: var(--brand-primary-soft);
    color: var(--text-secondary);
}

    .breadcrumb,
    .breadcrumb a,
    .breadcrum a {
        color: var(--brand-primary);
    }

        .breadcrumb a:hover,
        .breadcrum a:hover {
            color: var(--brand-accent);
        }

        .breadcrumb span,
        .breadcrum span,
        .breadcrum span:before {
            color: var(--text-secondary);
        }

.sub-card,
.col-sidebar {
    background: var(--background-white);
    border-color: var(--border-light);
    box-shadow: var(--shadow-soft);
}

.main-category__content--filter .sub-card > p,
.title-category-child-side,
.col-side > h3,
.book-category h3 {
    background: var(--brand-primary-dark);
    background: var(--gradient-contrast);
    border-color: var(--brand-primary);
    color: var(--text-light);
}

    .title-category-child-side h2,
    .col-side > h3 a,
    .book-category h3 a {
        color: var(--text-light);
    }

    .main-category__content--filter .sub-card > p svg path {
        fill: var(--text-light);
    }

.title-left {
    background: var(--brand-primary-soft);
    border-bottom-color: var(--brand-accent);
    color: var(--text-primary);
}

    .title-left span {
        color: var(--brand-primary-dark);
    }

.menu-categories li span,
.col-side .list-content a {
    color: var(--text-primary);
}

.menu-categories li:hover,
.menu-categories li.active,
.col-side .list-content li:hover {
    background: var(--brand-primary-soft);
    border-left-color: var(--brand-primary);
}

    .menu-categories li.active span {
        color: var(--brand-primary-dark);
    }

.col-side .list-content .menu-item:after {
    background: none;
    border-bottom: 2px solid var(--brand-primary);
    border-right: 2px solid var(--brand-primary);
    box-sizing: border-box;
    transform: rotate(-45deg);
}

.col-side .list-content .menu-item.active:after {
    background: none;
    border-color: var(--brand-accent);
}

.col-side .list-content .sub-menu {
    background: var(--brand-primary-soft);
}

    .col-side .list-content .sub-menu li:before {
        background: var(--brand-primary);
        height: 7px;
        top: 10px;
        width: 7px;
    }

    .col-side .list-content .sub-menu li:hover {
        color: var(--brand-accent);
    }

.col-side .list-content .menu-item.active,
.col-side .list-content .menu-item:hover {
    background: var(--brand-primary-soft);
    color: var(--brand-accent);
}

.menuDM li {
    background: var(--background-white);
    border-color: var(--border-light);
    color: var(--text-primary);
}

    .menuDM li a:hover {
        background: var(--brand-primary-soft);
        color: var(--brand-accent);
    }

.page-post-detail__content,
.box-white,
#ctl00_ContentPlaceHolder1_pndetail,
.tab-contain,
.productSpecification_table {
    background: var(--background-white);
    border-color: var(--border-light);
}

.page-post-detail__content {
    box-shadow: var(--shadow-soft);
}

.list-article-category .item,
.article-item {
    background: var(--background-white);
    border: 1px solid var(--border-light);
    border-radius: 12px;
    box-shadow: var(--shadow-soft);
    overflow: hidden;
}

    .list-article-category .item h4,
    .article-item h4 {
        color: var(--text-primary);
    }

    .list-article-category .item:hover h4,
    .article-item:hover h4 {
        color: var(--brand-primary-dark);
    }

.list-same-post h4 {
    color: var(--brand-primary-dark);
}

.detail-pro .tab-link,
.a-swip-tab {
    background: var(--background-white);
    border-color: var(--border-light);
    color: var(--text-secondary);
}

    .detail-pro .tab-link.active,
    .active .a-swip-tab,
    .nav-swip-a:hover .a-swip-tab {
        background: var(--brand-primary-dark);
        background: var(--gradient-contrast);
        color: var(--text-light);
    }

.left-detail {
    border-color: var(--border-light);
}

.btn-more span {
    border-color: var(--brand-primary);
}

.side-title-des-pro-child,
.commit-detail,
.pnsales,
.boxes.content-new-detail-child,
.sidebar-new-list {
    background: var(--background-white);
    border-color: var(--border-light);
}

.boxes.content-new-detail-child,
.sidebar-new-list {
    box-shadow: var(--shadow-soft);
    border-radius: 10px;
}

.title-detail-pro-child h3,
.tit-sales,
.tit-commit {
    color: var(--brand-primary-dark);
}

.tit-sales,
.tit-commit {
    background: var(--brand-primary-soft);
    border-color: var(--border-light);
}

.price-old-one {
    color: var(--text-secondary);
}

.detail-pro-cart {
    border-color: var(--border-light);
}

    .detail-pro-cart input.qtyminus:hover,
    .detail-pro-cart input.qtyplus:hover {
        background: var(--brand-primary-dark);
        color: var(--text-light);
    }

.css-1ri80ux .item-container .estore-icon svg path {
    fill: var(--brand-primary);
}

/* Contact and cart. */

.contact-page {
    background: var(--brand-primary-soft);
    background: var(--gradient-soft);
}

.contact .right-content {
    background: rgba(255, 255, 255, .92);
    border: 1px solid var(--border-light);
    border-radius: 16px;
    box-shadow: var(--shadow-soft);
}

.contact .infoCompany,
.infoCompany h3,
.GuiYkien h4,
.infoCompany p {
    color: var(--text-primary);
}

    .infoCompany p em:before {
        border-color: var(--brand-primary);
        color: var(--brand-primary);
    }

.GuiYkien .txt {
    background: var(--background-white);
    border-color: var(--border-light);
    color: var(--text-primary);
}

    .GuiYkien .txt::placeholder {
        color: #789095;
        opacity: 1;
    }

.GuiYkien th {
    color: var(--brand-primary-dark);
}

.GuiYkien .capcha {
    color: var(--text-primary);
}

    .GuiYkien .capcha .button a {
        background: var(--brand-accent);
        color: var(--text-light);
    }

.cart-content-chilld {
    background: var(--brand-primary-soft);
    background: var(--gradient-soft);
}

.col-left-cart,
.col-right-cart,
.table_cart tr {
    background: var(--background-white);
    border-color: var(--border-light);
    box-shadow: var(--shadow-soft);
}

.table_cart td.name {
    color: var(--text-primary);
}

    .table_cart td.name strong,
    .table_cart td.price,
    .table_cart td.price-row {
        color: var(--brand-accent);
    }

.table_cart .textbox a,
.table_cart .txt {
    border-color: var(--border-light);
    color: var(--brand-primary-dark);
}

    .table_cart .textbox a:hover {
        background: var(--brand-primary-dark);
        color: var(--text-light);
    }

.tit-cart {
    border-color: var(--border-light);
    color: var(--brand-primary-dark);
}

.title-category.bill-cart-child h1,
.textmin h4,
.thongtindh h3 {
    color: var(--brand-primary-dark);
}

.leftthanhtoan,
.rightthanhtoan,
.isures-sdc--wrap {
    background: var(--background-white);
    border-color: var(--border-light);
    box-shadow: var(--shadow-soft);
}

.fulltextbox input,
.fulltextbox textarea,
.gift-code .textcode {
    border-color: var(--border-light);
}

    .gift-code .textcode:focus {
        border-color: var(--brand-primary);
    }

.gift-code .btncode {
    background: var(--gradient-contrast);
    color: var(--text-light);
}

    .gift-code .btncode:hover {
        background: var(--brand-accent-dark);
        color: var(--text-light);
    }

.pricett,
.lbTotal {
    color: var(--brand-accent);
}

.thongtindh h3 {
    border-left-color: var(--brand-accent);
}

.isures-sdc--label,
.isures-sdc--code_item {
    color: var(--brand-primary-dark);
}

.isures-sdc--code_item {
    background: var(--brand-primary-soft);
}

    .isures-sdc--code_item:hover {
        background: var(--brand-primary-light);
    }

.thongbaothanhtoan {
    color: var(--brand-primary-dark);
}

.lbMaThongBao {
    color: var(--brand-accent);
}

/* Product detail and search: replace the remaining red/green/yellow legacy accents. */

.top-content .tit-des {
    background: var(--brand-primary-soft);
    color: var(--brand-primary-dark);
}

.title-big,
.title-about {
    color: var(--brand-primary-dark);
}

.title-about {
    border-left-color: var(--brand-accent);
}

.info_contain .contact-us a {
    color: var(--brand-primary-dark);
}

    .info_contain .contact-us a:hover {
        background: var(--brand-primary-soft);
    }

.info_contain .contact-us span {
    background: var(--brand-accent);
    color: var(--text-light);
}

.info_contain .contact-us:hover span {
    background: var(--brand-accent-dark);
}

.info_contain .contact-phone span {
    color: var(--brand-primary-dark);
}

.info_contain .contact-phone:hover span {
    background: var(--brand-primary-dark);
    color: var(--text-light);
}

.Status-ct strong,
.Star-detail-product,
.start {
    color: var(--brand-accent);
}

a.woocommerce-review-link {
    color: var(--brand-primary-dark);
}

    a.woocommerce-review-link:hover {
        color: var(--brand-accent);
    }

._1iFmQA.flase-sale-pro-detail {
    background: var(--gradient-accent);
    color: var(--text-light);
}

.boxes.books-boxes.product-Promo.product-search-childd {
    background: var(--gradient-soft);
}

/* Home news and service blocks still carried high-specificity legacy colours. */

.leftTitleIconNew h3,
.top-cus-parner-home h2 {
    color: var(--brand-primary-dark);
}

span.link-new-l-home,
.list-new1:hover span.link-new-l-home,
.list-new1:hover .news1-name h3,
.newsnth:hover .newsnth-name a {
    color: var(--brand-accent);
}

    span.link-new-l-home svg path,
    .decorSvgNewItem svg path {
        fill: var(--brand-accent);
    }

.W-cus-parner-home {
    background: var(--gradient-soft);
}

/* Voucher, filters, reviews, galleries and checkout page-specific styles. */

.backVoucher {
    background: var(--brand-primary-soft);
    background: var(--gradient-soft);
}

.WTopLadipage h2 a,
.WTopLadipage h3 {
    color: var(--brand-primary-dark);
}

.ComingSoonUuDai h3 a,
a#ctl00_ContentPlaceHolder1_btnFormVoucher {
    background: var(--brand-primary-dark);
    background: var(--gradient-contrast);
    color: var(--text-light);
}

    .ComingSoonUuDai h3 a:hover,
    a#ctl00_ContentPlaceHolder1_btnFormVoucher:hover {
        background: var(--brand-accent-dark);
    }

.price-filter,
.price-side.price-filter {
    background: var(--background-white);
    border-color: var(--border-light);
    box-shadow: var(--shadow-soft);
}

    .price-filter h3,
    .price-side.price-filter h3,
    .price-filter .title,
    .list-trademark-sort h3 {
        color: var(--brand-primary-dark);
        border-color: var(--brand-primary);
        font-family: InterSB;
    }

    .price-options li.active,
    .price-side.price-filter input[type="radio"]:checked + label,
    .trademark-item input[type="radio"]:checked + label {
        background: var(--brand-primary-soft);
    }

.price-options li.active {
    border-left-color: var(--brand-primary);
}

.price-filter input[type="checkbox"] {
    accent-color: var(--brand-primary);
}

.price-side.price-filter input[type="radio"]:checked,
.trademark-item input[type="radio"]:checked {
    background-color: var(--brand-primary);
    border-color: var(--brand-primary);
}

.price-filter label:hover,
.price-side.price-filter label:hover,
.trademark-item label:hover {
    color: var(--brand-primary-dark);
}

.listImage h4 a,
.listVieos h4 a {
    color: var(--brand-primary-dark);
}

    .listImage h4 a:hover,
    .listVieos h4 a:hover {
        color: var(--brand-accent);
    }

.listVieos li .hover {
    background: rgba(0, 100, 115, .86);
}

.decorNewsSvgHome svg circle {
    fill: var(--brand-primary-dark);
}

.decorNewsSvgHome svg ellipse {
    fill: var(--brand-primary);
}

.star_box,
.WReviewCusProChild,
div#review_form,
.devvn_review_box {
    background: var(--background-white);
    border-color: var(--border-light);
}

span.star_average,
.star_box_left > strong,
body.woocommerce #reviews .star-rating,
.woocommerce #reviews .star-rating span:before,
body .devvn_review_mid .star-rating span i,
#review_form .comment-form-rating p.stars.selected a:before {
    color: var(--brand-accent);
}

span.devvn_num_reviews {
    color: var(--brand-primary-dark);
}

#review_form .comment-form-rating p.stars:hover a:before {
    color: var(--brand-accent) !important;
}

#comments a.btn-reviews-now,
.btnReviewSumitForm input,
.woocommerce #review_form #respond p.form-submit input#submit,
.woocommerce #reviews #comments ol.commentlist #respond p.form-submit input#submit {
    background: var(--brand-primary-dark);
    background: var(--gradient-contrast);
    color: var(--text-light);
}

    #comments a.btn-reviews-now:hover,
    .btnReviewSumitForm input:hover,
    .woocommerce #review_form #respond p.form-submit input#submit:hover {
        background: var(--brand-accent-dark);
        color: var(--text-light);
    }

.note_review a,
span.btn-attach,
.devvn_review_bottom a,
.devvn_review_bottom .reply a {
    color: var(--brand-primary);
}

.devvn_cmt_radio label input:checked ~ span:before,
.devvn_cmt_radio label input:checked ~ span:after {
    background: var(--brand-primary);
    border-color: var(--brand-primary);
}

.group-form input,
.group-form textarea {
    border-color: var(--border-light);
    outline-color: var(--brand-primary);
}

.group-form .request {
    color: var(--brand-accent) !important;
}

.group-form strong,
.warning a {
    color: var(--brand-accent);
}

.group-btn input {
    background: var(--brand-primary-dark);
    background: var(--gradient-contrast);
    color: var(--text-light);
}

/* Legacy AboutPage/Divi-like blocks retained by this Web Site. */

.et_pb_section_2.et_pb_section {
    background-color: var(--brand-primary-soft) !important;
}

.et_pb_counter_0 .et_pb_counter_amount,
.et_pb_counter_1 .et_pb_counter_amount,
.et_pb_counter_2 .et_pb_counter_amount {
    background-color: var(--brand-primary) !important;
}

    .et_pb_counter_0 .et_pb_counter_amount.overlay,
    .et_pb_counter_1 .et_pb_counter_amount.overlay,
    .et_pb_counter_2 .et_pb_counter_amount.overlay {
        color: var(--brand-primary) !important;
    }

.et_pb_text_4.et_pb_text a,
.et_pb_text_5.et_pb_text a,
.et_pb_text_6.et_pb_text a {
    color: var(--brand-accent) !important;
}

.et_pb_signup_0.et_pb_subscribe {
    background-color: var(--brand-primary-dark) !important;
}

body #page-container .et_pb_section .et_pb_signup_0.et_pb_subscribe .et_pb_newsletter_button.et_pb_button {
    background-color: var(--brand-accent) !important;
    color: var(--text-light) !important;
}

    body #page-container .et_pb_section .et_pb_signup_0.et_pb_subscribe .et_pb_newsletter_button.et_pb_button:hover {
        background-color: var(--brand-accent-dark) !important;
    }

.NameDesCompaAbout {
    background-color: var(--brand-primary-soft);
}

    .NameDesCompaAbout section strong {
        color: var(--text-primary);
    }

/* Footer. */

footer .middle,
footer .foot {
    background: #004E5A;
    background: var(--gradient-contrast);
    color: var(--text-light);
}

footer .foot {
    border-top: 1px solid rgba(255, 255, 255, .18);
}

footer,
footer p,
footer span,
footer .text-footer,
footer .text-footer p,
footer .title-footer-compa h2,
footer .menu-footer .title-footer {
    color: var(--text-light);
}

    footer a,
    footer .text-footer a {
        color: var(--brand-primary-soft);
    }

        footer a:hover,
        footer .text-footer a:hover,
        .menu-footer li:hover a {
            color: #333;
            text-decoration: underline;
        }

    footer .menu-footer .title-footer,
    footer .title-footer-compa h2 {
        position: relative;
    }

        footer .menu-footer .title-footer:after,
        footer .title-footer-compa h2:after {
            background: var(--brand-accent);
            border-radius: 2px;
            content: "";
            display: block;
            height: 3px;
            margin-top: 9px;
            width: 42px;
        }

    footer .socal-link a {
        border-color: rgba(255, 255, 255, .35);
        color: var(--text-light);
    }

        footer .socal-link a:hover {
            background: var(--brand-accent);
            border-color: var(--text-light) !important;
            color: var(--text-light);
        }

            footer .socal-link a:hover i {
                color: var(--text-light);
            }

            footer .socal-link a:hover svg path {
                fill: var(--text-light) !important;
            }

    footer svg path[fill="#985927"] {
        fill: var(--brand-primary-light);
    }

/* ================================================================
   Homepage layout system
   Scoped to .home-page so product/category pages keep their layout.
   ================================================================ */

.home-page {
    background: var(--background-white);
    color: var(--text-primary);
    overflow: clip;
}

    .home-page .home-section {
        box-sizing: border-box;
        padding: 30px 0;
        position: relative;
    }

    .home-page .home-section-white {
        background: var(--gradient-soft);
    }

    .home-page .home-section-soft {
        background: var(--gradient-soft);
    }

    .home-page .container {
        box-sizing: border-box;
    }

    .home-page img {
        max-width: 100%;
    }

    .home-page .home-section-badge {
        background: var(--brand-accent-soft);
        border: 1px solid rgba(234, 0, 0, .16);
        border-radius: 999px;
        color: var(--brand-accent);
        display: inline-flex;
        font-family: 'InterSB', Arial, sans-serif;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: .06em;
        line-height: 1.3;
        padding: 7px 12px;
        text-transform: uppercase;
    }

    /* Trust commitments. */

    .home-page .home-trust {
        padding: 34px 0;
    }

        .home-page .home-trust ul.listWhyMedi {
            align-items: stretch;
            display: grid;
            gap: 18px;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            margin: 0;
            padding: 0;
        }

            .home-page .home-trust ul.listWhyMedi > li {
                background: var(--background-white);
                border: 1px solid var(--border-light);
                border-radius: 16px;
                box-shadow: 0 6px 20px rgba(0, 100, 115, .07);
                box-sizing: border-box;
                display: flex;
                height: 100%;
                list-style: none;
                min-width: 0;
                padding: 22px;
                transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
                width: auto;
            }

        .home-page .home-trust .ItemContentWhyMedi {
            align-items: center;
            display: flex;
            min-width: 0;
            width: 100%;
        }

        .home-page .home-trust .decorSvgWhyMedi {
            align-items: center;
            background: var(--brand-primary-soft);
            border: 1px solid var(--border-light);
            border-radius: 14px;
            display: flex;
            flex: 0 0 62px;
            height: 62px;
            justify-content: center;
        }

            .home-page .home-trust .decorSvgWhyMedi img {
                height: 34px;
                object-fit: contain;
                transition: transform .3s ease;
                width: 34px;
            }

        .home-page .home-trust .RcontentWhyMemi {
            margin-left: 14px;
            min-width: 0;
        }

            .home-page .home-trust .RcontentWhyMemi h3 {
                color: var(--brand-primary-dark);
                font-size: 16px;
                line-height: 1.35;
                margin: 0 0 5px;
                font-weight: bold;
            }

            .home-page .home-trust .RcontentWhyMemi p {
                color: var(--text-secondary);
                font-size: 14px;
                line-height: 1.5;
                margin: 0;
            }

        .home-page .home-trust ul.listWhyMedi > li:hover {
            border-color: var(--brand-primary);
            box-shadow: 0 14px 30px rgba(0, 152, 175, .16);
            transform: translateY(-5px);
        }

            .home-page .home-trust ul.listWhyMedi > li:hover .decorSvgWhyMedi img {
                transform: scale(1.05);
            }

    .home-page .WListWhyMedi.none {
        display: none !important;
    }

    /* Best-selling products and Swiper controls. */

    .home-page .home-best-seller .product-default {
        background: transparent;
    }

    .home-page .home-best-seller .container {
        position: relative;
    }

    .home-page .home-best-seller .title-big-seller {
        background: none;
        border-radius: 0;
        box-shadow: none;
        margin: 0 230px 30px 0;
        padding: 0;
        position: static;
    }

        .home-page .home-best-seller .title-big-seller:before {
            display: none;
        }

    .home-page .home-best-seller .WTitleSeller {
        align-items: flex-start;
    }

    .home-page .home-best-seller .decorSvgProduct {
        align-items: center;
        background: rgba(255, 255, 255, .12);
        border: 1px solid rgba(255, 255, 255, .22);
        border-radius: 14px;
        display: flex;
        flex: 0 0 52px;
        height: 52px;
        justify-content: center;
        margin-right: 16px;
    }

    .home-page .home-best-seller .home-section-badge {
        background: rgba(255, 255, 255, .1);
        border-color: rgba(255, 255, 255, .22);
        color: var(--text-light);
        font-family: 'InterSB';
    }

    .home-page .home-seller-heading h2 {
        color: var(--text-light);
        font-size: clamp(28px, 3vw, 40px);
        line-height: 1.15;
        margin: 10px 0 8px;
        font-family: 'InterSB';
    }

    .home-page .home-seller-heading p {
        color: rgba(255, 255, 255, .82);
        font-size: 15px;
        line-height: 1.55;
        margin: 0;
        font-family: 'InterSB';
    }

    .home-page .home-best-seller .seller-content-product {
        margin-top: 0;
        position: relative;
    }

    .home-page .mySwiperSellerFlase {
        padding: 6px 4px 42px;
    }

    .home-page .home-seller-prev,
    .home-page .home-seller-next {
        background-color: var(--background-white);
        background-size: 11px 18px;
        border: 1px solid var(--border-light);
        border-radius: 50%;
        box-shadow: var(--shadow-soft);
        height: 42px;
        margin-top: -38px;
        width: 42px;
        color: #333;
        font-size: 23px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .home-page .home-seller-prev {
        left: -20px;
    }

    .home-page .home-seller-next {
        right: -20px;
    }

    .home-page .home-seller-pagination {
        bottom: 0;
    }

        .home-page .home-seller-pagination .swiper-pagination-bullet {
            background: rgba(255, 255, 255, .55);
            height: 8px;
            opacity: 1;
            transition: width .3s ease, background-color .3s ease;
            width: 8px;
        }

        .home-page .home-seller-pagination .swiper-pagination-bullet-active {
            background: var(--brand-accent);
            border-radius: 8px;
            width: 28px;
        }

    /* Shared product sections and cards. */

    .home-page .product-item-show {
        display: flex;
        min-width: 0;
    }

    .home-page .WProItemSeller {
        border-radius: 16px;
        display: flex;
        flex-direction: column;
        height: 100%;
        padding-bottom: 0;
        width: 100%;
    }

        .home-page .WProItemSeller .imgproduct {
            aspect-ratio: 1 / 1;
            background: var(--gradient-soft);
            height: auto;
            overflow: hidden;
            position: relative;
        }

            .home-page .WProItemSeller .imgproduct .imgpa {
                display: block;
                height: 100%;
            }

                .home-page .WProItemSeller .imgproduct .imgpa > img:not(.decorProS) {
                    height: 100%;
                    object-fit: contain;
                    transition: transform .3s ease;
                    width: 100%;
                }

        .home-page .WProItemSeller .info-product {
            box-sizing: border-box;
            display: flex;
            flex: 1 1 auto;
            flex-direction: column;
            padding: 2px;
        }

        .home-page .WProItemSeller .title-product a {
            display: -webkit-box;
            font-size: 18px;
            font-weight: 600;
            line-height: 1.45;
            overflow: hidden;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
        }

        .home-page .WProItemSeller .title-height-product {
            color: var(--text-secondary);
            display: -webkit-box;
            font-size: 13px;
            line-height: 1.45;
            min-height: 38px;
            overflow: hidden;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            display: none;
        }

        .home-page .WProItemSeller .bottom-pro {
            margin-top: auto;
        }

        .home-page .WProItemSeller .cost-product {
            align-items: baseline;
            display: flex;
            gap: 5px 9px;
        }

            .home-page .WProItemSeller .cost-product span {
                font-size: 19px;
                font-weight: 700;
            }

            .home-page .WProItemSeller .cost-product p {
                font-size: 14px;
                margin: 0;
            }

        .home-page .WProItemSeller .WSalePercentBestSeller {
            left: 10px;
            right: auto;
            top: 10px;
        }

        .home-page .WProItemSeller .total-comment-num-seller {
            align-items: center;
            display: flex;
            gap: 8px;
        }

        .home-page .WProItemSeller .WNumOutProHome {
            color: var(--text-secondary);
            font-size: 14px;
        }

        .home-page .WProItemSeller .WSaleLinkNumOut {
            margin-left: auto;
        }

        .home-page .WProItemSeller .link-product-bests-eller a {
            align-items: center;
            border-radius: 999px;
            display: flex;
            height: 1.5rem;
            justify-content: center;
            padding: 0;
            transition: transform .3s ease, box-shadow .3s ease, background-color .3s ease;
            width: 1.5rem;
            pointer-events: all;
            cursor: pointer;
        }

        .home-page .WProItemSeller:hover {
            transform: translateY(-6px);
        }

            .home-page .WProItemSeller:hover .imgproduct .imgpa > img:not(.decorProS) {
                transform: scale(1.04);
            }

            .home-page .WProItemSeller:hover .title-product a {
                color: var(--brand-primary);
            }

            .home-page .WProItemSeller:hover .link-product-bests-eller a {
                background: var(--brand-accent);
            }

                .home-page .WProItemSeller:hover .link-product-bests-eller a img {
                    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(3356%) hue-rotate(239deg) brightness(107%) contrast(99%);
                }

    .home-page .home-product-section > .product-combo-home > .container > .btn-detail-seller,
    .home-page .home-product-section .seller-content-product > .btn-detail-seller {
        margin-top: 28px;
    }

    /* Premium treatment for the best-seller and primary category blocks. */

    .home-page .home-best-seller .container {
        z-index: 1;
    }

    .home-page .home-best-seller .WProItemSeller {
        position: relative;
    }

        .home-page .home-best-seller .WProItemSeller:after,
        .home-page .home-product-primary .WProItemSeller:after {
            background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, .58) 48%, transparent 66%);
            content: "";
            inset: 0;
            opacity: 0;
            pointer-events: none;
            position: absolute;
            transform: translateX(-120%);
            transition: transform .6s ease, opacity .3s ease;
            z-index: 2;
        }

        .home-page .home-best-seller .WProItemSeller:hover:after,
        .home-page .home-product-primary .WProItemSeller:hover:after {
            opacity: .55;
            transform: translateX(120%);
        }

    /* Best-seller header and product-card details. */

    .home-page .home-best-seller .title-big-seller {
        align-items: center;
        display: flex;
        gap: 28px;
        justify-content: space-between;
        margin: 0 0 34px;
    }

    .home-page .home-best-seller .WTitleSeller {
        flex: 1 1 auto;
        min-width: 0;
    }

    .home-page .home-seller-header-actions {
        align-items: flex-end;
        display: flex;
        flex: 0 0 auto;
        flex-direction: column;
        gap: 14px;
    }

    .home-page .home-seller-assurances {
        align-items: center;
        display: flex;
        flex-wrap: wrap;
        gap: 9px;
        justify-content: flex-end;
    }

        .home-page .home-seller-assurances span {
            align-items: center;
            background: rgba(255, 255, 255, .08);
            border: 1px solid rgba(255, 255, 255, .17);
            border-radius: 999px;
            color: rgba(255, 255, 255, .9);
            display: inline-flex;
            font-size: 12px;
            gap: 7px;
            min-height: 34px;
            padding: 0 12px;
            font-family: 'InterSB';
        }

        .home-page .home-seller-assurances i {
            color: #FFFFFF;
        }

    .home-page .home-best-seller .home-seller-header-actions .btn-detail-seller {
        position: static;
    }

    .home-page .home-best-seller .home-seller-view-all a:after {
        content: "\2192";
        font-size: 19px;
        line-height: 1;
        transition: transform .3s ease;
        background: #fff;
        width: 24px;
        height: 24px;
        border-radius: 50%;
        color: var(--gs-red);
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .home-page .home-best-seller .home-seller-view-all a:hover:after {
        transform: translateX(4px);
    }

    .home-page .home-best-seller .swiper-slide.product-seller {
        background: transparent;
        display: flex;
        height: auto;
        padding: 3px 0 8px;
    }

    .home-page .home-best-seller .swiper-wrapper {
        align-items: stretch;
    }

    .home-page .home-best-seller .home-seller-card {
        border-color: rgba(213, 237, 239, .92);
        box-shadow: 0 12px 28px rgba(0, 45, 52, .18);
        overflow: hidden;
    }

        .home-page .home-best-seller .home-seller-card:hover {
            border-color: #FFFFFF;
            box-shadow: 0 22px 42px rgba(0, 38, 45, .28);
        }

        .home-page .home-best-seller .home-seller-card .imgproduct {
            background: linear-gradient(145deg, #FFFFFF 0%, #F5FBFC 58%, #D5EDEF 100%);
        }

    .home-page .home-seller-card-badge {
        align-items: center;
        background: rgba(0, 100, 115, .92);
        border: 1px solid rgba(255, 255, 255, .7);
        border-radius: 999px;
        color: #FFFFFF;
        display: inline-flex;
        font-size: 11px;
        font-weight: 700;
        gap: 5px;
        line-height: 1;
        padding: 7px 9px;
        pointer-events: none;
        position: absolute;
        right: 10px;
        top: 10px;
        z-index: 4;
        font-family: InterSB;
    }

        .home-page .home-seller-card-badge i {
            color: #FFFFFF;
        }

    .home-page .home-best-seller .home-seller-card h3.title-product {
        margin: 0;
    }

    .home-page .home-best-seller .home-seller-card .title-product a {
        font-size: 15px;
        line-height: 1.42;
    }

    .home-page .home-seller-next:hover {
        background: #333;
        color: #fff;
    }

    .home-page .home-seller-prev:hover {
        background: #333;
        color: #fff;
    }

    .home-page .home-best-seller .home-seller-card .bottom-pro {
        border-top: 1px solid var(--border-light);
        margin-top: 12px;
        padding-top: 13px;
    }

    .home-page .home-best-seller .home-seller-card .cost-product span {
        font-size: 19px;
    }

    .home-page .home-best-seller .home-seller-card .total-comment-num-seller {
        align-items: center;
        display: grid;
        gap: 4px 8px;
        grid-template-columns: minmax(0, 1fr) auto;
        margin-top: 10px;
        margin-bottom: 6px;
    }

    .home-page .home-best-seller .home-seller-card .WSellerStarProHome {
        grid-column: 1;
        grid-row: 1;
        padding: 0;
    }

    .home-page .home-best-seller .home-seller-card .WNumOutProHome {
        grid-column: 1;
        grid-row: 2;
    }

        .home-page .home-best-seller .home-seller-card .WNumOutProHome i {
            color: var(--brand-primary);
            margin-right: 3px;
        }

    .home-page .home-best-seller .home-seller-card .WSaleLinkNumOut {
        grid-column: 2;
        grid-row: 1 / span 2;
        margin: 0;
    }

    .home-page .home-best-seller .home-seller-card .link-product-bests-eller a {
        gap: 7px;
        overflow: hidden;
        padding: 0 12px;
        width: auto;
    }

    .home-page .home-best-seller .home-seller-card .home-cart-label {
        color: #FFFFFF;
        font-size: 12px;
        font-weight: 700;
        white-space: nowrap;
        display: none;
    }

    .home-page .home-best-seller .home-seller-card .WSalePercentBestSeller {
        display: block;
        left: 10px;
        right: auto;
        top: 10px;
        z-index: 5;
        border-radius: 20px;
    }

        .home-page .home-best-seller .home-seller-card .WSalePercentBestSeller .new {
            background: var(--brand-accent);
            color: #FFFFFF;
        }

    .home-page .home-product-section .product-async-shell,
    .home-page .home-product-section .product-results {
        min-height: 280px;
        position: relative;
    }

    .home-page .home-product-section.is-loading ul.list-tab-menu-item {
        opacity: .72;
        pointer-events: none;
    }

    .home-page .home-product-section.is-loading .product-results {
        filter: saturate(.75);
    }

    .home-page .home-product-section .product-loading-state {
        align-items: center;
        backdrop-filter: blur(4px);
        background: rgba(245, 251, 252, .78);
        border: 1px solid rgba(213, 237, 239, .85);
        border-radius: 16px;
        color: var(--brand-primary-dark);
        display: flex;
        flex-direction: column;
        font-size: 14px;
        font-weight: 600;
        gap: 12px;
        inset: 0;
        justify-content: center;
        min-height: 220px;
        position: absolute;
        z-index: 20;
    }

    .home-page .home-product-section .product-loading-spinner {
        animation: happiness-loader-spin .75s linear infinite;
        border: 3px solid var(--border-light);
        border-radius: 50%;
        border-right-color: var(--brand-accent);
        border-top-color: var(--brand-primary);
        height: 38px;
        width: 38px;
    }

    .home-page .home-product-section .product-grid-refresh {
        animation: happiness-products-enter .38s ease both;
    }

@keyframes happiness-loader-spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes happiness-products-enter {
    from {
        opacity: .15;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.home-page .home-product-primary .WProItemSeller {
    background: rgba(255, 255, 255, .96);
    isolation: isolate;
}

    .home-page .home-product-primary .WProItemSeller:hover {
        border-color: var(--brand-primary);
        box-shadow: 0 18px 38px rgba(0, 100, 115, .18);
    }

    .home-page .home-product-primary .WProItemSeller .imgproduct:after {
        background: linear-gradient(90deg, var(--brand-primary), var(--brand-accent));
        bottom: 0;
        content: "";
        height: 3px;
        left: 50%;
        position: absolute;
        transform: translateX(-50%) scaleX(0);
        transition: transform .3s ease;
        width: 76%;
    }

    .home-page .home-product-primary .WProItemSeller:hover .imgproduct:after {
        transform: translateX(-50%) scaleX(1);
    }

/* Promotional banners. */

.home-page .home-promo-banners {
    background: #fff;
    padding: 36px 0 36px;
}

    .home-page .home-promo-banners .ListBannerTopHome {
        gap: 20px;
    }

        .home-page .home-promo-banners .ListBannerTopHome a {
            border: 1px solid var(--border-light);
            border-radius: 18px;
            box-shadow: var(--shadow-soft);
            display: block;
            overflow: hidden;
            position: relative;
            transition: transform .35s ease, box-shadow .35s ease, border-color .35s ease;
            width: 100%;
            height: 100%;
        }

            .home-page .home-promo-banners .ListBannerTopHome a:after {
                background: linear-gradient(0deg, rgba(0, 100, 115, .15), transparent 42%);
                bottom: 0;
                content: "";
                left: 0;
                opacity: .45;
                pointer-events: none;
                position: absolute;
                right: 0;
                top: 0;
                transition: opacity .35s ease;
            }

    .home-page .home-promo-banners img {
        aspect-ratio: auto;
        border-radius: 0;
        display: block;
        height: 100%;
        object-fit: cover;
        transition: transform .35s ease;
        width: 100%;
    }

    .home-page .home-promo-banners .ListBannerTopHome a:hover {
        border-color: var(--brand-primary);
        box-shadow: var(--shadow-hover);
        transform: translateY(-3px);
    }

        .home-page .home-promo-banners .ListBannerTopHome a:hover img {
            transform: scale(1.03);
        }

        .home-page .home-promo-banners .ListBannerTopHome a:hover:after {
            opacity: .75;
        }

/* Private consultation CTA. */

.home-page .home-consultation {
    background: var(--background-white);
    padding: 30px 0 30px;
}

.home-page .home-consultation-card {
    align-items: center;
    background: var(--gradient-contrast);
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 22px;
    box-shadow: var(--shadow-hover);
    color: var(--text-light);
    display: grid;
    gap: 24px;
    grid-template-columns: auto minmax(0, 1fr) auto;
    overflow: hidden;
    padding: 34px 38px;
    position: relative;
}

    .home-page .home-consultation-card:after {
        background: var(--brand-accent);
        border-radius: 50%;
        content: "";
        height: 110px;
        opacity: .18;
        position: absolute;
        right: -45px;
        top: -55px;
        width: 110px;
    }

.home-page .home-consultation-icon {
    align-items: center;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 18px;
    display: flex;
    font-size: 30px;
    height: 68px;
    justify-content: center;
    width: 68px;
}

.home-page .home-consultation .home-section-badge {
    background: rgba(255, 255, 255, .1);
    border-color: rgba(255, 255, 255, .22);
    color: var(--text-light);
}

.home-page .home-consultation h2 {
    color: var(--text-light);
    font-size: 28px;
    margin: 10px 0 6px;
    font-family: InterSB;
}

.home-page .home-consultation p {
    color: rgba(255, 255, 255, .84);
    font-size: 15px;
    line-height: 1.55;
    margin: 0;
    font-family: InterM;
}

.home-page .home-consultation-actions {
    display: flex;
    gap: 10px;
    position: relative;
    z-index: 1;
}

    .home-page .home-consultation-actions a {
        align-items: center;
        border: 1px solid rgba(255, 255, 255, .55);
        border-radius: 10px;
        display: inline-flex;
        font-size: 14px;
        font-weight: 700;
        justify-content: center;
        min-height: 46px;
        gap: 7px;
        padding: 0 18px;
        transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease, color .3s ease, background-color .3s ease;
        white-space: nowrap;
    }

.home-page .home-cta-primary {
    background: var(--brand-accent);
    color: var(--text-light);
}

.home-page .home-cta-secondary {
    background: var(--background-white);
    color: var(--brand-primary-dark);
}

.home-page .home-consultation-actions a:hover {
    box-shadow: 0 10px 20px rgba(0, 0, 0, .18);
    transform: translateY(-2px);
}

.home-page .home-cta-primary:hover {
    background: var(--brand-accent-dark);
    color: var(--text-light);
}

.home-page .home-cta-secondary:hover {
    background: var(--brand-primary-soft);
    color: var(--brand-primary-dark);
}

/* Homepage responsive layout. */

@media (max-width: 1280px) {
    .home-page .home-section {
        padding: 64px 0;
    }

    .home-page .home-trust {
        padding: 30px 0;
    }

        .home-page .home-trust ul.listWhyMedi {
            gap: 14px;
        }

            .home-page .home-trust ul.listWhyMedi > li {
                padding: 18px;
            }

    .home-page .home-consultation-card {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .home-page .home-consultation-actions {
        grid-column: 2;
    }
}

@media (max-width: 1024px) {
    .home-page .home-trust ul.listWhyMedi {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-page .home-product-section .product-list-tab-menu,
    .home-page .home-product-section .full-product-home-tab .seller-content-product .product-list-tab-menu {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .home-page .home-seller-prev {
        left: 6px;
    }

    .home-page .home-seller-next {
        right: 6px;
    }
}

@media (max-width: 992px) {
    .home-page .home-section {
        padding: 56px 0;
    }

    .home-page .home-best-seller .title-big-seller {
        align-items: flex-start;
        flex-direction: column;
        gap: 20px;
        margin-right: 0;
    }

    .home-page .home-best-seller .btn-detail-seller {
        position: static;
    }

        .home-page .home-best-seller .btn-detail-seller a {
            margin: 22px auto 0;
        }

    .home-page .home-seller-header-actions {
        align-items: center;
        flex-direction: row;
        justify-content: space-between;
        width: 100%;
        gap: 7px;
    }

    .home-page .home-seller-assurances {
        justify-content: flex-start;
        flex-wrap: nowrap;
    }

    .home-page .home-best-seller .home-seller-view-all a {
        margin: 0;
    }

    .home-page .home-knowledge .list-news {
        grid-template-columns: 1fr;
    }

    .home-page .home-knowledge .news1-image {
        max-height: 100%;
        aspect-ratio: auto;
    }
}

@media (max-width: 767px) {
    .home-page .home-section {
        padding: 46px 0;
    }

    .home-page .container {
        padding-left: 5px;
        padding-right: 5px;
    }

    .home-page .home-trust {
        padding: 24px 0;
    }

        .home-page .home-trust .decorSvgWhyMedi {
            flex-basis: 54px;
            height: 54px;
        }

    .home-page .home-best-seller {
        padding: 52px 0 46px;
    }

        .home-page .home-best-seller .WTitleSeller {
            align-items: center;
            text-align: center;
        }

        .home-page .home-best-seller .decorSvgProduct {
            display: none;
        }

    .home-page .home-seller-heading {
        width: 100%;
    }

        .home-page .home-seller-heading p {
            margin-left: auto;
            margin-right: auto;
            max-width: 520px;
        }

    .home-page .home-best-seller .title-big-seller {
        align-items: center;
    }

    .home-page .home-seller-header-actions {
        gap: 5px;
        align-items: center;
    }

    .home-page .home-seller-assurances {
        justify-content: center;
    }

    .home-page .home-best-seller .home-seller-view-all a {
        margin: 0 auto;
        min-height: 32px;
        font-size: 16px;
    }

    .home-page .home-seller-prev,
    .home-page .home-seller-next {
        display: none;
    }

    .home-page .home-product-section ul.list-tab-menu-item,
    .home-page .home-product-section .full-product-home-tab ul.list-tab-menu-item {
        flex-wrap: nowrap;
        justify-content: flex-start;
        margin-left: -15px;
        margin-right: -15px;
        overflow-x: auto;
        padding: 0 15px 6px;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
        white-space: nowrap;
    }

    .home-page .home-product-section li.menu-item-pro-home a,
    .home-page .home-product-section li.view-full-product a {
        min-height: 39px;
        font-size: 13px;
    }

    .home-page .home-product-section ul.list-tab-menu-item::-webkit-scrollbar {
        display: none;
    }

    .home-page .home-product-primary ul.list-tab-menu-item {
        border-left: 0;
        border-radius: 0;
        border-right: 0;
        box-shadow: none;
        padding-bottom: 9px;
        padding-top: 9px;
    }

    .home-page .home-product-section li.menu-item-pro-home,
    .home-page .home-product-section li.view-full-product {
        scroll-snap-align: start;
    }

    .home-page .home-product-section .product-async-shell,
    .home-page .home-product-section .product-results {
        min-height: 220px;
    }

    .home-page .home-product-section .product-list-tab-menu,
    .home-page .home-product-section .full-product-home-tab .seller-content-product .product-list-tab-menu {
        gap: 14px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .home-page .home-promo-banners.banner-mini-two .ListBannerTopHome {
        gap: 14px;
        grid-template-columns: 1fr;
    }

    .home-page .home-consultation {
        padding: 20px 0 50px;
    }

    .home-page .home-consultation-card {
        grid-template-columns: 1fr;
        padding: 30px 22px;
        text-align: center;
    }

    .home-page .home-consultation-icon {
        margin: 0 auto;
    }

    .home-page .home-consultation h2 {
        font-size: 20px;
    }

    .home-page .home-consultation-actions {
        grid-column: auto;
        justify-content: center;
    }

    .home-page .home-knowledge .title-category-home {
        align-items: flex-start;
        gap: 18px;
    }

    .home-page .home-knowledge .take-news {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Product detail page: a clean commerce layout built on the existing markup. */

.home-page .contain-inner-page-product,
.contain-inner-page-product {
    background: linear-gradient(180deg, var(--background-page) 0%, #FFFFFF 38%, var(--background-page) 100%);
    padding: 24px 0 72px;
}

    .contain-inner-page-product .content-pro-childd {
        min-width: 0;
    }

    .contain-inner-page-product .breadcrumb {
        align-items: center;
        color: var(--text-secondary);
        display: flex;
        flex-wrap: wrap;
        font-size: 13px;
        gap: 7px;
        margin-bottom: 18px;
    }

        .contain-inner-page-product .breadcrumb a {
            color: var(--brand-primary-dark);
            transition: color .2s ease;
        }

            .contain-inner-page-product .breadcrumb a:hover {
                color: var(--brand-accent);
            }

    .contain-inner-page-product .top-detail {
        align-items: stretch;
        display: grid;
        gap: 24px;
        grid-template-columns: minmax(0, 1fr);
    }

    .contain-inner-page-product .list-pro-ll {
        min-width: 0;
    }

    .contain-inner-page-product .c-img-content-pro-child {
        background: var(--background-white);
        border: 1px solid var(--border-light);
        border-radius: 20px;
        box-shadow: var(--shadow-soft);
    }

    .contain-inner-page-product .c-img-content-pro-child {
        padding: 7px;
    }

    .contain-inner-page-product .left-pro-slide-child {
        min-width: 0;
    }

    .contain-inner-page-product .slideShow,
    .contain-inner-page-product .swiper-pro {
        min-width: 0;
    }

    .contain-inner-page-product .swiper-pro {
        background: var(--gradient-soft);
        border-radius: 16px;
        overflow: hidden;
    }

        .contain-inner-page-product .swiper-pro .item-pro a {
            display: block;
        }

        .contain-inner-page-product .swiper-pro .item-pro img:not(.decor-detail-pp) {
            aspect-ratio: 1 / 1;
            object-fit: contain;
            padding: 10px;
            transition: transform .45s ease;
        }

        .contain-inner-page-product .swiper-pro .item-pro:hover img:not(.decor-detail-pp) {
            transform: scale(1.035);
        }

    .contain-inner-page-product .swiper-thumb {
        margin-top: 12px;
        padding: 2px;
    }

        .contain-inner-page-product .swiper-thumb .thumb-pro {
            background: var(--background-white);
            /* border: 1px solid var(--border-light); */
            border-radius: 10px;
            cursor: pointer;
            overflow: hidden;
            opacity: .7;
            transition: border-color .2s ease, opacity .2s ease, transform .2s ease;
        }

            .contain-inner-page-product .swiper-thumb .thumb-pro:hover,
            .contain-inner-page-product .swiper-thumb .swiper-slide-thumb-active {
                border-color: var(--brand-primary);
                opacity: 1;
                transform: translateY(-2px);
            }

            .contain-inner-page-product .swiper-thumb .thumb-pro img {
                aspect-ratio: 1 / 1;
                object-fit: contain;
            }

    .contain-inner-page-product .side-content-product-child {
        padding: 26px;
        padding-left: 5px;
        padding-right: 2px;
        padding-top: 0;
    }

    .contain-inner-page-product .side-title-des-pro-child .title-inner-page {
        color: var(--text-primary);
        font-size: 21px;
        line-height: 1.5;
        margin: 0 0 13px;
    }

    .contain-inner-page-product .info_contain {
        border-bottom: 1px solid var(--border-light);
        padding-bottom: 17px;
    }

    .contain-inner-page-product .WHangMALuotXem {
        align-items: center;
        display: flex;
        flex-wrap: wrap;
        gap: 8px 16px;
    }

    .contain-inner-page-product .ma-sp,
    .contain-inner-page-product .WTinTrangSP {
        color: var(--text-secondary);
        font-size: 15px;
    }

        .contain-inner-page-product .WTinTrangSP .status-yes strong {
            color: #16834b;
        }

        .contain-inner-page-product .WTinTrangSP .status-no strong {
            color: var(--brand-accent);
        }

    .contain-inner-page-product .woocommerce-product-rating {
        align-items: center;
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        margin-top: 12px;
    }

    .contain-inner-page-product .Star-detail-product {
        color: #f2a900;
        letter-spacing: 2px;
    }

    .contain-inner-page-product .woocommerce-review-link {
        color: var(--text-secondary);
        font-size: 14px;
    }

    .contain-inner-page-product .detail-pro-cart {
        background: var(--gradient-soft);
        border: 1px solid var(--border-light);
        border-radius: 14px;
        margin-top: 5px;
        padding: 7px;
    }

        .contain-inner-page-product .detail-pro-cart .price-new,
        .contain-inner-page-product #ctl00_ContentPlaceHolder1_lbPriceNew {
            color: var(--brand-accent);
            font-size: 24px;
            font-weight: 800;
        }

    .contain-inner-page-product .price-old-one,
    .contain-inner-page-product #ctl00_ContentPlaceHolder1_lbPriceOld {
        color: var(--text-secondary);
        font-size: 16px;
        text-decoration: line-through;
    }

    .contain-inner-page-product .detail-pro-btn,
    .contain-inner-page-product .detail-pro-cart button,
    .contain-inner-page-product .detail-pro-cart input[type="submit"] {
        background: var(--gradient-cta);
        border: 0;
        border-radius: 10px;
        box-shadow: 0 10px 22px rgba(0, 100, 115, .18);
        color: var(--text-light);
        font-weight: 700;
        min-height: 35px;
        transition: box-shadow .25s ease, transform .25s ease;
    }

        .contain-inner-page-product .detail-pro-btn:hover,
        .contain-inner-page-product .detail-pro-cart button:hover,
        .contain-inner-page-product .detail-pro-cart input[type="submit"]:hover {
            box-shadow: 0 14px 28px rgba(0, 100, 115, .28);
            transform: translateY(-2px);
        }

    .contain-inner-page-product .title-detail-pro-child,
    .contain-inner-page-product .boxes.content-new-detail-child {
        margin-top: 10px;
    }

        .contain-inner-page-product .title-detail-pro-child h3 {
            border-bottom: 1px solid var(--border-light);
            color: var(--brand-primary-dark);
            font-size: 20px;
            margin: 0 0 16px;
            padding-bottom: 12px;
        }

        .contain-inner-page-product .title-detail-pro-child .description,
        .contain-inner-page-product .title-detail-pro-child .description p,
        .contain-inner-page-product .title-detail-pro-child .description li {
            color: var(--text-primary);
            font-size: 15px;
            line-height: 1.75;
        }

    .contain-inner-page-product .right-content-pro-child {
        min-width: 0;
    }

@media (min-width: 993px) {
    .contain-inner-page-product .top-detail {
        grid-template-columns: minmax(0, 1.65fr) minmax(340px, 1fr);
    }
}

@media (max-width: 767px) {
    .contain-inner-page-product {
        padding: 15px 0 46px;
    }

    .home-page .WProItemSeller .total-comment-num-seller {
        gap: 3px;
    }

    .home-page .WProItemSeller .WSaleLinkNumOut {
        margin-left: 8px;
    }

    .contain-inner-page-product .c-img-content-pro-child,
    .contain-inner-page-product .side-content-product-child,
    .contain-inner-page-product .title-detail-pro-child {
        border-radius: 14px;
        padding: 5px;
    }

    .side-title-des-pro-child {
        padding: 5px;
    }

    .contain-inner-page-product .detail-pro-cart .price-new,
    .contain-inner-page-product #ctl00_ContentPlaceHolder1_lbPriceNew {
        font-size: 18px;
    }

    .contain-inner-page-product .swiper-pro .item-pro img:not(.decor-detail-pp) {
        padding: 18px;
    }

    .contain-inner-page-product .side-title-des-pro-child .title-inner-page {
        font-size: 16px;
    }
}

@media (max-width: 375px) {
    .contain-inner-page-product .WHangMALuotXem {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }

    .contain-inner-page-product .detail-pro-cart {
        padding: 13px;
    }
}

@media (max-width: 575px) {
    .home-page .home-section {
        padding-top: 21px;
        padding-bottom: 0;
    }

    .home-page .home-product-section .title-tab-menu-side {
        margin-bottom: 5px;
    }

    .home-page .home-trust ul.listWhyMedi {
        gap: 12px;
    }

    .home-page .home-product-section .title-tab-menu-side > span {
        padding: 5px 2px;
    }

    .home-page .home-trust ul.listWhyMedi > li {
        padding: 14px;
    }

    .home-page .home-trust .ItemContentWhyMedi {
        align-items: flex-start;
        flex-direction: column;
    }

    .home-page .home-trust .RcontentWhyMemi {
        margin: 10px 0 0;
    }

        .home-page .home-trust .RcontentWhyMemi h3 {
            font-size: 14px;
        }

        .home-page .home-trust .RcontentWhyMemi p {
            font-size: 13px;
        }

    .home-page .WProItemSeller .info-product {
        padding: 5px;
    }

    .home-page .WProItemSeller .title-product a {
        font-size: 14px;
    }

    .home-page .WProItemSeller .title-height-product {
        font-size: 12px;
    }

    .home-page .home-seller-assurances {
        gap: 4px;
    }

        .home-page .home-seller-assurances span {
            font-size: 11px;
            min-height: 34px;
            padding: 7px 4px;
        }

    .home-page .home-seller-card-badge {
        font-size: 12px;
        padding: 6px 9px;
        right: 9px;
        top: 9px;
    }

    .home-page .home-best-seller .home-seller-card .WSellerStarProHome {
        display: flex;
        gap: 2px;
    }

    .home-page .home-knowledge .title-category-home {
        display: block;
    }

    .home-page .home-knowledge .take-news {
        grid-template-columns: 1fr;
    }

    .home-page .home-consultation-actions {
        /* flex-direction: column; */
    }

        .home-page .home-consultation-actions a {
            width: 100%;
        }
}

/* Knowledge cards: refined interaction layer (kept scoped to the homepage). */

.home-page .home-knowledge .list-new1,
.home-page .home-knowledge .newsnth {
    position: relative;
    isolation: isolate;
}

    .home-page .home-knowledge .list-new1::before,
    .home-page .home-knowledge .newsnth::before {
        background: linear-gradient(120deg, rgba(0, 152, 175, .12), transparent 42%);
        content: "";
        inset: 0;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        transition: opacity .35s ease;
        z-index: -1;
    }

    .home-page .home-knowledge .list-new1:hover::before,
    .home-page .home-knowledge .newsnth:hover::before {
        opacity: 1;
    }

.home-page .home-knowledge .news1 > a {
    color: inherit;
    display: block;
    height: 100%;
    text-decoration: none;
}

.home-page .home-knowledge .news1-image,
.home-page .home-knowledge .newsnth-image {
    background: var(--brand-primary-light);
}

    .home-page .home-knowledge .news1-image::after,
    .home-page .home-knowledge .newsnth-image::after {
        background: linear-gradient(180deg, transparent 52%, rgba(0, 78, 90, .22));
        content: "";
        inset: 0;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        transition: opacity .35s ease;
    }

.home-page .home-knowledge .list-new1:hover .news1-image::after,
.home-page .home-knowledge .newsnth:hover .newsnth-image::after {
    opacity: 1;
}

.home-page .home-knowledge .news1-name h3,
.home-page .home-knowledge .newsnth-name a {
    transition: color .25s ease;
}

.home-page .home-knowledge span.link-new-l-home {
    align-items: center;
    display: inline-flex;
    gap: 5px;
    letter-spacing: .02em;
    transition: color .25s ease, transform .25s ease;
}

.home-page .home-knowledge .newsnth:hover span.link-new-l-home,
.home-page .home-knowledge .list-new1:hover span.link-new-l-home {
    transform: translateX(3px);
}

@media (max-width: 767px) {
    .home-page .home-knowledge {
        padding: 48px 0;
    }

        .home-page .home-knowledge .title-category-home {
            margin-bottom: 22px;
        }

        .home-page .home-knowledge .leftTitleIconNew h2 {
            font-size: clamp(25px, 7vw, 32px);
        }

        .home-page .home-knowledge .leftTitleIconNew p {
            font-size: 14px;
            line-height: 1.55;
        }

        .home-page .home-knowledge .list-news {
            gap: 16px;
        }

        .home-page .home-knowledge .list-new1,
        .home-page .home-knowledge .newsnth {
            border-radius: 14px;
        }

        .home-page .home-knowledge .news1 {
            padding: 12px;
        }

        .home-page .home-knowledge .news1-name h3 {
            font-size: 16px;
            line-height: 1.5;
        }

        .home-page .home-knowledge .take-news {
            gap: 12px;
        }

        .home-page .home-knowledge .newsnth {
            padding: 10px;
        }

        .home-page .home-knowledge .newsnth-name a {
            font-size: 14px;
            line-height: 1.4;
        }
}

@media (max-width: 480px) {
    .home-page .home-knowledge .take-news {
        grid-template-columns: 1fr;
    }

    .home-page .home-knowledge .newsnth {
        display: grid;
        gap: 6px;
        grid-template-columns: 101px minmax(0, 1fr);
        padding: 10px;
    }

    .home-page .home-knowledge .newsnth-image {
        grid-row: span 3;
        margin: 0;
        height: 100%;
    }

    .home-page .home-knowledge .desNewItemHomeR p {
        margin-top: 2px;
    }

    .desNewItemHomeR {
        margin: 0;
    }

    .home-page .home-knowledge .view-r-date-new-h {
        gap: 4px 8px;
    }
}

@media (max-width: 375px) {
    .home-page .home-knowledge {
        padding: 40px 0;
    }

        .home-page .home-knowledge .newsnth {
            grid-template-columns: 92px minmax(0, 1fr);
        }

        .home-page .home-knowledge .WDateNewItem {
            font-size: 10px;
        }
}

@media (max-width: 375px) {
    .home-page .container {
        max-width: 100%;
        width: 100%;
    }

    .home-page .home-trust ul.listWhyMedi {
        grid-template-columns: 1fr;
    }

    .home-page .home-trust .ItemContentWhyMedi {
        align-items: center;
        flex-direction: row;
    }

    .home-page .home-trust .RcontentWhyMemi {
        margin: 0 0 0 12px;
    }

    .home-page .home-product-section .product-list-tab-menu,
    .home-page .home-product-section .full-product-home-tab .seller-content-product .product-list-tab-menu {
        gap: 10px;
    }

    .home-page .WProItemSeller .cost-product span {
        font-size: 15px;
    }

    .home-page .WProItemSeller .total-comment-num-seller {
        gap: 4px;
    }

    .home-page .WProItemSeller .link-product-bests-eller a {
        height: 38px;
        width: 38px;
    }

    .home-page .home-best-seller .home-seller-card .link-product-bests-eller a {
        min-width: 40px;
        padding: 0 10px;
    }

    .home-page .home-best-seller .home-cart-label {
        display: none;
    }
}

@media (hover: none) {
    .home-page .WProItemSeller:hover,
    .home-page .home-trust ul.listWhyMedi > li:hover,
    .home-page .home-knowledge .list-new1:hover,
    .home-page .home-knowledge .newsnth:hover,
    .home-page .home-promo-banners .ListBannerTopHome a:hover {
        transform: none;
    }

    .home-page .home-best-seller .WProItemSeller:after,
    .home-page .home-product-primary .WProItemSeller:after {
        display: none;
    }

    .home-page .home-product-primary li.menu-item-pro-home a:hover {
        transform: none;
    }
}

/* Keyboard visibility and motion preferences. */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 3px solid rgba(234, 0, 0, .42);
    outline-offset: 2px;
}

@media (max-width: 1023px) {
    body {
        overflow-x: hidden;
    }

    .WProItemSeller:hover,
    .product-side .product-list > li.product:hover {
        transform: translateY(-3px);
    }

    .title-big-seller,
    h1.title-count {
        border-radius: 12px;
    }

    .product-default.product-seller.product-combo-home,
    .WBackSeller {
        background: transparent;
        background: transparent;
    }
}

@media (max-width: 767px) {
    .header-mobile,
    .relative-head-top-mobile {
        background: var(--brand-primary-dark);
    }

    .WListWhyMedi,
    .contact-page,
    .cart-content-chilld,
    .product-default.product-seller.product-new-home {
        background: var(--brand-primary-soft);
    }

    .GuiYkien .textbox {
        padding-left: 0;
        padding-right: 0;
        width: 100%;
    }

    .btn-detail-seller a,
    .btn-detail-flashSale a,
    .btnContinue {
    }

    footer .middle,
    footer .foot {
        background: #006473;
    }
}

@media (max-width: 480px) {
    html,
    body {
        max-width: 100%;
        min-width: 0;
    }

    .container {
        box-sizing: border-box;
        max-width: 100%;
        width: 100%;
    }

    .menu-rs {
        max-width: 100%;
        width: 100%;
    }

        .menu-rs .container-rs {
            max-width: 88%;
        }

    .modal-filter {
        box-sizing: border-box;
        min-width: 0;
        width: calc(100vw - 24px);
    }

    .title-big-seller,
    h1.title-count,
    .btn-detail-seller a,
    .btn-detail-flashSale a,
    .list-child-link a {
        max-width: 100%;
    }

    .gift-code {
        min-width: 0;
    }

        .gift-code .textcode {
            min-width: 0;
            width: 100%;
        }
}

@media (max-width: 375px) {
    html,
    body {
        min-width: 0;
        width: 100%;
    }

    .container {
        max-width: 100%;
        width: 100%;
    }

    .product-list-tab-menu {
        min-width: 0;
    }

    .WProItemSeller,
    .product-side .product-list > li.product {
        min-width: 0;
    }

    .cost-product.w-content-price-seller span {
        overflow-wrap: anywhere;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *:before,
    *:after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}

/* Article category page redesign. */

.category-modern-page {
    background: var(--background-page);
    color: var(--text-primary);
    min-height: 60vh;
}

.category-modern-hero {
    background: var(--gradient-contrast);
    color: var(--text-light);
    padding: 61px 0 44px;
    position: relative;
    overflow: hidden;
}

    .category-modern-hero::after {
        background: radial-gradient(circle, rgba(53, 185, 201, .32), transparent 68%);
        content: "";
        height: 380px;
        position: absolute;
        right: -100px;
        top: -180px;
        width: 380px;
    }

    .category-modern-hero .container {
        position: relative;
        z-index: 1;
    }

.category-modern-kicker {
    color: #D5EDEF;
    display: inline-flex;
    font-size: 12px;
    font-weight: 800;
    gap: 8px;
    letter-spacing: .12em;
    text-transform: uppercase;
    width: fit-content;
    max-width: 100%;
    padding: 10px 16px;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 999px;
    background: rgba(255, 255, 255, .12);
    box-shadow: 0 14px 34px rgba(0, 0, 0, .16);
    backdrop-filter: blur(8px);
    flex-wrap: wrap;
    line-height: 1.45;
}

    .category-modern-kicker i {
        color: #8BE2E9;
        display: flex;
        align-items: center;
    }

.category-modern-hero h1 {
    color: #FFFFFF;
    font-size: 48px;
    line-height: 1.1;
    margin: 11px 0 10px;
    font-family: 'InterSB';
}

.category-modern-hero p {
    color: rgba(255, 255, 255, .8);
    font-size: 15px;
    line-height: 1.7;
    margin: 0;
    max-width: 600px;
}

.category-modern-content {
    padding: 44px 0 40px;
}

.category-modern-empty {
    background: var(--background-white);
    border: 1px solid var(--border-light);
    border-radius: 12px;
    color: var(--text-secondary);
    display: block;
    padding: 16px;
    text-align: center;
}

.category-modern-list {
    min-width: 0;
}

.category-modern-grid {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0;
    padding: 0;
}

    .category-modern-grid .category-article-card {
        background: transparent;
        border: 0;
        display: block;
        list-style: none;
        margin: 0;
        padding: 0;
    }

.category-article-inner {
    background: var(--background-white);
    border: 1px solid var(--border-light);
    border-radius: 18px;
    box-shadow: var(--shadow-soft);
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease;
}

    .category-article-inner:hover {
        border-color: var(--brand-primary);
        box-shadow: var(--shadow-hover);
        transform: translateY(-6px);
    }

.category-article-image {
    background: var(--gradient-soft);
    height: auto;
    margin: 0;
    overflow: hidden;
    position: relative;
}

    .category-article-image::after {
        background: linear-gradient(180deg, transparent 52%, rgba(0, 78, 90, .22));
        content: "";
        inset: 0;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        transition: opacity .3s ease;
    }

.category-article-inner:hover .category-article-image::after {
    opacity: 1;
}

.category-article-image a {
    display: block;
}

.category-article-image img {
    aspect-ratio: 16 / 9;
    display: block;
    height: auto !important;
    object-fit: cover;
    transition: transform .5s cubic-bezier(.2, .7, .2, 1);
    width: 100% !important;
}

.category-article-inner:hover .category-article-image img {
    transform: scale(1.06);
}

.category-article-content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    padding: 18px 19px 19px;
}

    .category-article-content h4 {
        display: -webkit-box;
        font-size: 18px;
        line-height: 1.35;
        margin: 0 0 9px;
        min-height: 2.7em;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

        .category-article-content h4 a {
            color: var(--text-primary);
            transition: color .25s ease;
        }

.category-article-inner:hover .category-article-content h4 a {
    color: var(--brand-primary-dark);
}

.category-article-content .view_li {
    align-items: center;
    color: var(--text-secondary);
    display: flex;
    font-size: 12px;
    gap: 2px;
    margin: 8px 0 9px;
}

    .category-article-content .view_li i {
        color: var(--brand-primary);
    }

.category-article-content .desc {
    display: -webkit-box;
    flex: 1 1 auto;
    font-size: 13px;
    line-height: 1.6;
    margin: 0 0 14px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}

    .category-article-content .desc a {
        color: var(--text-secondary);
    }

.category-article-content .link-news-child-item {
    margin-top: auto;
}

    .category-article-content .link-news-child-item .btn {
        align-items: center;
        color: #fff;
        display: inline-flex;
        font-size: 12px;
        font-weight: 800;
        gap: 7px;
        letter-spacing: .02em;
        text-transform: uppercase;
    }

        .category-article-content .link-news-child-item .btn span {
            display: inline-flex;
            transition: transform .25s ease;
        }

.category-article-inner:hover .link-news-child-item .btn span {
    transform: translateX(4px);
}

.category-modern-pagination {
    margin-top: 16px;
    text-align: center;
}

    .category-modern-pagination a,
    .category-modern-pagination span {
        align-items: center;
        background: var(--background-white);
        border: 1px solid var(--border-light);
        border-radius: 9px;
        color: var(--brand-primary-dark);
        display: inline-flex;
        font-size: 13px;
        height: 36px;
        justify-content: center;
        margin: 3px;
        min-width: 36px;
        padding: 0 10px;
    }

        .category-modern-pagination a:hover,
        .category-modern-pagination .active {
            background: var(--brand-primary-dark);
            color: #FFFFFF;
        }

@media (max-width: 992px) {
    .category-modern-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .category-modern-hero h1 {
        font-size: 21px;
    }
}

@media (max-width: 575px) {
    .category-modern-hero {
        padding: 33px 0 30px;
    }

    .category-modern-content {
        padding: 30px 0 50px;
    }

    .category-modern-grid {
        gap: 12px;
        grid-template-columns: 1fr 1fr;
    }

    .category-article-content {
        padding: 15px;
    }

        .category-article-content h4 {
            font-size: 17px;
        }
}

/* Best-seller card polish. The existing WebForms bindings and Swiper markup
   remain unchanged; these rules only improve hierarchy and interaction. */

.home-page .home-best-seller .home-seller-card {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    transition: border-color .3s ease, box-shadow .3s ease, transform .3s ease;
}

    .home-page .home-best-seller .home-seller-card .imgproduct {
        flex: 0 0 auto;
        position: relative;
    }

    .home-page .home-best-seller .home-seller-card .imgpa {
        display: block;
        overflow: hidden;
    }

        .home-page .home-best-seller .home-seller-card .imgpa > img:not(.decorProS) {
            transition: transform .45s cubic-bezier(.2, .7, .2, 1), filter .35s ease;
        }

    .home-page .home-best-seller .home-seller-card:hover .imgpa > img:not(.decorProS) {
        filter: saturate(1.06);
        transform: scale(1.055);
    }

    .home-page .home-best-seller .home-seller-card .info-product {
        display: flex;
        flex: 1 1 auto;
        flex-direction: column;
    }

    .home-page .home-best-seller .home-seller-card .title-product {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }

    .home-page .home-best-seller .home-seller-card .title-height-product {
        min-height: 1.45em;
        display: none;
    }

    .home-page .home-best-seller .home-seller-card .link-product-bests-eller a {
        transition: background .25s ease, box-shadow .25s ease, transform .25s ease;
    }

        .home-page .home-best-seller .home-seller-card .link-product-bests-eller a:hover {
            box-shadow: 0 10px 22px rgba(234, 0, 0, .28);
            transform: translateY(-2px) scale(1.02);
        }

@media (max-width: 767px) {
    .home-page .home-best-seller {
        padding-bottom: 48px;
        padding-top: 50px;
    }

    .home-page .WProItemSeller .cost-product span {
        font-size: 16px;
        font-weight: 700;
    }

    .home-page .home-best-seller .title-big-seller {
        margin-bottom: 20px;
    }

    .home-page .home-best-seller .home-seller-card .title-product {
        font-size: 14px;
    }

    .home-page .home-best-seller .home-seller-card .cost-product span {
        font-size: 17px;
    }
}