@font-face {
    font-family: 'happyskin';
    src: url('../fonts/	happyskin.ttf');
}
:root {
    --bg-gradien: linear-gradient(270deg, var(--primary-color) 0, var(--fs-color-primary) 100%);
}
.line_header {
    height: 2px;
    width: 0%;
    background-color: #1b48a3;
    transition: width 0.1s linear;
    z-index: 9;
    position: relative;
}
main#main {
    background-image: url(/wp-content/uploads/2025/02/bg-body.jpg);
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
}
ul.header-nav.header-nav-main.nav.nav-left {
    justify-content: center;
}

ul.header-nav.header-nav-main.nav.nav-left > li > a {
    font-size: 16px;
}
.header-right {
    display: flex;
    align-items: center;
    gap: 20px;
}

i.hs-shopping-bag {
    font-style: normal;
    font-variant: normal;
    font-weight: 400;
    line-height: 1;
    font-family: 'happyskin' !important;
    text-transform: none;
}

i.hs-shopping-bag:before {
    content: "\e91d";
}

.header-right form.searchform button.ux-search-submit {
    position: absolute;
    left: 0;
    background: none;
    border: none;
    color: #000;
    height: 36px;
}

.header-right form.searchform input#woocommerce-product-search-field-0 {
    box-shadow: none;
    border-radius: 99px;
    height: 36px;
    border: 1px solid #444444;
    padding-left: 30px;
    font-size: 15px;
}

.button-cart {
    position: relative;
    transform: translateY(8px);
}

span.bag-count.cart-count {
    border-radius: 9999px;
    background-color: var(--primary-color);
    position: absolute;
    width: 17px;
    height: 17px;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    top: -12px;
    right: -12px;
}
.button-user i.hs-user {
    font-style: normal;
    font-variant: normal;
    font-weight: 400;
    line-height: 1;
    text-transform: none;
    font-family: 'happyskin' !important;
}
.hs-user:before {
    content: "\e921";
}
.button-user i.hs-user {
    width: 20px;
    height: 20px;
    display: block;
    font-size: 20px;
}

.button-user.dropdown {
    position: relative;
}

.button-user.dropdown:before {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    animation: alertNotification 5s infinite;
    transition-duration: .2s;
    transition-property: all;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    border-radius: 9999px;
    background-color: var(--primary-color);
    width: 6px;
    height: 6px;
    pointer-events: none;
    content:
    "";
}
@keyframes alertNotification {
    0%, 100% {
      background-color: #ff2341;
      transform: scale(1);
    }
    50% {
      background-color: #860315;
      transform: scale(1.2);
    }
  }
.header-right form.searchform button.ux-search-submit:hover {
    background: none;
    box-shadow: none;
}
.ss_breadcrumb {
    padding: 12px 0;
}

nav.rank-math-breadcrumb p {
    margin: 0;
    font-size: 14px;
}

nav.rank-math-breadcrumb p span.separator {
    margin: 0 10px;
}

nav.rank-math-breadcrumb 
 span.last,nav.rank-math-breadcrumb a:hover {
    color: var(--primary-color);
}
.pad_none{
    padding-bottom: 0 !important;
}
/* Footer */
.ss_footer 
 .content p {
    margin: 0;
}

.ss_footer a.ux-menu-link__link {
    padding: 0;
}

.ss_footer a.ux-menu-link__link:hover span {
    background-size: 100% 1px;
    background-position-x: left;
    color: var(--primary-color);
}

.ss_footer a.ux-menu-link__link span {
    transition: background-size .35s;
    background: linear-gradient(0deg, var(--primary-color), var(--primary-color)) no-repeat 100% 100% / 0 1px;
}
.absolute-footer {
    padding: 0 !important;
}

.copyright-footer {
    font-size: 16px;
    color: #000;
    border-top: 1px solid #04565b1a;
    padding: 20px 0;
}
.ss_footer .social-icons a {
    margin: 0;
    border: none;
    background: #444444;
    height: 40px;
    width: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}

.ss_footer .social-icons {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
}

.ss_footer .btn_donggop {
    padding: 0 24px;
    height: 44px;
    background-color: #444444 !important;
    color: #fff !important;
    font-weight: 500;
}
/* Home */
.home_slider {
    border-radius: 15px;
    overflow: hidden;
}
.home_tab .nav li a {
    height: 36px;
    padding: 0 16px;
    font-size: 14px;
    border-radius: 99px;
    border: 1px solid var(--primary-color);
    color: var(--primary-color);
}

.home_tab .nav li.active a ,.home_tab .nav li a:hover{
    background-color: var(--primary-color);
    color: #fff;
}
.home_title p {
    font-size: 16px;
    margin-bottom: 10px;
    text-transform: uppercase;
}

.home_title h2 {
    font-size: 30px;
    margin-bottom: 30px;
}
a.button.home_btn {
    padding: 0 24px;
    height: 44px;
    background-color: #444444 !important;;
    font-weight: 500;
    color: #fff !important;;
    margin-bottom: 0;
}

a.button.home_btn i::before {
    content: "\e900";
    font-family: 'happyskin' !important;
}
.home_gallery .box.has-hover.gallery-box {
    border-radius: 15px;
    overflow: hidden;
}

.home_gallery .box.has-hover.gallery-box .box-text {
    padding: 0;
    bottom: 10px;
}

.home_gallery .box.has-hover.gallery-box .box-text p {
    font-size: 16px;
    font-weight: bold;
    color: #ffff;
}
.gallery_doitac .gallery-col.col .box .box-image {
    padding: 12px;
}

.gallery_doitac .gallery-col.col .box {
    background: #fff;
    border-radius: 8px;
}
a.button.btn_hethong {
    height: 44px;
    border-width: 1px;
    font-weight: 500;
    display: flex;
    justify-content: center;
    align-items: center;
}
.list_hethong .col-inner {
    display: flex;
    align-items: center;
    gap: 20px;
    
}

.list_hethong .icon-box {
    padding: 8px;
    border-radius: 4px;
    border: 1px solid var(--primary-color);
    
}
.list_hethong .icon-box img {
    padding: 0;
}

.list_hethong .icon-box p {
    margin: 0;
    font-size: 12px;
    line-height: 18px;
}

.list_hethong .icon-box 
 p.title {
    font-size: 14px;
    font-weight: bold;
    line-height: 22px;
}
.list_hethong .icon-box 
 .icon-inner {
    height: 57px;
    display: inline-flex;
    align-items: center;
}
.home_video p {
    margin: 0;
}

.home_video 
 video {
    border-radius: 10px;
}

.home_video 
 .tiktok-discover {
    position: absolute;
    right: -3.75rem;
    flex-direction: column;
    border-radius: 9999px;
    background-image: url(/wp-content/uploads/2025/02/bg-tiktok-discover.png);
    background-position: 50%;
    background-size: contain;
    background-repeat: no-repeat;
    width: 7rem;
    height: 7rem;
    color: rgb(68 68 68 / var(--tw-text-opacity));
    font-weight: 500;
    font-size: clamp(14px, .875rem, .875rem);
    line-height: 1.3;
    text-align: center;
    display: flex;
    top: -2.75rem;
    justify-content: center;
    align-items: center;
}

.home_video .tiktok-discover p {
    font-size: 14px;
}

.home_video .tiktok-discover p.site-title a {
    font-size: 15px;
    font-weight: 500;
    color: var(--primary-color);
}
.home_video {
    position: relative;
}

.home_video:before {
    position: absolute;
    top: 1.5rem;
    left: .75rem;
    background-image: url(/wp-content/uploads/2025/02/line-double-star-square.png);
    background-position: 50%;
    background-size: contain;
    background-repeat: no-repeat;
    width: 105%;
    height: 105%;
    pointer-events: none;
    content: "";
    z-index: -1;
}
.blog_home .post-item > .col-inner {
    padding: 16px;
    border-radius: 10px;
    overflow: hidden;
}
.blog_home 
 .box  .box-text .news-category.is-green {
    background: #14aa3e;
    color: #fff;
    padding: 3px 9px;
    border-radius: 5px;
    margin-bottom: 9px;
    width: fit-content;
    font-size: 12px;
    font-weight: bold;
}

.blog_home .box .box-text h5.post-title a {
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    overflow: hidden;
    font-size: 16px;
    color: rgb(68, 68, 68);
    font-weight: bold;
}
.blog_home .box .box-image {
    border-radius: 8px;
}
ul.social-follow-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    margin: 0;
}

ul.social-follow-list li {
    margin: 0 !important;
    list-style: none;
    padding: 15px;
    background: #fff;
    border-radius: 10px;
    display: flex;
    align-items: center;
    gap: 10px;
}

ul.social-follow-list li .icon {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    background: linear-gradient(0deg, #ffe8e5, #ffe8e5), #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

ul.social-follow-list li .caption p {
    margin: 0;
    font-size: 14px;
}

ul.social-follow-list li .caption p.count {
    font-size: 18px;
    font-weight: bold;
    color: var(--primary-color);
}

ul.social-follow-list li .icon i {
    font-family: 'happyskin' !important;
    font-size: 24px;
    color: var(--primary-color);
    font-style: inherit;
}
.hs-instagram-fill:before {
    content: "\e944";
}
.hs-facebook-f:before {
    content: "\e90f";
}
.hs-tiktok:before {
    content: "\e920";
}
.hs-youtube:before {
    content: "\e922";
}

/* Page */
.section-title-normal {
    border-bottom: none !important;
    padding: 0;
    margin: 0;
}
.section-title-normal span.section-title-main {
    padding: 0;
    margin: 0;
    border: none;
    text-transform: inherit;
}
.form_contact .wpcf7-form-control {
    border: 1px solid #444444;
    border-radius: 5px;
    height: 44px;
}

.form_contact .wpcf7-form-control.wpcf7-submit {
    border: none;
    text-transform: inherit;
}
.box-support {
    padding: 24px;
    box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 6px 0px 39.7681px 0px;
    border-radius: 15px;
}

.box-support .box-title {
    padding-bottom: 12px;
    font-weight: bold;
    color: var(--primary-color);
    border-bottom: 1px dashed;
    margin-bottom: 12px;
}

.box-support ul.box-list {
    list-style: none;
    margin: 0;
}

.box-support ul.box-list li {
    padding: 10px 0;
    margin: 0;
    color: rgb(68, 68, 68);
}

.box-support ul.box-list li.active a,.box-support ul.box-list li:hover a{
    color: var(--primary-color);
}
h1.entry-title {
    text-transform: inherit;
    color: var(--primary-color);
    font-weight: 700;
    font-size: 24px;
    line-height: 1.3;
}

.page-template-page-left-sidebar .page-inner {
    font-size: 15px;
}
/* Blog */
.news-nav-section ul.menu-list {
    display: flex;
    list-style: none;
    gap: 30px;
    overflow-x: auto;
    overflow-y: none;
    padding: 10px 0 0;
}
ul.menu-list {
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-box-align: stretch;
    align-items: stretch;
}
.news-nav-section ul.menu-list li {
    margin: 0;
}

.news-nav-section ul.menu-list li a {
    padding: 8px 16px 16px;
    font-size: 18px;
    position: relative;
}

.news-nav-section ul.menu-list li a small {
    position: absolute;
    top: 0;
    right: 5px;
    color: rgb(186 186 186);
    font-weight: 600;
    line-height: 1;
}
.news-nav-section ul.menu-list li.active a span{
    font-size: 24px;
    color: var(--primary-color);
}
.news-nav-section ul.menu-list li a:hover{
    color: var(--primary-color);
}
.news-nav-section ul.menu-list li.active a small {
    color: #444444;
    font-size: 14px;
}

.news-nav-section ul.menu-list li.active {
    border-bottom: 1px solid var(--primary-color);
}
.nav-hs-list {
    display: flex;
    align-items: center;
    gap: 30px;
}

.nav-hs-list a {
    padding: 0 32px;
    border: 1px solid var(--primary-color);
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 99px;
    color: var(--primary-color);
}
.sale-off-item .top {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}
.sale-off-item .top .button {
    margin: 0;
    height: 4px;
    font-weight: 500;
    padding: 0 20px;
    border-radius: 99px;
}

.sale-off-item .top .percent {
    font-size: 36px;
    font-weight: bold;
    line-height: 1;
}

.sale-off-item  p {
    margin: 0;
    text-align: center;
}
.sale-off-item .top .button {
    margin: 0;
    height: 4px;
    font-weight: 500;
    padding: 0 20px;
    border-radius: 99px;
}

.sale-off-item .top .percent {
    font-size: 36px;
    font-weight: bold;
    line-height: 1;
}

.sale-off-item  p {
    margin: 0;
    text-align: center;
}
/* Header mn */
.mobile_nav-icon {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}

.mobile_nav-icon .icon {
    width: 25px;
    position: relative;
    text-align: right;
    display: flex;
    justify-content: end;
    flex-flow: column;
    align-items: end;
    gap: 5px;
}

.mobile_nav-icon .icon span {
    position: relative;
    transition: all 0.3s ease-in-out;
    transition-delay: 40ms;
    width: 16px;
    height: 2px;
    background: #fff;
    display: inline-block;
}

.mobile_nav-icon .icon:before,
.mobile_nav-icon .icon:after {
    content: "";
    height: 2px;
    transition: all 0.3s ease-in-out;
    transition-delay: 40ms;
    background: #fff;
    display: inline-block;
}

.mobile_nav-icon .icon:before {
    width: 20px;
}

.mobile_nav-icon .icon:after {
    width: 23px;
}

.mobile_nav-icon.rotate-mb .icon *,
.mobile_nav-icon.rotate-mb .icon:after,
.mobile_nav-icon.rotate-mb .icon:before {
    background-color: var(--second-color);
    width: 25px;
}
div#menu_bar form .search-field {
    border-radius: 4px;
    border: 1px solid var(--primary-color);
}
div#menu_bar form {
    margin-bottom: 15px;
}

div#menu_bar form.searchform button.ux-search-submit {
    width: 20px;
    height: 20px;
    min-height: 20px;
    min-width: 20px;
    font-size: 14px !important;
    padding: 0 !important;
    background: none;
    border: none;
    color: #000;
    line-height: 1;
    top: 0px;
}

div#menu_bar form.searchform .flex-col:last-child {
    width: 20px;
    height: 20px;
    left: auto;
    right: 5px;
    position: absolute;
}
div#menu_bar {
    position: absolute;
    top: 0;
    background: var(--bg-gradien);
    z-index: 99999;
    -webkit-box-shadow: 0 1px 8px #555555;
    -moz-box-shadow: 0 1px 8px #555555;
    -o-box-shadow: 0 1px 8px #555555;
    box-shadow: 0 1px 8px #555555;
    top: 0;
    left: 0;
    width: 280px;
    height: 100vh;
    transform: translateX(-350px);
    transition: .5s;
    padding: 0 15px;
}

div#menu_bar.scroll-menu {
    transform: translateX(0);
    transition: .5s;
}

div#menu_bar .bar_close {
    text-align: center;
    padding: 10px;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
}

div#menu_bar .bar_close i.fa.fa-times {
    font-size: 16px;
    margin-right: 5px;
}

div#menu_bar ul#header_menu>li {
    border: none;
    position: relative;
    margin: 0
}

div#menu_bar ul#header_menu>li:not(:last-child) {
    border-bottom: 1px solid #ffffff;
}

div#menu_bar ul#header_menu>li>a {
    display: block;
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    padding: 7px 10px;
    text-transform: uppercase;
}

div#menu_bar ul#header_menu>li button.toggle {
    position: absolute;
    right: 0;
    margin: 0;
    opacity: 1;
    color: #fff;
    top: 3px
}

div#menu_bar ul.sub-menu {
    border: none;
    padding: 0;
    margin: 0
}

div#menu_bar ul.sub-menu li a {
    color: #fff;
    font-size: 14px;
    height: 34px;
    display: flex;
    align-items: center;
    position: relative
}

div#menu_bar ul.sub-menu li a::before {
    content: "\f0da";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    margin-right: 5px;
    font-size: 14px;
    color: #fff;
}

div#menu_bar ul.sub-menu li {
    list-style: none;
    margin: 0;
    position: relative;
}

div#menu_bar ul#header_menu button.toggle:after {
    content: "\f067";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    margin-right: 5px;
    font-size: 12px;
    color: #fff;
    top: 50%;
    position: absolute;
    left: 50%;
    margin: 0;
    width: 13px;
    height: 13px;
    transform: translate(-50%, -50%)
}

div#menu_bar i.icon-angle-down {
    display: none
}

div#menu_bar ul#header_menu button.toggle {
    width: 30px;
    min-height: 30px;
    height: 30px;
    -webkit-transition: transform .3s ease-out;
    -moz-transition: transform .3s ease-out;
    transition: transform .3s ease-out;
    right: 5px
}

div#menu_bar ul#header_menu .active>.toggle {
    transform: rotate(-180deg);
    -webkit-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg)
}

div#menu_bar ul#header_menu ul.sub-menu {
    -webkit-transform: scaleY(0);
    -ms-transform: scaleY(0);
    transform: scaleY(0);
    max-height: 0;
    -webkit-transition: max-height .3s, -webkit-transform .3s;
    transition: max-height .3s, -webkit-transform .3s;
    -o-transition: max-height .3s, transform .3s;
    transition: max-height .3s, transform .3s;
    transition: max-height .3s, transform .3s, -webkit-transform .3s;
    -webkit-transform-origin: top;
    -ms-transform-origin: top;
    transform-origin: top;
    overflow-y: hidden;
    display: block!important;
    padding-left: 15px!important
}

div#menu_bar ul#header_menu li.active>ul.sub-menu {
    -webkit-transform: scaleY(1);
    -ms-transform: scaleY(1);
    transform: scaleY(1);
    max-height: 100vh
}

html.js.active body {
    overflow: hidden;
}
/* Product */
.product-small.box span.sale_price {
    justify-content: space-between;
    height: 20px;
}
.product-small.box p.box-excerpt {
    -webkit-box-orient: vertical;
    --tw-text-opacity: 1;
    display: -webkit-box;
    margin-top: 8px;
    -webkit-line-clamp: 2;
    overflow: hidden;
    color: rgb(68 68 68 );
    font-weight: 500;
    font-size: 12px;
    line-height: 20px;
    height: 40px !important;
}
.product-small.box .box-text {
    padding: 20px 0 0;
}
.custom_price .sale_price span.woocommerce-Price-amount.amount * {
    font-size: 14px !important;
}
.product-small.box .regular_price * {
    font-size: 12px;
}
.product-small.box .discount_percentage {
    font-size: 12px;
    background: var(--primary-color);
    padding: 0 6px;
    color: #fff;
    line-height: 20px;
    border-radius: 2px;
}
.product-small.box {
    box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 6px 0px 39.7681px 0px;
    padding: 10px;
    border-radius: 8px;
    background: #fff;
}

.product-small.box a.woocommerce-LoopProduct-link.woocommerce-loop-product__link {
    -webkit-box-orient: vertical;
    --tw-text-opacity: 1;
    display: -webkit-box;
    /* height: 36px; */
    -webkit-line-clamp: 2;
    overflow: hidden;
    color: rgb(68 68 68);
    font-weight: 800;
    font-size: 14px;
    line-height: 1.5;
}
.shadown_box,.box-shadow-1,.row-box-shadow-1 .col-inner{
    box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 6px 0px 39.7681px 0px !important;
}

.pad_none{
    padding-bottom: 0 !important;
}
.border_8{
    border-radius: 8px;
    overflow: hidden;
}
.image-tools.absolute.bottom.left.z-3 {
    display: none;
}

.woocommerce-product-gallery__wrapper {
    background-image: linear-gradient(180deg, #ffc8c6, #fedace 35.42%, #feddcf 69.76%, #fee5d2);
    border: 1px solid #ffffff00;
    border-radius: 15px;
    overflow: hidden;
}
.product-thumbnails  a{
    border-radius: 15px;
}
.product-thumbnails .is-selected a {
    border: 1px solid var(--primary-color) !important; 
    border-radius: 15px;
}

.product-thumbnails .col:not(.is-selected) a:hover {border: none;}
.product_info h1.product-title {
    font-size: 20px;
    color: #444444;
    margin-bottom: 4px;
}

.sku-product a {
    font-size: 16px;
    font-weight: bold;
    color: var(--primary-color);
}

.custom_price {
    display: flex;
    flex-flow: column;
}

.custom_price span.regular_price * {
    font-size: 16px;
    line-height: 24px;
    font-weight: 500 !important;
}

.custom_price span.regular_price > span {
    text-decoration: line-through;
}
.custom_price .sale_price {
    display: flex;
    align-items: center;
    gap: 4px;
}

.custom_price .sale_price bdi {
    font-size: 24px;
    line-height: 36px;
    color: rgb(134, 3, 21);
}

.custom_price .discount_percentage span {
    font-size: 14px;
    padding: 0 4px;
    margin-left: 5px;
    background: var(--primary-color);
    line-height: 22px;
    display: inline-grid;
    color: #fff;
    border-radius: 3px;
}

.custom_price .discount_percentage {
    display: flex;
    align-items: center;
}
.product-small.box 
 .star-list {
    font-size: 12px;
    display: flex;
    align-items: center;
}

i.hs-star-fill:before {
    content: "\e955";
}

i.hs-star-fill {
    font-style: normal;
    font-variant: normal;
    font-weight: 400;
    line-height: 1;
    font-family: 'happyskin' !important;
    text-transform: none;
    color: #860315;
}
.price-wrapper {
    height: auto !important;
}
.product-small .box_star {
    display: flex;
    align-items: center;
    font-size: 12px;
    gap: 5px;
}
.product-mobile-block {
    padding: 8px 12px;
    border: 1px dashed #1948a4;
    border-radius: 4px;
    margin-top: 10px;
    margin-bottom: 16px;
}

.product-mobile-block .title {
    font-weight: bold;
    color: var(--primary-color);
    margin-bottom: 10px;
    font-size: 16px;
}

.product-mobile-block p {
    margin-bottom: 5px;
}

.product-gift {
    font-size: 14px;
}
form.variations_form.cart .variations tr {
    display: flex !important;
    align-items: center;
    flex-flow: row;
}
.woocommerce-variation.single_variation {
    display: none;
}

.product_info .ux-quantity.quantity {
    width: 100%;
    min-width: 100% !important;
    display: flex;
    max-width: 100%;
    align-items: center;
}
.woocommerce-variation-price {
    display: none;
}

.product_info .ux-quantity.quantity:before {
    content: "Số lượng";
    color: rgb(130, 130, 130);
    font-weight: 500;
    min-width: 100px;
    font-size: 16px;
}

span.woo-selected-variation-item-name {
    display: none !important;
}

form.variations_form.cart .variations tr .label {
    min-width: 98px;
}

form.variations_form.cart .variations tr label {
    color: rgb(130, 130, 130);
    font-size: 16px;
    font-weight: 500;
}
.product_info .ux-quantity.quantity .ux-quantity__button {
    height: 42px;
    background-color: #f6f6f6;
    border: none !important;
    box-shadow: none !important;
    min-width: 50px;
    width: 50px;
    border-radius: 99px;
}
.product_info .ux-quantity.quantity .input-text {
    background-color: #f6f6f6 !important;
    border: none;
    box-shadow: none;
    height: 42px;
}
button.single_add_to_cart_button {
    padding: 0 18px;
    font-size: 12px;
    font-weight: 500;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 99px;
    text-transform: capitalize;
    gap: 5px;
}
button.single_add_to_cart_button:before {
    content: "\f07a";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    margin-right: 5px;
    font-size: 14px;
    color: #fff;
}
a.tuvan {
    display: inline-flex;
    width: unset;
    max-width: max-content;
    flex: initial;
    height: 36px;
    padding: 0 18px;
    border: 1px solid var(--primary-color);
    font-size: 12px;
    align-items: center;
    border-radius: 99px;
}

a.tuvan:hover {
    background: var(--primary-color);
    color: #fff;
}
.product-policy-list >.col-inner {
    display: flex;
    justify-content: space-between;
}

.product-policy-list img {
    padding: 0 !important;
}
.product-policy-list p{
    margin: 0;
}
.post_title {
    font-size: 26px;
    color: var(--primary-color);
    margin-bottom: 24px;
}

.post_noibat .item {
    display: flex;
    align-items: center;
    gap: 10px;
}

.post_noibat .item .post-thumb {
    border-radius: 8px;
    min-width: 71px;
    height: 67px;
    width: 70px;
    overflow: hidden;
}

.post_noibat .item .post-thumb img {
    height: 100%;
    object-fit: cover;
}

.post_noibat .item .post-thumb .title a {
    font-size: 14px;
}

.post_noibat .item .title a {
    font-size: 14px;
    line-height: 21px;
}

.post_noibat .item:not(:last-child) {
    margin-bottom: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid #44444426;
}
.product_infomation {
    max-height: 500px;
    overflow: hidden;
    position: relative;
    transition: max-height 0.3s ease-out
}

.product_infomation.expanded {
    max-height: none
}

.wrap_btn.active {
    background: linear-gradient(180deg,rgba(252,254,255,0) 0%,#FCFEFF 97.68%);
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px;
    height: 100%;
    display: flex;
    align-items: end;
    justify-content: center
}

button#toggleButton {
    display: inline-flex
;
    align-items: center;
    gap: 5px;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    color: var(--primary-color);
    text-transform: initial;
    margin: 0;
    transition: background-size .35s;
    background: linear-gradient(0deg, var(--primary-color), var(--primary-color)) no-repeat 100% 100% / 0 1px;
}
button#toggleButton:hover{
    background-size: 100% 1px;
    background-position-x: left;
}
.wrap_btn {
    text-align: center
}
.product_content {
    position: relative;
    margin-bottom: 30px;
    padding: 20px;
}
.product_content 
 .title {
    font-size: 20px;
    margin-bottom: 12px;
    font-weight: bold;
}

.product-reviews {
    padding: 20px;
}
.product-reviews 
 .single_product_title {
    font-size: 30px;
    font-weight: bold;
    color: var(--primary-color);
    margin-bottom: 22px;
}
div#reviews.woocommerce-Reviews {
    margin: 0;
    max-width: 100%;
    width: 100%;
}
span.no-reviews {
    display: none;
}
.product-brand {
    display: flex;
    align-items: center;
    gap: 8px;
    color: rgb(68, 68, 68);
    font-size: 15px;
}
.product-brand .star-wrap {
    display: flex;
    align-items: center;
    gap: 4px;
}
/* POst */
.nav-hs-list a.active {
    background: var(--primary-color);
    color: #fff;
}
.news-list-section .list_post {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    -moz-column-gap: 30px;
    column-gap: 20px;
    row-gap: 30px;
}


.news-list-section .list_post .post_item {
    padding: 16px;
    border-radius: 15px;
    background: #fff;
    box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 6px 0px 39.7681px 0px;
}


.list_post .post_item a.img-scale {
    padding-top: 70%;
    position: relative;
    display: block;
    border-radius: 8px;
    overflow: hidden;
}

.list_post .post_item a.img-scale img {
    position: absolute;
    top: 0;
    left: 0;
    transition-duration: .3s;
    transition-property: all;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.list_post .post_item .news-caption {
    padding-top: 24px;
}

.list_post .post_item .news-caption .news-category.is-green {
    background: #14aa3e;
    color: #fff;
    padding: 3px 9px;
    border-radius: 5px;
    margin-bottom: 9px;
    width: fit-content;
    font-size: 12px;
}

.list_post .post_item .news-title a {
    -webkit-box-orient: vertical;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    overflow: hidden;
    font-size: 16px;
    color: rgb(68, 68, 68);
    font-weight: bold;
}

.news-date-author {
    display: flex;
    align-items: center;
    color: rgba(68, 68, 68, 0.6);
    gap: 8px;
    font-size: 15px;
}

.news-date-author p {
    margin: 0;
}

.news-date-author span.dot {
    width: 6px;
    height: 6px;
    background: rgba(68, 68, 68, 0.6);
    border-radius: 99px;
}
.articles-related-wrap {
    padding: 16px;
    border-radius: 15px;
    background: #fff;
    box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 6px 0px 39.7681px 0px;
    margin-bottom: 20px;
}

ul.service-list {
    list-style: none;
    margin: 0;
}

.articles-related-wrap .site-title {
    margin-bottom: 20px;
    font-size: 24px;
    font-weight: 500;
    color: var(--primary-color);
}

ul.service-list li {
    padding: 16px 0 16px 34px;
    margin: 0;
}

ul.service-list li a {
    display: block;
    color: rgb(68 68 68);
    font-weight: 400;
    font-size: 14px;
    line-height: 1.5;
    position: relative;
}

ul.service-list li:not(:last-child) {
    border-bottom: 1px solid #44444426;
}

ul.service-list li a:before {
    font-family: 'happyskin' !important;
    content: "\e92a";
    position: absolute;
    top: 50%;
    left: -34px;
    transform: translateY(-50%);
    font-size: 22px;
    color: var(--primary-color);
}

ul.service-list li a:hover {
    color: var(--primary-color);
}
.widget_media_image {
    border-radius: 15px;
    overflow: hidden;
}
.single_wrap h1.single-title {
    font-size: 30px;
    margin: 16px 0;
    color: var(--primary-color);
}

.single_wrap .single_meta {
    display: flex;
    align-items: center;
    gap: 60px;
}

.single_wrap .single_meta ul.shared-social {
    display: flex;
    align-items: center;
    margin: 0;
    list-style: none;
    gap: 8px;
    position: relative;
}

.single_wrap .single_meta ul.shared-social li {
    margin: 0;
    height: 16px;
}

.single_wrap .single_meta ul.shared-social li a {
    display: flex;
}

.single_wrap .single_meta ul.shared-social:before {
    content: "";
    left: -30px;
    height: 12px;
    width: 1px;
    background: rgba(136, 136, 136, 0.2);
    position: absolute;
}
.single_content 
 .image-thumbnail {
    margin-bottom: 30px;
}
.articles-related {
    border-radius: 8px;
    padding: 24px 16px;
    margin-bottom: 30px;
}
.news-detail-relative {
    padding: 24px;
    border: 1px dashed var(--primary-color);
    border-radius: 15px;
}

.news-detail-relative p.news-relative-title {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 16px;
    line-height: 1.4;
    color: var(--primary-color);
}

.news-detail-relative ul {
    margin: 0;
    list-style: none;
    list-style-type: disc;
    padding-left: 20px;
    color: #00000066;
}

.news-detail-relative ul a {
    font-size: 14px;
    color: var(--primary-color);
}
.site-title {
    font-size: 30px;
    font-weight: 700;
    color: var(--primary-color);
    margin-bottom: 16px;
    margin-top:30px;
}
.list_product .product-small.col {
    width: 25%;
}
.articles-for-you-wrap .list_post {
    grid-template-columns: repeat(4, 1fr);
}
/* Shop */
.row.category-page-row {
    padding-top: 0;
}
.title_cat 
 span.section-title-main {
    font-size: 30px;
    color: var(--primary-color);
}

.title_cat .section-title  a {
    height: 44px;
    display: inline-flex !important;
    align-items: center;
    padding: 0 24px;
    background: rgb(68, 68, 68);
    color: #fff;
    border-radius: 99px;
    font-size: 16px;
    font-weight: 500;
}
.title_cat .section-title a:after {
    content: "\e900";
    font-family: 'happyskin' !important;
    margin-left: 10px;
}

span.hdevvn-show-cats {
    display: flex;
    justify-content: end;
    list-style: none;
    gap: 24px;
}

span.hdevvn-show-cats li.hdevvn_cats {
    margin: 0;
}

span.hdevvn-show-cats li.hdevvn_cats a {
    height: 36px;
    display: inline-flex;
    align-items: center;
    padding: 4px 16px;
    background: #1948a421;
    color: rgb(68, 68, 68);
    border-radius: 5px;
    font-size: 14px;
}
span.hdevvn-show-cats li.hdevvn_cats a:hover{
    background-color: var(--primary-color);
    color: #fff;
}
span.hdevvn-show-cats {
    margin-bottom: 20px;
}
/* Gior hangf */

.woocommerce-cart-form th,
th.product-name,
h3.widget-title {
    font-size: 14px;
    text-transform: initial;
    min-width: 100px;
    border-bottom: 2px solid var(--primary-color) !important;
}

.actions .button,
a.checkout-button,
input#coupon_code {
    text-transform: initial !important;
    border-radius: 4px;
}

input#coupon_code {
    border: 1px solid var(--primary-color);
}

.checkout_coupon button {
    color: #fff;
    border-radius: 5px;
}


/* Thanh hóa */

.woocommerce-billing-fields__field-wrapper input,
textarea#order_comments {
    border: 1px solid var(--primary-color);
    border-radius: 5px !important;
}

.woocommerce-billing-fields,
.woocommerce-billing-fields h3 {
    border: none !important;
    padding: 0 !important;
}

.woocommerce-billing-fields h3,
h3#order_review_heading {
    text-transform: initial !important;
    color: var(--primary-color) !important;
    border-bottom: 2px solid var(--primary-color) !important;
    padding-top: 0 !important;
}

.woocommerce-billing-fields__field-wrapper input,
textarea#order_comments,
.woocommerce-billing-fields__field-wrapper span.selection>span {
    border: 1px solid var(--primary-color);
    border-radius: 5px;
}

form.checkout.woocommerce-checkout .large-5.col .col-inner {
    padding: 0;
    border: none;
}

table.shop_table.woocommerce-checkout-review-order-table th {
    border: none !important;
    min-width: 100px;
    text-transform: inherit;
}

button#place_order {
    width: 100%;
    text-transform: initial;
    border-radius: 5px;
    background: var(--primary-color);
}
/* Pc      --------------------------------------------- */
@media(min-width: 766px){

}
@media (width: 1024px){

}
@media (min-width: 1023px){
    .ss_footer .col_3 {
        flex-basis: 30%;
        max-width: 30%;
    }
    
    .ss_footer .col_2 {
        flex-basis: 20%;
        max-width: 20%;
    }
    .col_4-5{
        flex-basis: 80% !important;
        max-width: 80% !important;
    }
    .col_1-5{
        flex-basis: 20% !important;
        max-width: 20% !important;
    }
}
@media (min-width: 990px) and (max-width: 1100px){

}
/*************** ------------------------PC và Tablet  --------------------------  ***************/
@media (min-width: 740px){
    .post_item.item_first .news-image {
        min-width: 46.711%;
    }
    
    .post_item.item_first .news-category.is-green {
        margin-bottom: 16px !important;
    }
    
    .post_item.item_first  .news-date-author {
        margin: 16px 0;
    }
    
    .post_item.item_first 
     .news-brief {
        font-size: 14px;
        -webkit-box-orient: vertical;
        display: -webkit-box;
        -webkit-line-clamp: 4;
        overflow: hidden;
        color: rgba(66, 66, 66, 0.7);
    }
    
    .post_item.item_first {
        grid-row: 1/1;
        grid-column: 1 / 4;
        position: relative;
        overflow: hidden;
    }

    .post_item.item_first {
        display: flex;
        gap: 20px;
    }
    .post_item.item_first .news-caption {
        padding: 0;
    }
}
/*************** ------------------------Tablet  --------------------------  ***************/
@media (min-width: 740px) and (max-width: 1023px){
    .mobile_nav-icon .icon:before, .mobile_nav-icon .icon:after ,.mobile_nav-icon .icon span{
        background: var(--primary-color) !important;
    }
}
@media (max-width:990px){

}
/*************** ------------------------Mobile và Tablet --------------------------  ***************/
@media (max-width: 1023px){
    .list_hethong .col-inner {
        flex-flow: wrap;
    }
    
    .list_hethong .icon-box {
        width: calc((100% - 60px) / 4);
    }
}

 /*************** ------------------------ Mobile   --------------------------  ***************/
@media screen and (max-width: 549px){
    .ss_footer a.ux-menu-link__link {
        font-size: 14px;
    }
    .header-right .searchform-wrapper {
        display: none;
    }
    
    .button-cart {
        height: 24px;
        transform: translateY(1px);
    }
    .header-bg-color {
        background-color: var(--primary-color) !important;
    }
    i.hs-shopping-bag:before {
        content: "\e91d";
    }
    
    i.hs-shopping-bag {
        font-size: 24px;
        color: #fff;
    }
    
    .button-user i.hs-user {
        height: 24px;
        width: 24px;
        font-size: 24px;
        color: #fff;
    }
    
    #logo {
        width: 133px !important;
    }
    
    #logo img.header_logo.header-logo {
        display: none;
    }
    
    #logo img.header-logo-dark {
        display: block !important;
    }
    
    span.bag-count.cart-count {
        background-color: #fff3;
    }
    .box-support {
        padding: 10px;
    }
    .sale-off-item .top .button {
        padding: 0 15px;
        font-size: 12px;
        height: 30px;
    }
    
    .sale-off-item .top .percent {
        font-size: 14px;
    }
    
    .sale-off-item p {
        font-size: 14px;
    }
    .product_info h1.product-title {
        font-size: 16px;
        margin: 20px 0 5px;
    }
    
    .sku-product a {
        font-size: 15px;
    }
    
    .custom_price .sale_price {
        font-size: 14px;
    }
    
    .custom_price .sale_price bdi {
        font-size: 18px;
    }
    
    .product-policy-list >.col-inner {
        flex-flow: wrap;
        row-gap: 10px;
    }
    
    .product-policy-list >.col-inner .icon-box {
        width: calc(100% /3);
    }
    
    .product-policy-list p {
        font-size: 12px;
    }
    
    .product-policy-list >.col-inner .icon-box .icon-box-img {
        width: 50px !important;
    }
    .product_content {
        padding: 10px;
    }
    
    .product_content .title {
        font-size: 16px;
    }
    
    .product-reviews {
        padding: 10px;
    }
    
    .product-reviews .single_product_title {
        font-size: 18px;
    }
    
    div#reviews {
        font-size: 14px;
    }
    
    h2.woocommerce-Reviews-title {
        font-size: 14px !important;
    }
    .news-nav-section ul.menu-list {
        gap: 20px;
    }
    
    .nav-hs-list {
        white-space: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-box-align: stretch;
        align-items: stretch;
        gap: 15px;
    }
    
    .nav-hs-list a {
        padding: 0 15px;
        height: 32px;
        font-size: 14px;
    }
    
    .news-nav-section ul.menu-list li a span {
        font-size: 14px;
    }
    
    .news-nav-section ul.menu-list li a {
        padding: 8px;
    }
    
    .news-nav-section ul.menu-list li.active a span {
        font-size: 16px;
    }
    .news-list-section .list_post {
        grid-template-columns: repeat(2, 1fr);
        column-gap: 10px;
        row-gap: 10px;
    }
    
    .post_item.item_first {
        grid-row: 1/1;
        grid-column: 1 / 3;
        position: relative;
        overflow: hidden;
    }
    
    .post_item.item_first .news-date-author {
        margin: 8px 0;
    }
    
    .news-date-author {
        font-size: 12px;
    }
    .list_post .post_item.item_first .news-title a {
        font-size: 15px;
    }
    .news-brief {
        font-size: 12px;
        -webkit-box-orient: vertical;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        overflow: hidden;
        color: rgba(66, 66, 66, 0.7);
    }
    
    .list_post .post_item .news-title a {
        font-size: 13px;
    }
    .single_wrap h1.single-title {
        font-size: 22px;
    }
    
    .single_content.entry-content {
        font-size: 14px;
    }
    
    .news-detail-relative {
        padding: 16px;
    }
    .news-detail-relative ul li {
        margin: 0;
    }
    .news-detail-relative p.news-relative-title {
        font-size: 16px;
    }
    .news-detail-relative ul li {
        margin: 0;
    }
    
    .articles-related {
        padding: 16px;
    }
    
    .post_title {
        font-size: 24px;
        margin-bottom: 16px;
    }
    
    .site-title {
        font-size: 22px;
    }
    
    .list_product .product-small.col {
        width: 50%;
        padding: 0 8px;
    }
    .home_title p {
        font-size: 12px;
        font-weight: bold;
        margin: 0;
    }
    
    .home_title h2 {
        font-size: 24px;
        margin-top: 6px;
        margin-bottom: 20px;
    }
    .list_hethong .icon-box {
        width: calc((100% - 15px) / 2);
    }
    
    .list_hethong .col-inner {
        gap: 15px;
    }
    .home_video .tiktok-discover {
        right: -15px;
    }
    
    .blog_home .box .box-text {
        padding: 16px 0 0 !important;
    }
    ul.social-follow-list li {
        margin: 0 ;
        box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0) 0px 0px 0px 0px, rgba(0, 0, 0, 0.05) 6px 0px 39.7681px 0px !important;
    }
    .footer-mobile {
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        z-index: 99999;
    }
    
    footer#footer {
        padding-bottom: 65px;
    }
    
    .footer-mobile ul.menu-list {
        display: flex;
        margin: 0;
        justify-content: space-between;
        align-items: center;
        background: #fff;
        list-style: none;
        height: 65px;
    }
    
    .footer-mobile ul.menu-list li {
        flex: 1 1 0%;
        margin: 0;
    }
    
    .footer-mobile ul.menu-list li * {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        font-weight: 600;
        font-size: 12px;
        text-align: center;
        color: #828282;
    }
    .footer-mobile ul.menu-list li em{
        font-weight: 400;
    font-size: 25px;
    line-height: 1;
    font-family: 'happyskin' !important;
    font-style: normal;
        color: #828282;
    }
    .hs-home:before {
        content: "\e913";
    }
    .hs-product:before {
        content: "\e914";
    }
    .hs-blog:before {
        content: "\e915";
    }
    .hs-view-more:before {
        content: "\e916";
    }
    .footer-mobile ul.menu-list li.active * {
        color: var(--primary-color);
    }
    .title_cat span.section-title-main {
        font-size: 18px;
    }
    
    .title_cat .section-title {flex-flow: row;gap: 10px;}
    
    .title_cat .section-title a {
        min-width: fit-content;
    }
    
    span.hdevvn-show-cats {
        white-space: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-box-align: stretch;
        align-items: stretch;
        width: 100%;
        justify-content: start;
        gap: 10px;
    }
    .title_cat .section-title a {
        height: 40px;
        padding: 0 16px;
        font-size: 14px;
    }
    
    span.hdevvn-show-cats li.hdevvn_cats a {
        height: 32px;
        font-size: 13px;
    }
}


.progress-wrap.active-progress {
    opacity: 1;
    visibility: visible;
    transform: translateY(0)
}
.progress-wrap::after {
    position: absolute;
    font-family: "fl-icons"!important;
    content: "";
    text-align: center;
    font-size: 24px;
    color: #fff;
    left: 0;
    right: 0;
    margin: auto;
    background-color: var(--primary-color);
    border-radius: 99px;
    top: 50%;
    transform: translateY(-50%);
    height: 38px;
    width: 38px;
    line-height: 35px;
    cursor: pointer;
    display: block;
    z-index: 1;
    -webkit-transition: all 200ms linear;
    transition: all 200ms linear
}
.progress-wrap:hover::after {
    background-color: #333
}
.progress-wrap::before {
    position: absolute;
    font-family: "fl-icons"!important;
    content: "";
    text-align: center;
    line-height: 46px;
    font-size: 24px;
    opacity: 0;
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    left: 0;
    top: 0;
    height: 46px;
    width: 46px;
    cursor: pointer;
    display: block;
    z-index: 2;
    -webkit-transition: all 200ms linear;
    transition: all 200ms linear
}
.progress-wrap:hover::before {
    opacity: 1
}
.progress-wrap svg path {
    fill: none
}
.progress-wrap svg.progress-circle path {
    stroke: var(--primary-color);
    stroke-width: 4;
    box-sizing: border-box;
    -webkit-transition: all 200ms linear;
    transition: all 200ms linear
}
.progress-wrap {
    position: fixed;
    right: 30px;
    bottom: 30px;
    height: 46px;
    width: 46px;
    cursor: pointer;
    display: block;
    border-radius: 50px;
    z-index: 10000;
    opacity: 0;
    visibility: hidden;
    transform: translateY(15px);
    -webkit-transition: all 200ms linear;
    transition: all 200ms linear
}