/*
	Theme Name: Hello Elementor
	Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
	Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
	Author: Elementor Team
	Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
	Version: 3.4.4
	Stable tag: 3.4.4
	Requires at least: 6.0
	Tested up to: 6.8
	Requires PHP: 7.4
	License: GNU General Public License v3 or later.
	License URI: https://www.gnu.org/licenses/gpl-3.0.html
	Text Domain: hello-elementor
	Tags: accessibility-ready, flexible-header, custom-colors, custom-menu, custom-logo, featured-images, rtl-language-support, threaded-comments, translation-ready,
*/

body {
    margin: 0;
    box-sizing: border;
    scroll-behavior: smooth;
    font-family: "Inter", sans-serif;
}

html {
    overflow-x: hidden;
}

.mega-menu-link {
    position: relative;
}

.mega-menu-link::before {
    position: absolute;
    content: "";
    width: 10px;
    background: white;
    height: 1px;
    top: 0;
}

.heading__title {
    text-shadow:
        -1px -1px 0 #ffffff,
        1px -1px 0 #ffffff,
        -1px 1px 0 #ffffff,
        1px 1px 0 #ffffff,
        3px 3px 10px rgb(0 0 0 / 65%);
}

.breadcrumbs__page_single {
    padding: 10px 0;
    background: #8c8c8c;
    background: -webkit-linear-gradient(to top, #d7d2cc, #f5f5f5);
    background: linear-gradient(to top, #d7d2cc, #f5f5f5);
}

#breadcrumbs a,
#breadcrumbs span {
    color: #000;
    font-weight: 500;
}

.page-header h1.entry-title {
    display: none;
}

.vct__box {
    position: relative;
}

.vct__box .vct__content {
    padding: 120px 50px 30px 50px;
}

.vct__box img {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 160px;
    height: 160px;
    border-radius: 50%;
    background: #a1deaa;
}

.vct__box .vct__content .vct__title h2 {
    font-size: 30px;
    line-height: 1.3em;
    margin-bottom: 25px;
    font-weight: bold;
    text-align: center;
    position: relative;
    color: var(--e-global-color-primary);
}

.vct__box .vct__content .vct__title h2::after {
    content: "";
    position: absolute;
    width: 150px;
    height: 3px;
    background: var(--e-global-color-primary);
    bottom: -10px;
    left: calc(50% - 75px);
}

.woocommerce .product-category img {
    object-fit: contain !important;
    margin: 0 !important;
}

.woocommerce .product-category:hover {
    background: var(--e-global-color-primary);
    transition: all 0.3s ease-in-out;
}

.woocommerce .product-category:hover h2.woocommerce-loop-category__title {
    color: white !important;
}

.woocommerce .product-category {
    background: white;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.elementor-nav-menu--main ul li.menu-item a {
    padding: 20px 10px;
}

.elementor-nav-menu--main ul li.menu-item:hover a {
    padding: 20px 10px;
}

.section_contact_form::before {
    content: "";
    background: url(/wp-content/uploads/2025/09/PageTuyenDung_04_bg.jpg)
        no-repeat left center;
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: 100%;
}

.elementor-nav-menu__align-center .elementor-nav-menu {
    width: 100% !important;
    justify-content: space-between !important;
}

.cf7-apply label {
    display: block;
    margin: 0 0 14px;
    font-weight: 600;
}
.cf7-apply input[type="text"],
.cf7-apply input[type="tel"],
.cf7-apply input[type="email"],
.cf7-apply input[type="file"],
.cf7-apply textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #d9e2ec;
    border-radius: 8px;
    background: #f3f8ff;
}
.cf7-apply textarea {
    min-height: 160px;
}
.cf7-apply .btn-wrap {
    margin-top: 14px;
}
.cf7-apply .btn-wrap p {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.cf7-apply input[type="submit"] {
    background: #25a559;
    color: #fff;
    padding: 14px 22px;
    border: 0;
    border-radius: 8px;
    font-weight: 700;
}

.baro-toc {
    background: #fff;
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 14px;
}
.baro-toc h3 {
    margin-top: 0;
    font-size: 16px;
}
.baro-toc ul {
    list-style: none;
    padding-left: 0;
}
.baro-toc li {
    margin: 5px 0;
}
.baro-toc a {
    text-decoration: none;
    color: #0073aa;
}
.baro-toc a:hover {
    text-decoration: underline;
}
h2[id],
h3[id] {
    scroll-margin-top: 165px;
}

div#ez-toc-container .ez-toc-title {
    color: #0674bb;
}
#ez-toc-container {
    border: none;
}

.mobile__menu a.elementor-item.elementor-item-active,
.mobile__menu a.elementor-item:hover {
    background: transparent !important;
    color: black !important;
}

.mobile__menu a.elementor-item {
    background: transparent !important;
    color: black;
    border-bottom: 1px solid #000;
}

.elementor-nav-menu .sub-arrow {
    display: none;
}

a.elementor-sub-item {
    padding: 20px !important;
}

/* Submenu fly-in animation */
@keyframes flyInUp {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Container bay lên trước, tắt transition để không có fly-out */
ul.sub-menu,
.elementor-nav-menu--dropdown {
    animation: flyInUp 0.2s ease both;
    transition: none !important;
}

/* Tắt fly-out trên item */
ul.sub-menu li.menu-item {
    transition: none !important;
}

/* Các item bay lên theo sau container */
ul.sub-menu li.menu-item {
    animation: flyInUp 0.22s ease both;
}

ul.sub-menu li.menu-item:nth-child(1) {
    animation-delay: 0.1s;
}
ul.sub-menu li.menu-item:nth-child(2) {
    animation-delay: 0.15s;
}
ul.sub-menu li.menu-item:nth-child(3) {
    animation-delay: 0.2s;
}
ul.sub-menu li.menu-item:nth-child(4) {
    animation-delay: 0.25s;
}
ul.sub-menu li.menu-item:nth-child(5) {
    animation-delay: 0.3s;
}
ul.sub-menu li.menu-item:nth-child(6) {
    animation-delay: 0.35s;
}

/* Submenu container */
ul.sub-menu li.menu-item a.elementor-sub-item:hover {
    background: white !important;
    border-radius: 12px;
    color: var(--e-global-color-primary) !important;
}
ul.sub-menu li.menu-item a.elementor-sub-item.elementor-item-active {
    background: white !important;
    border-radius: 12px;
    color: var(--e-global-color-primary) !important;
    border-bottom: unset !important;
}

.main-navigation ul.sub-menu,
.elementor-nav-menu--dropdown {
    background: #fff;
    border-radius: 12px;
    padding: 10px 0;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    min-width: 200px;
    z-index: 999;
}

.main-navigation ul.sub-menu li a,
.elementor-nav-menu--dropdown a {
    display: block;
    padding: 10px 20px;
    color: #2e7d32;
    font-weight: 600;
    text-transform: uppercase;
    transition:
        background 0.3s,
        color 0.3s;
}

/* Hover effect */
.main-navigation ul.sub-menu li a:hover,
.elementor-nav-menu--dropdown a:hover {
    background: #f5f5f5;
    color: #1b5e20;
}

.main-navigation ul.sub-menu ul.sub-menu {
    margin-left: 5px;
    border-radius: 8px;
}

header .elementor-nav-menu--main > ul > li {
    position: relative;
    display: inline-block;
}
header .elementor-nav-menu--main > ul > li > a.elementor-item {
    position: relative;
    display: inline-block;
    padding: 10px 5px !important;
    color: #fff;
    text-decoration: none;
    transition: color 0.3s ease;
}
header .elementor-nav-menu--main > ul > li > a.elementor-item:hover {
    color: #ff6600;
    padding: 10px 5px !important;
}

header .elementor-nav-menu--main > ul > li > a.elementor-item::after {
    content: "";
    position: absolute;
    width: 60%;
    height: 1px;
    background: white !important;
    bottom: 50;
    left: 50%;
    transform: translateX(-50%) scaleX(0);
    transform-origin: center;
    transition: transform 0.3s ease;
}

header .elementor-nav-menu--main > ul > li > a.elementor-item:hover::after {
    transform: translateX(-50%) scaleX(1);
}

header
    .elementor-nav-menu--main
    > ul
    > li
    > a.elementor-item.elementor-item-active::after {
    transform: translateX(-50%) scaleX(1);
}

.vechungtoi__slick
    .baro-slick__track
    .slick-track
    .baro-slick__slide
    .baro-slick__slide-inner {
    background: rgba(255, 255, 255, 0.5);
    padding: 10px 0 !important;
}

.vechungtoi__slick .baro-slick button.slick-prev.slick-arrow {
    position: absolute;
    z-index: 3;
    border: 1px solid #dddddd;
    width: 30px;
    height: 30px;
    top: 0;
    right: -50px;
    cursor: pointer;
    background-color: #fff;
    color: #fcb01c;
    font-size: 28px;
    line-height: 0;
    text-indent: -500000px;
    border-radius: 5px;
    transition: all 0.5s;
}

.glink span {
    display: none;
}

.glink img {
    border: 1px solid #ddd !important;
}

#mega-menu-wrap-menu-1 #mega-menu-menu-1 {
    display: flex;
    justify-content: space-between;
}

@media (max-width: 768px) {
    #mega-menu-wrap-menu-1 #mega-menu-menu-1 {
        display: unset;
        justify-content: unset;
    }

    .section_contact_form::before {
        content: none;
    }
}
/* Table Khuyến mãi */

.table_rewards {
    border: 1px solid var(--e-global-color-primary);
    border-collapse: separate !important;
    border-spacing: 0;
    border-radius: 12px;
    overflow: hidden;
}

.table_rewards td.column-1[rowspan="2"],
.table_rewards td.column-6[rowspan="2"] {
    color: white;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 2rem;
    background: var(--e-global-color-primary);
    text-align: center;
}

.table_rewards td.column-2[colspan="4"] {
    background: #c2e8c3;
    color: var(--e-global-color-primary);
    font-weight: bold;
    text-transform: uppercase;
    text-align: center;
    font-size: 1.5rem;
}

.table_rewards tr.row-2 td.column-2,
.table_rewards tr.row-2 td.column-3,
.table_rewards tr.row-2 td.column-4,
.table_rewards tr.row-2 td.column-5 {
    background: #77cc7b;
    text-align: center;
    font-weight: bold;
    color: white;
    text-transform: uppercase;
    border: none;
    border-left: 2px solid #fff;
}

.table_rewards tr.row-2 td.column-5 {
    border-right: 2px solid #fff;
}

.heading__rewards h2 {
    background: #eee;
    display: inline !important;
    padding: 10px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}

.checked {
    background: url("/wp-content/uploads/2025/09/dome-QUA-TANG-WEB-01.svg")
        no-repeat;
    height: 120px;
    width: 120px;
    object-fit: contain;
    margin: 0 auto;
}

tr.row-3,
tr.row-5,
tr.row-7,
tr.row-9 {
    background: white;
    height: 40px;
}

tr.row-4,
tr.row-6,
tr.row-8,
tr.row-10 {
    background-color: #c0e8c3;
    height: 190px;
}

td.column-2,
td.column-3,
td.column-4,
td.column-5 {
    border-left: 2px solid #fff;
}

td.column-5 {
    border-right: 2px solid #fff;
}

td.column-6 {
    position: relative;
    height: 100%;
}

.ranked {
    position: static;
    width: 100%;
    display: flex;
}

.bronze {
    background: url("/wp-content/uploads/2025/09/dome-QUA-TANG-WEB-02.svg")
        no-repeat center center;
    background-size: contain;
    width: 240px;
    aspect-ratio: 215.33 / 178.57;
    position: absolute;
    right: 0;
    bottom: 0;
}

.sliver {
    background: url("/wp-content/uploads/2025/09/dome-QUA-TANG-WEB-03.svg")
        no-repeat center center;
    background-size: contain;
    width: 240px;
    aspect-ratio: 215.33 / 165.2;
    position: absolute;
    right: 0;
    bottom: 0;
}

.gold {
    background: url("/wp-content/uploads/2025/09/dome-QUA-TANG-WEB-04.svg")
        no-repeat center center;
    background-size: contain;
    width: 240px;
    aspect-ratio: 215.33 / 161.21;
    position: absolute;
    right: 0;
    bottom: 0;
}

.diamond {
    background: url("/wp-content/uploads/2025/10/mobile-06.png") no-repeat
        center center;
    background-size: contain;
    width: 240px;
    aspect-ratio: 240 / 165.87;
    position: absolute;
    right: 0;
    bottom: 0;
}

.table_rewards td {
    vertical-align: middle;
}

@media (max-width: 768px) {
    .table_rewards {
        font-size: 0.8rem;
    }

    .table_rewards td {
        padding: 6px 4px;
        font-size: 0.75rem;
    }

    .table_rewards td.column-1[rowspan],
    .table_rewards td.column-6[rowspan] {
        font-size: 1rem;
        line-height: 1.2;
        padding: 8px 6px;
    }

    .table_rewards td.column-2[colspan="4"] {
        font-size: 0.9rem;
        padding: 6px;
    }

    .table_rewards td i,
    .table_rewards td img {
        max-width: 18px;
        max-height: 18px;
    }

    tr.row-4,
    tr.row-6,
    tr.row-8,
    tr.row-10 {
        height: unset;
    }

    .bronze,
    .sliver,
    .gold,
    .diamond {
        width: 70px;
    }

    .checked {
        width: 40px;
        height: 40px;
    }
}

.section__baochi .baro-slick__slide-inner {
    background-color: white;
    padding: 10px;
    margin: 40px 0;
    border-radius: 10px;
    box-shadow:
        rgba(0, 0, 0, 0.09) 0px 2px 1px,
        rgba(0, 0, 0, 0.09) 0px 4px 2px,
        rgba(0, 0, 0, 0.09) 0px 8px 4px,
        rgba(0, 0, 0, 0.09) 0px 16px 8px,
        rgba(0, 0, 0, 0.09) 0px 32px 16px;
}

/* Tablet */
@media (max-width: 992px) {
    .banner_1 {
        width: 55px;
    }

    .parallelogram_1 {
        width: 30px;
        height: 28px;
    }
}

/* Mobile */
@media (max-width: 576px) {
    .banner_1 {
        width: 40px;
    }

    .parallelogram_1 {
        width: 22px;
        height: 20px;
    }
}

.wpgs-nav .slick-slide {
    margin: 10px;
    border: 1px solid #eee;
    border-radius: 16px;
}

.wpgs-nav .slick-slide img {
    border-radius: 10px;
    padding: 5px;
}

.image__box .elementor-image-box-wrapper figure > img {
    margin: 0 auto;
}

.desc p {
    text-align: justify;
}

@media (max-width: 768px) {
    .product__introduce_summary .elementor-image-box-wrapper {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .wpgs-nav .slick-slide {
        width: 120px !important;
        margin: 4px !important;
    }

    .woocommerce-product-gallery .slick-track {
        display: flex;
    }
}

a.glink {
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

#mega-menu-wrap-menu-1 .mega-menu-toggle {
    height: 30px !important;
}

@media (max-width: 600px) {
    #mega-menu-wrap-menu-1 .mega-menu-toggle.mega-menu-open:after {
        background: transparent;
        top: var(--header-height);
    }
    #mega-menu-wrap-menu-1
        .mega-menu-toggle.mega-menu-open
        + #mega-menu-menu-1 {
        display: flex;
        justify-content: start;
        align-items: center;
        max-height: 90% !important;
        top: var(--header-height);
        gap: 10px;
    }
    #mega-menu-wrap-menu-1
        .mega-menu-toggle.mega-menu-open
        + #mega-menu-menu-1
        li {
        display: flex;
        flex-direction: column;
        border-bottom: 1px solid #000;
        width: 90%;
        align-items: center;
        justify-content: center;
        font-size: 1rem;
    }

    #mega-menu-wrap-menu-1. ul.mega-sub-menu li a.mega-menu-link {
        text-align: center;
        width: 100% !important;
    }

    #mega-menu-wrap-menu-1
        #mega-menu-menu-1
        li.mega-menu-item.mega-toggle-on
        > ul.mega-sub-menu {
        width: 100%;
        background: white;
        box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
        align-items: center;
        justify-content: center;
        display: flex;
        flex-direction: column;
        border-radius: 20px;
        margin-bottom: 10px;
    }

    #mega-menu-wrap-menu-1
        #mega-menu-menu-1
        li.mega-menu-item.mega-toggle-on
        > ul.mega-sub-menu
        li {
        border-bottom: none !important;
    }
    #mega-menu-wrap-menu-1. ul.mega-sub-menu li {
        border-bottom: none;
    }
}

.elementor-element.elementor-pagination-position-outside .swiper {
    padding-bottom: 0;
}

.elementor-widget-image-carousel .swiper .swiper-slide figure {
    line-height: 0;
}

.ez-toc-icon-toggle-span svg {
    display: none !important;
}

.ez-toc-icon-toggle-span {
    background: url("/wp-content/uploads/2025/10/ico_toc.png") no-repeat center
        center;
    background-size: 20px 20px;
    width: 20px;
    height: 20px;
    display: inline-block;
    border: none;
}

/* TOC Detail Product */
.bpt-content h2 {
    font-size: 26px;
    color: #f7941d;
    margin-bottom: 15px;
    font-weight: 600;
}

.bpt-content h3 {
    font-size: 24px;
    color: #50ab48;
    margin-bottom: 15px;
    font-weight: 600;
}

/* TOC Detail Product */

/* TOC Product Category  */

.term-description h2 {
    font-size: 26px;
    color: #f7941d;
    margin-bottom: 15px;
    font-weight: 600;
}
.term-description h3 {
    font-size: 24px;
    color: #50ab48;
    margin-bottom: 15px;
    font-weight: 600;
}
.post_detail_content a,
.bpt-content a,
.term-description a {
    color: blue !important;
}

.term-description {
    text-align: justify;
}
/* TOC Product Category */
button:hover,
button:focus,
.baro-submit:hover {
    background: var(--e-global-color-primary);
}

.baro-submit {
    background: var(--e-global-color-primary);
    border: 1px solid var(--e-global-color-primary);
    color: white;
}

.baro-gallery-thumbnails .slick-prev:before,
.baro-gallery-thumbnails .slick-next:before,
.baro-gallery-thumbnails .slick-prev,
.baro-gallery-thumbnails .slick-next {
    display: none !important;
}

.term-description img,
.post_detail_content img,
.bpt-content-wrapper img {
    width: 100% !important;
}
.baro-filter-form h3 {
    color: green;
    font-weight: bold;
    margin: 15px 0 5px;
}
.baro-filter-form label {
    display: block;
    margin: 6px 0;
}

.elementor-nav-menu .menu-item a.elementor-sub-item {
    padding: 10px 20px !important;
}
