/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** UNIFIED CUSTOM CSS ***************/

/* ==========================================================================
   1. KHAI BÁO FONT & ĐỊNH DẠNG CHUNG (GLOBAL)
   ========================================================================== */
@font-face {
    font-family: 'iCiel BCCubano';
    src: url('/wp-content/themes/flatsome-child/assets/fonts/iCielBCCubano-Normal.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

body h1, body h2, body h3, body h4, body h5 {
    font-family: 'iCiel BCCubano', sans-serif;
}

h5 a {
    font-family: 'Inter Tight';
}

.nav > li.active > a {
    color: #235DA7;
}

.tag-label, 
.has-hover:hover .tag-label {
    background-color: transparent;
}

tr#user-10, 
tr#user_10 {
    display: none !important;
}


/* ==========================================================================
   2. HEADER & NAVIGATION
   ========================================================================== */
#header {
    height: 95px;
    background: linear-gradient(to right, #235DA7, #61A6FF);
}
@media (max-width: 768px) {
    #header {
        height: 55px;
    }
}

.home #header {
    height: auto;
}

.header-wrapper {
    position: fixed;
    top: 16px;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 999;
    pointer-events: none;
}

.header-wrapper > #masthead {
    max-width: 1584px;
    margin: 0 auto;
    pointer-events: auto;
    background-color: #fff;
    border-radius: 99px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.1);
}

.header-inner {
    background-color: #FEFEFE;
    border-radius: 100px; 
    padding: 0 30px; 
    margin: 0 auto; 
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); 
}

.header-bg-color.fill {
    background-color: transparent !important;
}

.logo-left .logo {
    margin-right: 111px;
}

.nav-spacing-xlarge > li {
    margin: 0 16px;
}

.nav-right > li {
    margin: 0 12px;
}

.nav-top-link svg path {
    fill: #000000;
    transition: fill 0.2s ease; 
}

.nav-top-link:hover svg path,
.nav-top-link[aria-current="page"] svg path {
    fill: #F9A51E;
}

.nav-dropdown-has-border .nav-dropdown {
    border: none;
    border-radius: 8px;
    padding: 10px 0px;
    box-shadow: 1px 1px 15px rgba(0, 0, 0, .15);
}

.nav-dropdown > li > a:hover {
    color: #fff !important;
}

.nav-dropdown > li > a {
    border-bottom: none !important;
    transition: all 0.1s;
}

.nav-dropdown > li {
    padding-left: 10px;
    position: relative;
}

.nav-dropdown > li:hover {
    background: #235DA7;
}

.nav-dropdown > li::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 8px;
    height: 100%;
    background-color: #f5a623;
    border-radius: 0 8px 8px 0;
    opacity: 0;
}

.nav-dropdown > li:hover::after {
    opacity: 1;
}


/* ==========================================================================
   3. TRANG CHỦ & ĐIỀU HƯỚNG DANH MỤC
   ========================================================================== */
.tieu-de {
    width: 100%;
    text-align: center;
}

.tieu-de h2 {
    color: #235DA7;
    font-size: 40px;
    text-transform: uppercase;
    margin-bottom: 36px;
    font-weight: 400;
}

.gallery-home .box-image img {
    height: 64px;
    object-fit: contain;
}

.sec-banner-home {
    padding: 0 30px;
    padding-bottom: 0 !important;
}

.tabbed-content .nav {
    background-color: #F5F6F8;
    width: fit-content;
    margin: 0 auto;
    border-radius: 96px;
    padding: 4px 6px;
}

.tab-home .nav > li > a {
    padding: 8px 24px;
    text-transform: none;
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
    color: #235DA7;
}

.tab-home .nav-box > li.active > a,
.tab-home .nav-pills > li.active > a,
.tab-home .nav-pills > li:hover > a {
    background-color: #F9A51E;
    color: #fff;
}

.sec-category-banner {
    border-bottom: 10px solid #235DA7;
}

.category-banner-home {
    margin-bottom: -120px;
}

.row-danh-muc {
    border-bottom: 2px solid #F9A51E;
}

.sec-danh-muc {
    padding-top: 52px !important;
    padding-bottom: 37px !important;
    border-bottom: 1.5px solid #F9A51E;
}

.tgs-catalog-heading__shop {
    font-weight: 400;
    font-size: 40px;
    color: #235DA7;
}


/* ==========================================================================
   4. TRANG CHI TIẾT SẢN PHẨM & WOOCOMMERCE LỚP NGOÀI
   ========================================================================== */
.product-small .category,
.woocommerce-variation-price,
.woo-selected-variation-item-name {
    display: none !important;
}

.custom-product-archive {
    padding: 0 0px 80px 0px;
    max-width: 1400px; 
    margin: 0 auto;
}

.tgs-sp-summary__price span.amount.woocommerce-Price-amount {
    color: #F9A51E;
    font-size: 32px;
    font-weight: 700;
    line-height: 40px;
}

.tgs-sp-summary__price .woocommerce-Price-amount {
    display: inline-block;
    vertical-align: baseline;
}

.tgs-sp-summary__price del .amount {
    text-decoration: line-through;
}

.variations tr {
    display: flex;
    align-items: center;
}

.variations label,
.variations .label label {
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
}

.tgs-sp-summary__intro ul li {
    margin-left: 40px;
}

.tgs-single-product__top button {
    margin: 0 !important;
}

.tgs-sp-summary__purchase form {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.woocommerce-variation-add-to-cart > *, 
form.cart > * {
    flex: 1 1 auto;
}

.tgs-two-row-products .tgs-product-card:hover .woocommerce-loop-product__title, 
.tgs-two-row-products .tgs-product-card:hover .woocommerce-loop-product__title a, 
.product-title a:hover,
.dark .widget a:hover, 
.dark a:hover {
    color: #F9A51E !important;
}

.woocommerce-Tabs-panel h2, 
.product-short-description h2,
.tgs-sp-accordion__content h2,
.tgs-single-product h2,
.product-info h2,
#tab-description h2,
.panel.entry-content h2 {
    color: #1F1F1F !important; 
    text-transform: none !important; 
    margin-top: 32px !important; 
    margin-bottom: 16px !important;
}

.woocommerce-Tabs-panel h2 strong, 
.product-short-description h2 strong,
.tgs-sp-accordion__content h2 strong,
.tgs-single-product h2 strong,
.product-info h2 strong,
#tab-description h2 strong,
.panel.entry-content h2 strong,
.tgs-sp-accordion__content h2 b,
.tgs-single-product h2 span,
.woocommerce-Tabs-panel p, 
.woocommerce-Tabs-panel li,
.tgs-single-product p,
.tgs-single-product li,
#tab-description p,
#tab-description li,
.panel.entry-content p,
.panel.entry-content li {
    color: #1F1F1F !important; 
}

.tgs-single-product blockquote {
    border-left: 4px solid #F9A51E;
    background: #FFF9F0;
    padding: 16px 20px;
    margin: 0 0 24px 0;
    border-radius: 0 8px 8px 0;
}

.tgs-single-product blockquote p,
.tgs-single-product blockquote span,
.tgs-single-product blockquote strong {
    margin: 0;
    color: #235DA7;
    font-weight: 600;
    font-style: italic;
    font-size: 15px !important;
}

.tgs-spec-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 24px;
    border: none !important; 
    background-color: transparent !important;
}

.tgs-spec-table tbody tr {
    border-bottom: 1px solid #E5E7EB; 
}

.tgs-spec-table tbody tr:last-child {
    border-bottom: none;
}

.tgs-spec-table th, 
.tgs-spec-table td {
    padding: 16px 0; 
    border: none !important; 
    background-color: transparent !important;
    vertical-align: top;
    font-size: 16px;
    line-height: 1.5;
}

.tgs-spec-table th,
.tgs-spec-table th p,
.tgs-spec-table th span {
    width: 25%;
    text-align: left !important;
    font-weight: 700 !important; 
    color: #1F1F1F !important; 
    text-transform: none !important; 
}

.tgs-spec-table td {
    width: 75%;
    text-align: right !important; 
    font-weight: 500;
    color: #1F1F1F !important; 
}

.tgs-note-red {
    color: #DC2626;
    font-weight: 500;
    font-size: 14px;
}


/* ==========================================================================
   5. CÁC THÀNH PHẦN GIAO DIỆN KHÁC (TABS, ACCORDION, SLIDER)
   ========================================================================== */
.tab-tu-van {
    border-radius: 24px;
    background: #FFF1DB;
    padding: 36px 21px;
}

.tab-tu-van .nav {
    background-color: transparent;
}

.tab-tu-van .nav-line-bottom {
    justify-content: space-between;
    margin: 0;
    width: 100%;
    flex-wrap: nowrap;
    position: relative; 
}

.tab-tu-van .nav-line-bottom span {
    font-family: 'iCiel BCCubano', sans-serif;
    font-size: 24px;
    font-weight: 400;
}

.tab-tu-van .nav-line-bottom .tab {
    width: 100%;
    text-align: center;
}

.nav-line-bottom > li > a:before {
    background-color: #F9A51E;
    height: 6px;
}

.tab-tu-van .nav-line-bottom:before {
    content: "";
    width: 100%;
    position: absolute;
    bottom: 4px;
    background-color: #FFDCA4;
    height: 2px;
}

.cau-hoi-thuong-gap .accordion-item:first-child .accordion-title {
    border-top: none;
}

.cau-hoi-thuong-gap .toggle {
    right: 0;
    left: auto;
    top: 24px;
}

.accordion-title {
    padding: 24px 0px;
    border-top: 1.5px solid #DEDEDE;
}

.accordion-title.active {
    background-color: transparent; 
    padding-bottom: 0;
    border-color: #DEDEDE;
}

.accordion-inner {
    padding: 0;
    padding-top: 16px;
}

.tgs-sp-faq-content .accordion-title span {
    font-weight: 700;
    color: #000;
}

.tgs-sp-faq-content .accordion-title.active span {
    color: #235DA7;
}

.tgs-sp-faq-content p {
    color: #000;
}

.post-slider .flickity-page-dots .dot {
    margin: 0;
    border-radius: 0;
    width: 177px;
    background-color: #FFEDD0;
    opacity: 1;
}

.post-slider .flickity-page-dots .dot:first-child {
    border-radius: 60px 0 0 60px;
}

.post-slider .flickity-page-dots .dot:last-child {
    border-radius: 0 60px 60px 0;
}

.post-slider .flickity-page-dots .dot.is-selected {
    background-color: #235DA7;
}

.slider-nav-light .flickity-page-dots .dot {
    background-color: #fff;
}

.slider-nav-light .flickity-page-dots .dot.is-selected {
    background-color: #F9A51E;
    border-color: #F9A51E;
}

.pcb-section .flickity-prev-next-button,
.tgs-two-row-products .flickity-prev-next-button,
.flickity-slider .flickity-prev-next-button,
.flickity-enabled .flickity-prev-next-button {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px;
    min-height: 40px;
    border-radius: 50% !important;
    border: none !important;
    background: #ffffff !important;
    color: #235DA7 !important;
    box-shadow: 0 2px 8px rgba(35,93,167,0.15) !important;
    opacity: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    margin: 0 !important;
    transition: all .2s ease;
}

.pcb-section .flickity-prev-next-button:hover,
.tgs-two-row-products .flickity-prev-next-button:hover,
.flickity-slider .flickity-prev-next-button:hover,
.flickity-enabled .flickity-prev-next-button:hover {
    background: #235DA7 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(35,93,167,0.3) !important;
}

.pcb-section .flickity-prev-next-button .arrow,
.tgs-two-row-products .flickity-prev-next-button .arrow,
.flickity-slider .flickity-prev-next-button .arrow,
.flickity-enabled .flickity-prev-next-button .arrow,
.pcb-section .flickity-prev-next-button .flickity-button-icon,
.tgs-two-row-products .flickity-prev-next-button .flickity-button-icon,
.flickity-slider .flickity-prev-next-button .flickity-button-icon,
.flickity-enabled .flickity-prev-next-button .flickity-button-icon,
.pcb-section .flickity-prev-next-button svg,
.tgs-two-row-products .flickity-prev-next-button svg,
.flickity-slider .flickity-prev-next-button svg,
.flickity-enabled .flickity-prev-next-button svg {
    display: none !important;
}

.pcb-section .flickity-prev-next-button::before,
.tgs-two-row-products .flickity-prev-next-button::before,
.flickity-slider .flickity-prev-next-button::before,
.flickity-enabled .flickity-prev-next-button::before {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    background-color: currentColor;
}

.pcb-section .flickity-prev-next-button.previous::before,
.tgs-two-row-products .flickity-prev-next-button.previous::before,
.flickity-slider .flickity-prev-next-button.previous::before,
.flickity-enabled .flickity-prev-next-button.previous::before {
    -webkit-mask: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.42243 6.07733C6.74786 6.40277 6.74786 6.9304 6.42243 7.25584L4.51168 9.16659L17.4998 9.16658C17.9601 9.16658 18.3332 9.53968 18.3332 9.99992C18.3332 10.4602 17.9601 10.8333 17.4998 10.8333L4.51168 10.8333L6.42243 12.744C6.74786 13.0694 6.74786 13.5971 6.42243 13.9225C6.09699 14.2479 5.56935 14.2479 5.24391 13.9225L1.91058 10.5892C1.58514 10.2637 1.58514 9.7361 1.91058 9.41066L5.24391 6.07733C5.56935 5.75189 6.09699 5.75189 6.42243 6.07733Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.42243 6.07733C6.74786 6.40277 6.74786 6.9304 6.42243 7.25584L4.51168 9.16659L17.4998 9.16658C17.9601 9.16658 18.3332 9.53968 18.3332 9.99992C18.3332 10.4602 17.9601 10.8333 17.4998 10.8333L4.51168 10.8333L6.42243 12.744C6.74786 13.0694 6.74786 13.5971 6.42243 13.9225C6.09699 14.2479 5.56935 14.2479 5.24391 13.9225L1.91058 10.5892C1.58514 10.2637 1.58514 9.7361 1.91058 9.41066L5.24391 6.07733C5.56935 5.75189 6.09699 5.75189 6.42243 6.07733Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
}
.pcb-section .flickity-prev-next-button.next::before, 
.tgs-two-row-products .flickity-prev-next-button.next::before, 
.flickity-slider .flickity-prev-next-button.next::before, 
.flickity-enabled .flickity-prev-next-button.next::before {
    -webkit-mask: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M13.5772 6.07733C13.9027 5.75189 14.4303 5.75189 14.7558 6.07733L18.0891 9.41066C18.4145 9.7361 18.4145 10.2637 18.0891 10.5892L14.7558 13.9225C14.4303 14.2479 13.9027 14.2479 13.5772 13.9225C13.2518 13.5971 13.2518 13.0694 13.5772 12.744L15.488 10.8333L2.49984 10.8333C2.0396 10.8333 1.6665 10.4602 1.6665 9.99992C1.6665 9.53968 2.0396 9.16658 2.49984 9.16658L15.488 9.16659L13.5772 7.25584C13.2518 6.9304 13.2518 6.40277 13.5772 6.07733Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M13.5772 6.07733C13.9027 5.75189 14.4303 5.75189 14.7558 6.07733L18.0891 9.41066C18.4145 9.7361 18.4145 10.2637 18.0891 10.5892L14.7558 13.9225C14.4303 14.2479 13.9027 14.2479 13.5772 13.9225C13.2518 13.5971 13.2518 13.0694 13.5772 12.744L15.488 10.8333L2.49984 10.8333C2.0396 10.8333 1.6665 10.4602 1.6665 9.99992C1.6665 9.53968 2.0396 9.16658 2.49984 9.16658L15.488 9.16659L13.5772 7.25584C13.2518 6.9304 13.2518 6.40277 13.5772 6.07733Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
    

}
.pcb-section .flickity-prev-next-button:disabled,
.tgs-two-row-products .flickity-prev-next-button:disabled,
.flickity-slider .flickity-prev-next-button:disabled,
.flickity-enabled .flickity-prev-next-button:disabled,
.pcb-section .flickity-prev-next-button[disabled],
.tgs-two-row-products .flickity-prev-next-button[disabled],
.flickity-slider .flickity-prev-next-button[disabled],
.flickity-enabled .flickity-prev-next-button[disabled] {
    opacity: 0.38;
    cursor: not-allowed;
    box-shadow: 0 2px 8px rgba(35,93,167,0.15) !important;
}


/* ==========================================================================
   6. CONTACT FORM 7 TÙY CHỈNH (TIM-SUA-FORM-WRAPPER)
   ========================================================================== */
.wpcf7-form {
    margin: 0;
}

.wpcf7-form-wrapper,
.tim-sua-form-wrapper {
    background: #fff;
    border-radius: 20px;
    padding: 24px;
    margin: 0 auto;
    border: 1px solid #F9A51E;
}
 
.tim-sua-form-wrapper .form-title {
    font-family: 'iCiel BCCubano', sans-serif;
    font-weight: 400;
    font-size: 24px;
    color: #F9A51E;
    text-transform: uppercase;
    margin: 0 0 16px 0;
}
 
.tim-sua-form-wrapper .wpcf7-form-control-wrap label,
.tim-sua-form-wrapper .field-label {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: #333;
    margin-bottom: 8px;
}
 
.tim-sua-form-wrapper .wpcf7-select,
.tim-sua-form-wrapper select {
    width: 100%;
    height: 48px;
    border: 2px solid #e6e6e6;
    border-radius: 8px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-size: 16px;
    color: #8C8D9F;
    cursor: pointer;
    transition: border-color 0.2s, box-shadow 0.2s;
    box-sizing: border-box;
}
 
.tim-sua-form-wrapper .wpcf7-select:focus,
.tim-sua-form-wrapper select:focus {
    outline: none;
    border-color: #f5a623;
    box-shadow: 0 0 0 3px rgba(245, 166, 35, 0.15);
    color: #333;
}
 
.tim-sua-form-wrapper .nhu-cau-label {
    font-size: 14px;
    font-weight: 600;
    color: #000;
    margin: 0px 0 16px 0;
    display: block;
}
 
.tim-sua-form-wrapper .wpcf7-checkbox,
.tim-sua-form-wrapper .checkbox-group {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
}
 
.tim-sua-form-wrapper .wpcf7-list-item,
.tim-sua-form-wrapper .checkbox-item {
    display: flex;
    gap: 10px;
    cursor: pointer;
    margin: 0;
}
 
.tim-sua-form-wrapper .wpcf7-list-item label,
.tim-sua-form-wrapper .checkbox-item label {
    font-size: 14px;
    color: #333;
    font-weight: 400;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
}
 
.tim-sua-form-wrapper .wpcf7-list-item input[type="checkbox"],
.tim-sua-form-wrapper input[type="checkbox"] {
    width: 20px;
    height: 20px;
    border: 1.5px solid #d0c4b0;
    border-radius: 5px;
    background: #fff;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    cursor: pointer;
    position: relative;
    flex-shrink: 0;
    transition: border-color 0.2s, background 0.2s;
    margin: 0;
}
 
.tim-sua-form-wrapper .wpcf7-list-item input[type="checkbox"]:checked,
.tim-sua-form-wrapper input[type="checkbox"]:checked {
    background: #f5a623;
    border-color: #f5a623;
}
 
.tim-sua-form-wrapper .wpcf7-list-item input[type="checkbox"]:checked::after,
.tim-sua-form-wrapper input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    left: 5px;
    top: 2px;
    width: 6px;
    height: 10px;
    border: 2px solid #fff;
    border-top: none;
    border-left: none;
    transform: rotate(45deg);
}
 
.tim-sua-form-wrapper .wpcf7-submit,
.tim-sua-form-wrapper input[type="submit"],
.tim-sua-form-wrapper button[type="submit"] {
    width: 100%;
    padding: 16px;
    margin: 0px;
    background: #f5a623;
    color: #1a3a6b;
    line-height: 1;
    border: none;
    border-radius: 8px;
    font-family: 'iCiel BCCubano', sans-serif;
    font-weight: 400;
    font-size: 18px;
    text-transform: uppercase;
    cursor: pointer;
    transition: background 0.2s, transform 0.15s, box-shadow 0.2s;
    box-shadow: 0 4px 12px rgba(245, 166, 35, 0.35);
}
 
.tim-sua-form-wrapper .wpcf7-submit:hover,
.tim-sua-form-wrapper input[type="submit"]:hover,
.tim-sua-form-wrapper button[type="submit"]:hover {
    background: #e8960f;
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(245, 166, 35, 0.45);
}
 
.tim-sua-form-wrapper .wpcf7-submit:active,
.tim-sua-form-wrapper input[type="submit"]:active {
    transform: translateY(0);
    box-shadow: 0 2px 8px rgba(245, 166, 35, 0.3);
}
 
.wpcf7 .wpcf7-spinner {
    display: none !important;
}
 
.wpcf7-response-output {
    border-radius: 10px !important;
    font-size: 13px !important;
    margin-top: 16px !important;
    padding: 10px 14px !important;
    font-family: 'Be Vietnam Pro', sans-serif !important;
}


/* ==========================================================================
   7. TRANG THANH TOÁN (CHECKOUT & CART)
   ========================================================================== */
.checkout-page-title, 
.wc-empty-cart-message,
.woocommerce-billing-fields h3 {
    display: none;
}

.woocommerce-billing-fields {
    border-top: none;
    padding-top: 0;
}

.tgs-order-table .processing:before {
    display: none;
}

/* User Account Settings */
.my-account .large-3 {
    display: none;
}
.my-account .large-9 {
    width: 100%;
}
.my-account .row {
    justify-content: center;
}


/* ==========================================================================
   8. FOOTER GIAO DIỆN
   ========================================================================== */
.contact-card {
    color: white;
}

.info-row {
    display: flex;
    margin-bottom: 16px;
    line-height: 22px;
    font-size: 16px; 
}

.info-row:last-child {
    margin-bottom: 0;
}

.label {
    font-weight: bold;
    min-width: 100px; 
}

.content {
    flex: 1;
}

.highlight {
    color: #F9A51E; 
    font-weight: bold;
}

#footer h2 {
    font-size: 20px;
    margin-bottom: 16px;
}

.row-footer-divider {
    margin-top: -60px;
    border-bottom: 1px solid rgba(254, 254, 254, 0.15); 
    margin-bottom: 16px;
}

.follow-icons .icon-facebook::before,
.follow-icons .icon-instagram::before,
.follow-icons .icon-tiktok::before,
.follow-icons .icon-youtube::before {
    content: "";
    display: inline-block;
    width: 30px; 
    height: 30px;
    background-color: currentColor;
}

.follow-icons .icon-facebook::before {
    -webkit-mask: url('/wp-content/uploads/2026/05/Group_12611-1.svg') no-repeat center / contain;
    mask: url('/wp-content/uploads/2026/05/Group_12611-1.svg') no-repeat center / contain;
}

.follow-icons .icon-instagram::before {
    -webkit-mask: url('/wp-content/uploads/2026/05/Group_12609.svg') no-repeat center / contain;
    mask: url('/wp-content/uploads/2026/05/Group_12609.svg') no-repeat center / contain;
}

.follow-icons .icon-tiktok::before {
    -webkit-mask: url('/wp-content/uploads/2026/05/Group-512394.svg') no-repeat center / contain;
    mask: url('/wp-content/uploads/2026/05/Group-512394.svg') no-repeat center / contain;
}

.follow-icons .icon-youtube::before {
    -webkit-mask: url('/wp-content/uploads/2026/05/Group_12610.svg') no-repeat center / contain;
    mask: url('/wp-content/uploads/2026/05/Group_12610.svg') no-repeat center / contain;
}

#footer .dark .social-icons .button.is-outline, 
#footer .button.icon:hover, 
#footer .social-icons .button.icon:not(.is-outline) {
    border-color: transparent !important;
    padding: 0;
}

.social-icons .button.icon:hover {
    background-color: transparent !important; 
    transform: translateY(-2px);
    transition: transform 0.3s ease;
}

.social-icons .button.facebook:hover,
.social-icons .button.instagram:hover,
.social-icons .button.tiktok:hover,
.social-icons .button.youtube:hover {
    color: currentColor !important;
}

.col-logo-footer {
    position: relative;
}

.logo-footer {
    position: absolute;
    left: -363px;
    top: -141px;
}

.logo-footer img {
    height: 323px;
    width: 323px;
}


/* ==========================================================================
   9. MEDIA QUERIES (RESPONSIVE) - QUY HOẠCH TỪ LỚN ĐẾN NHỎ
   ========================================================================== */

/* --- Tablet / Màn hình nhỏ (Max-width: 849px) --- */
@media (max-width: 849px) {
    .header-main li.html.custom {
        display: block;
    }

    .pcb-section .flickity-prev-next-button,
    .tgs-two-row-products .flickity-prev-next-button,
    .flickity-slider .flickity-prev-next-button,
    .flickity-enabled .flickity-prev-next-button {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px;
        min-height: 40px;
    }

    .pcb-section .flickity-prev-next-button::before,
    .tgs-two-row-products .flickity-prev-next-button::before,
    .flickity-slider .flickity-prev-next-button::before,
    .flickity-enabled .flickity-prev-next-button::before {
        width: 20px;
        height: 20px;
    }

    .col-margin-bottom {
        margin-bottom: 0px;
    }
}

/* --- Phân đoạn Flickity Button (Max-width: 600px) --- */
@media (max-width: 600px) {
    .pcb-section .flickity-prev-next-button.previous,
    .tgs-two-row-products .flickity-prev-next-button.previous,
    .flickity-slider .flickity-prev-next-button.previous,
    .flickity-enabled .flickity-prev-next-button.previous {
        left: 6px !important;
    }

    .pcb-section .flickity-prev-next-button.next,
    .tgs-two-row-products .flickity-prev-next-button.next,
    .flickity-slider .flickity-prev-next-button.next,
    .flickity-enabled .flickity-prev-next-button.next {
        right: 6px !important;
    }
}

/* --- Mobile chuẩn Bootstrap (Max-width: 576px) --- */
@media (max-width: 576px) {
    .tgs-catalog-heading__shop {
        font-size: 24px;
    }
    .sec-danh-muc {
        padding-top: 16px !important;
        padding-bottom: 16px !important;
    }
}

/* --- Mobile chung cũ (Max-width: 567px) --- */
@media (max-width: 567px) {
    .tgs-sp-summary__price span.amount.woocommerce-Price-amount {
        font-size: 20px;
    }
    .custom-product-archive {
        padding: 10px;
    }
    .sec-banner-home, 
    .sec-banner-home .col {
        padding: 0px;
        padding-top: 0!important;
    }
    .tab-tu-van .nav-line-bottom .tab {
        width: auto;
    }
    .tab-tu-van .nav-line-bottom span {
        font-size: 18px;
    }
}

/* --- Mobile nhỏ Flatsome (Max-width: 549px) --- */
@media (max-width: 549px) {
    .tieu-de h2 {
        font-size: 28px;
    }
    .sec-category-banner {
        border-bottom: 2px solid #235DA7;
    }
    .category-banner-home {
        margin-bottom: 0px;
    }
}

/* --- Mobile UX/UI Flatsome chung (Max-width: 48em tương đương ~768px) --- */
@media only screen and (max-width: 48em) {

    /* 1. XÓA TRIỆT ĐỂ HEADER CŨ VÀ CÁC THẺ GÂY KHOẢNG TRẮNG */
    #header, .header-wrapper, .header-bg, .sticky-dummy { 
        display: none !important; height: 0 !important; 
    }
    
    /* 2. CHỈ ÉP DUY NHẤT MAIN CÁCH ĐỈNH 60PX (Để né thanh tìm kiếm) */
    #wrapper, #content, .page-wrapper { 
        overflow-x: clip; padding-top: 0 !important; margin-top: 0 !important; 
    }
    #main { 
        overflow-x: clip; padding-top: 60px !important; margin-top: 0 !important; 
    }

    .header-inner {
        padding: 0 16px;
        border-radius: 28px;
    }

    .tabbed-content .nav {
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        justify-content: flex-start;
        flex-wrap: nowrap;
        padding: 4px;
        border-radius: 24px;
    }

    .tab-home .nav > li {
        flex: 0 0 auto;
    }

    .tab-home .nav > li > a {
        padding: 8px 16px;
        font-size: 14px;
        line-height: 20px;
        white-space: nowrap;
    }

    .custom-product-archive {
        padding: 0 16px;
    }

    .tgs-sp-summary__intro ul li {
        margin-left: 20px;
    }

    .tgs-sp-summary__price span.amount.woocommerce-Price-amount {
        font-size: 24px;
        line-height: 1.25;
    }

    .tgs-single-product__top button {
        min-height: 40px;
        min-width: 40px;
    }

    .variations tr {
        align-items: flex-start;
        gap: 8px;
    }

    .variations td,
    .variations th {
        display: block;
        width: 100%;
    }

    .tab-tu-van {
        padding: 20px 16px;
        border-radius: 16px;
    }

    .tab-tu-van .nav-line-bottom {
        gap: 12px;
        overflow-x: auto;
        overflow-y: hidden;
        padding-bottom: 8px;
        scrollbar-width: none;
    }

    .tab-tu-van .nav-line-bottom::-webkit-scrollbar,
    .tabbed-content .nav::-webkit-scrollbar {
        display: none;
    }

    .tab-tu-van .nav-line-bottom .tab {
        min-width: max-content;
        width: auto;
        flex: 0 0 auto;
    }

    .tab-tu-van .nav-line-bottom span {
        font-size: 18px;
        white-space: nowrap;
    }

    .nav-line-bottom>li>a:before {
        height: 4px;
    }

    .accordion-title {
        padding: 18px 0;
    }

    .wpcf7-form-wrapper,
    .tim-sua-form-wrapper {
        padding: 18px 16px;
        border-radius: 16px;
    }

    .tim-sua-form-wrapper .form-title {
        font-size: 20px;
        line-height: 1.2;
    }

    .tim-sua-form-wrapper .wpcf7-select,
    .tim-sua-form-wrapper select {
        height: 44px;
        font-size: 15px;
    }

    .tim-sua-form-wrapper .wpcf7-submit,
    .tim-sua-form-wrapper input[type="submit"],
    .tim-sua-form-wrapper button[type="submit"] {
        padding: 14px 16px;
        font-size: 16px;
    }

    .info-row {
        flex-direction: row;
        gap: 4px;
        font-size: 14px;
        line-height: 20px;
    }

    .label {
        min-width: 0;
    }

    #footer h2 {
        font-size: 18px;
        line-height: 1.3;
    }

    .row-footer-divider {
        margin-top: 0;
    }

    .post-slider .flickity-page-dots .dot {
        width: 64px;
    }

    .gallery-home .box-image img {
        height: 56px;
    }

    /* Mobile Specs Table */
    .tgs-spec-table th, 
    .tgs-spec-table td {
        display: block;
        width: 100%;
        text-align: left !important; 
        padding: 6px 0;
    }
  
    .tgs-spec-table th {
        padding-top: 16px;
        font-size: 14px;
    }
  
    .tgs-spec-table td {
        padding-top: 0;
        padding-bottom: 16px;
        font-size: 15px;
    }

    /* Support Bar */
    .support-bar { gap: 14px; padding: 14px 16px; } 
    .support-title { width: 100%; }
}
@media (max-width: 1500px){
    #header, .header-wrapper, .header-bg, .sticky-dummy { 
        display: none !important; height: 0 !important; 
    }
	.tgs-mth-logo img { 
        max-height: 100%; 
        width: 100%; 
        object-fit: contain; 
        object-position: left; 
    }
	/* Giới hạn chiều rộng Logo để không chèn ép thanh tìm kiếm */
    .tgs-mth-logo { 
        flex: 0 0 auto; 
        height: 36px; 
        max-width: 140px; 
        display: flex; 
        align-items: center; 
    }
}

.support-bar { 
    background: #FFF1DB; 
    padding: 18px 28px; 
    display: flex; 
    align-items: center; 
    justify-content: space-between; 
    gap: 40px; 
    flex-wrap: nowrap; 
} 
.support-title { 
    margin: 0; 
    color: #235DA7; 
    font-size: 20px; 
    font-weight: 400; 
    line-height: 1.2; 
} 
.support-item { 
    display: inline-flex; 
    align-items: center; 
    gap: 10px; 
    color: #222; 
    font-size: 16px; 
    text-decoration: none; 
    line-height: 1.2; 
    white-space: nowrap; 
} 
.support-item:hover { 
    opacity: 0.85; 
} 
.icon-wrap { 
    width: 24px; 
    height: 24px; 
    display: inline-flex; 
    align-items: center; 
    justify-content: center; 
    flex: 0 0 24px; 
} 
.icon-wrap svg { 
    width: 24px; 
    height: 24px; 
    display: block; 
}


/* ==========================================================================
   10. MOBILE BOTTOM NAV (MENU CHUNG)
   ========================================================================== */
.tgs-mobile-bottom-nav {
    display: none;
}

@media (max-width: 1500px) {
    .tgs-mobile-bottom-nav {
        position: fixed;
        width: 100%;
        bottom: 0px;
        z-index: 9998;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        align-items: stretch;
        background: #ffffff;
        box-shadow: 0 10px 26px rgba(19, 36, 67, 0.38);
        overflow: hidden;
    }

    .tgs-mobile-bottom-nav__item {
        min-height: 62px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
        color: #4b5563;
        text-decoration: none;
        background: #ffffff;
        border-right: 1px solid #f0f2f7;
        transition: color 0.2s ease, background-color 0.2s ease;
    }

    .tgs-mobile-bottom-nav__item:last-child {
        border-right: 0;
    }

    .tgs-mobile-bottom-nav__icon {
        width: 22px;
        height: 22px;
        line-height: 0;
    }

    .tgs-mobile-bottom-nav__icon svg {
        width: 22px;
        height: 22px;
        display: block;
    }

    .tgs-mobile-bottom-nav__label {
        font-size: 12px;
        line-height: 1.15;
        font-weight: 500;
        text-align: center;
    }

    .tgs-mobile-bottom-nav__item.is-active {
        color: #f5a623;
        background: #f4f8ff;
    }

    .tgs-mobile-bottom-nav__item:active {
        background: #edf3ff;
    }

    .tgs-mobile-cart-host .ccd-cart-wrapper {
        display: none !important;
    }

    .off-canvas-open .tgs-mobile-bottom-nav {
        opacity: 0;
        pointer-events: none;
    }
}


/* ==========================================================================
   11. MOBILE PWA UI (STICKY BAR, POPUP & TOP NAV OVERLAY)
   ========================================================================== */

/* Ẩn hoàn toàn hệ thống Mobile UI trên PC */
.tgs-sheet-overlay,
.tgs-sheet-close,
.tgs-sticky-bar,
.tgs-sp-top-nav-mobile {
    display: none !important;
}

@media (max-width: 768px) {

    /* --- SETUP CHUNG TRANG SẢN PHẨM --- */
    .single-product body,
    body.single-product {
        padding-bottom: 75px !important;
    }

    /* Ẩn các thành phần thừa trên Mobile */
    .single-product .tgs-mobile-bottom-nav,
    .tgs-sp-summary button.single_add_to_cart_button,
    .tgs-sp-summary .tgs-buy-now,
    .tgs-sp-breadcrumb {
        display: none !important;
    }

    .tgs-sp-gallery {
        position: relative !important;
    }

    /* --- A. THANH MUA HÀNG ĐÁY (STICKY BAR) --- */
    .tgs-sticky-bar {
        display: block !important;
        position: fixed;
        bottom: 0; left: 0; right: 0;
        z-index: 9997;
        background: #ffffff;
        box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.12);
        border-top: 1px solid #e5e5e5;
    }

    .tgs-sticky-bar__inner {
        display: flex;
        align-items: center;
        padding: 12px 16px !important;
        padding-bottom: calc(12px + env(safe-area-inset-bottom)) !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .tgs-sticky-bar__info {
       display: none !important;
    }

    .tgs-sticky-bar__actions {
        width: 100% !important;
        display: flex;
        gap: 12px;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    .tgs-sticky-bar__btn {
        display: inline-flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        border-radius: 8px;
        cursor: pointer;
        text-decoration: none;
        height: 48px !important;
        font-family: 'iCiel BCCubano', sans-serif;
        transition: all 0.1s ease;
        padding: 0 5px !important;
        box-sizing: border-box !important;
        width: auto !important;
        flex-shrink: 0;
    }

    .tgs-sticky-bar__btn:active {
        transform: scale(0.96);
    }

    /* Nút Thêm Vào Giỏ (Tỷ lệ 4.5) */
    .tgs-sticky-bar__btn--cart {
        flex: 4.5 !important;
        background: #ECF5FF;
        color: #245fae;
        border: 1px solid #2b67b8;
        flex-direction: row !important; 
        gap: 8px !important;
    }

    .tgs-sticky-bar__btn--cart svg {
        width: 22px !important; 
        height: 22px !important;
        margin: 0 !important;
    }

    .tgs-sticky-bar__btn--cart .btn-text {
        font-size: 14px !important;
        text-transform: uppercase;
    }

    /* Nút Mua Ngay (Tỷ lệ 5.5) */
    .tgs-sticky-bar__btn--buy {
        flex: 5.5 !important;
        background: #F9A51E;
        color: #235DA7;
        border: none;
    }

    .tgs-sticky-bar__btn--buy .btn-text {
        font-size: 14px;
        text-transform: uppercase;
        line-height: 1.1;
    }

    .tgs-sticky-bar__btn--buy .btn-price {
        font-size: 14px;
        font-family: 'iCiel BCCubano', sans-serif;
        font-weight: 400; 
        line-height: 1.2;
        display: block;
        white-space: normal !important;
        overflow: visible !important;
    }

    .tgs-sticky-bar__btn--buy .btn-price * {
        font-size: 14px !important;
        font-family: 'iCiel BCCubano', sans-serif !important;
        color: inherit !important;
        font-weight: 400 !important;
        margin: 0;
        background: transparent !important;
    }

    .tgs-sticky-bar__btn--buy .btn-price del {
        display: none !important;
    }

    /* --- B. HIỆU ỨNG POPUP (BOTTOM SHEET) --- */
    .tgs-sheet-overlay {
        display: block !important;
        position: fixed; top: 0; left: 0; width: 100%; height: 100%;
        background: rgba(0, 0, 0, 0.5);
        z-index: 9998;
        opacity: 0; visibility: hidden;
        transition: opacity 0.3s ease;
    }

    body.tgs-show-sheet .tgs-sheet-overlay {
        opacity: 1; visibility: visible;
    }

    .tgs-sp-summary__purchase {
        position: fixed !important;
        bottom: 0; left: 0; width: 100%;
        background: #fff;
        z-index: 9999;
        padding: 40px 16px 20px !important; 
        border-radius: 20px 20px 0 0;
        transform: translateY(100%);
        visibility: hidden;
        transition: transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1), visibility 0.3s;
        margin: 0 !important;
        box-shadow: 0 -4px 20px rgba(0,0,0,0.15);
        box-sizing: border-box !important;
    }

    body.tgs-show-sheet .tgs-sp-summary__purchase {
        transform: translateY(0);
        visibility: visible;
    }

    .tgs-sheet-close {
        display: flex !important;
        position: absolute; top: 12px; right: 16px;
        width: 30px; height: 30px;
        background: #f1f2f6; border-radius: 50%;
        align-items: center; justify-content: center;
        color: #555; cursor: pointer;
    }

    /* --- C. FORM GIỎ HÀNG TRONG POPUP --- */
    
    .tgs-like-btn, 
    .tgs-share-btn { 
        display: none !important; 
    }

    .tgs-sp-summary form.cart,
    .tgs-sp-summary .woocommerce-variation-add-to-cart {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        gap: 12px !important;
    }

    /* Hiển thị Giá */
    .tgs-sp-summary .woocommerce-variation-price,
    .tgs-sp-summary .price {
        flex: 0 0 100% !important;
        width: 100% !important;
        font-size: 20px !important;
        font-weight: 700 !important;
        color: #F9A51E !important;
        margin-bottom: 8px !important;
        text-align: left !important;
    }

    /* Bộ Đếm Số Lượng */
    .tgs-sp-summary .quantity.buttons_added {
        flex: 0 0 100% !important;
        display: flex !important;
        width: 100% !important;
        margin: 0 0 16px 0 !important;
        border: none !important;
    }

    .tgs-sp-summary .quantity.buttons_added::before {
        content: "Số lượng";
        display: flex; align-items: center;
        margin-right: auto; 
        font-family: sans-serif; font-size: 15px; font-weight: 600; color: #333;
    }

    .tgs-sp-summary .quantity.buttons_added .minus,
    .tgs-sp-summary .quantity.buttons_added .plus,
    .tgs-sp-summary .quantity.buttons_added .qty {
        border: 1px solid #DEDEDE !important; 
        height: 40px !important;
    }

    .tgs-sp-summary .quantity.buttons_added .minus { border-radius: 6px 0 0 6px !important; border-right: none !important;}
    .tgs-sp-summary .quantity.buttons_added .plus { border-radius: 0 6px 6px 0 !important; border-left: none !important;}

    /* Nút Submit (Xác Nhận) - Tỷ lệ 50/50 */
    .tgs-sp-summary button.single_add_to_cart_button,
    .tgs-sp-summary button.tgs-buy-now,
    .tgs-sp-summary .tgs-buy-now {
        flex: 1 !important;
        width: calc(50% - 6px) !important;
        height: 48px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 0 !important;
        margin: 0 !important;
        border-radius: 8px !important;
        line-height: 1 !important;
        text-transform: uppercase !important;
        max-width: none !important;
    }

    /* Điều chỉnh hiển thị Giá và Label THÊM VÀO GIỎ */
    .tgs-sp-summary button.single_add_to_cart_button {
        background-color: #ECF5FF !important;
        color: #245fae !important;
        border: 1px solid #2b67b8 !important;
        flex-direction: row !important;
        gap: 8px !important;
    }

    /* Đổi font chữ nút Thêm vào giỏ thành iCiel BCCubano */
    .tgs-sp-summary button.single_add_to_cart_button span,
    .tgs-sp-summary button.single_add_to_cart_button * {
        display: inline-block !important;
        opacity: 1 !important;
        visibility: visible !important;
        position: static !important;
        width: auto !important;
        height: auto !important;
        color: #245fae !important;
        font-size: 14px !important; /* Kích thước cân đối */
        font-family: 'iCiel BCCubano', sans-serif !important; /* Dùng font chuẩn */
        font-weight: normal !important; /* Tắt in đậm để dùng form chữ chuẩn */
        text-transform: uppercase !important;
        margin: 0 !important;
    }

    /* Ẩn dấu phân cách dọc | và icon giỏ hàng thừa */
    .tgs-sp-summary button.single_add_to_cart_button i,
    .tgs-sp-summary button.single_add_to_cart_button::after,
    .tgs-sp-summary button.single_add_to_cart_button::before,
    .tgs-sp-summary button.single_add_to_cart_button .tgs-atc-divider {
        display: none !important; 
    }

    .tgs-sp-summary button.tgs-buy-now,
    .tgs-sp-summary .tgs-buy-now {
        background-color: #F9A51E !important;
        color: #235DA7 !important;
        border: none !important;
        font-family: 'iCiel BCCubano', sans-serif !important;
        font-size: 15px !important;
    }

    /* --- D. TOP NAV OVERLAY (NÚT NỔI TRÊN ẢNH) --- */
    .tgs-sp-top-nav-mobile {
        display: flex !important;
        justify-content: space-between;
        align-items: flex-start;
        position: fixed !important;
        top: 72px; left: 12px; right: 12px;
        z-index: 9990 !important;
        pointer-events: none;
    }

    .tgs-sp-top-nav-right {
        display: flex;
        gap: 8px;
    }

    .tgs-sp-top-btn {
        width: 34px; height: 34px;
        border-radius: 50%;
        background: rgba(0, 0, 0, 0.45);
        display: flex; align-items: center; justify-content: center;
        color: #ffffff !important;
        text-decoration: none;
        pointer-events: auto; 
        position: relative;
        backdrop-filter: blur(4px);
        -webkit-backdrop-filter: blur(4px);
        transition: transform 0.1s ease;
    }

    .tgs-sp-top-btn:active {
        background: rgba(0, 0, 0, 0.65);
        transform: scale(0.92);
    }

    .tgs-sp-top-btn svg {
        color: #ffffff;
    }

    .tgs-cart-badge {
        position: absolute;
        top: -4px; right: -4px;
        background: #F9A51E; color: #ffffff;
        font-size: 10px; font-weight: 700; font-family: sans-serif;
        min-width: 16px; height: 16px; padding: 0 4px;
        display: flex; align-items: center; justify-content: center;
        border-radius: 10px; border: 1px solid #fff;
        line-height: 1;
    }

    /* Thanh Header cố định trên cùng */
    .tgs-mobile-top-header {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        position: fixed;
        top: 0; left: 0; right: 0;
        height: 60px;
        background: #ffffff; 
        z-index: 99 !important; 
        padding: 0 12px;
        gap: 16px;
        box-shadow: 0 2px 10px rgba(0,0,0,0.08);
    }

    
    
    

    /* Thanh tìm kiếm */
    .tgs-mth-search { flex: 1 1 auto; width: 100%; }
    .tgs-mth-search form { margin: 0 !important; padding: 0 !important; }
    
    .tgs-mth-search-box {
        display: flex; align-items: center; 
        background: #f4f5f7; border: 1px solid #e1e3e8;
        border-radius: 99px; height: 40px; padding: 0 12px;
    }
    
    .tgs-mth-search-box button {
        background: transparent !important; border: none !important;
        padding: 0 !important; margin: 0 8px 0 0 !important;
        display: flex; align-items: center; justify-content: center;
        box-shadow: none !important; min-height: auto; width: auto;
    }
    
    .tgs-mth-search-box input {
        flex: 1; border: none !important; background: transparent !important;
        padding: 0 !important; margin: 0 !important; height: 100% !important;
        font-size: 14px !important; color: #333 !important; box-shadow: none !important;
    }
    
}
@media (max-width: 1500px){
	    .tgs-mobile-top-header {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        height: 60px;
        background: #ffffff;
        z-index: 99 !important;
        padding: 0 12px;
        gap: 16px;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    }
}

/* ==========================================================================
   12. MOBILE DANH MỤC SPLIT MENU
   ========================================================================== */
@media (min-width: 768px) {
    .tgs-dynamic-brands-container { display: none !important; }
}

@media (max-width: 768px) {
    /* HIỆU ỨNG TRƯỢT TỪ DƯỚI LÊN GIỐNG APP */
    .off-canvas-left .mfp-content, 
    .off-canvas-right .mfp-content {
        width: 100% !important; max-width: 100% !important; background-color: #fff !important; display: flex;
        transform: translateY(100%) translateX(0) !important; 
        transition: transform 0.15s cubic-bezier(0.2, 0.8, 0.2, 1) !important;
        margin: auto 0 0 0 !important; 
        /* Cắt đỉnh chừa đúng 60px của Search Bar */
        height: 100% !important;
        height: calc(100% - 60px) !important; 
        height: calc(100dvh - 60px) !important; 
        border-radius: 20px 20px 0 0 !important; 
        overflow: hidden !important;
        top: auto !important; bottom: 0 !important;
    }

    .off-canvas-left.mfp-ready .mfp-content, 
    .off-canvas-right.mfp-ready .mfp-content { transform: translateY(0) translateX(0) !important; }
    .off-canvas-left.mfp-removing .mfp-content,
    .off-canvas-right.mfp-removing .mfp-content { transform: translateY(100%) translateX(0) !important; }

	
	
    .mobile-sidebar {
        width: 100% !important; max-width: 100% !important; background-color: transparent !important; display: flex;
        height: 100% !important;
        position: relative !important; 
        padding: 0 !important; margin: 0 !important;
    }
    .mobile-sidebar-inner { 
        width: 100% !important; display: flex !important; height: 100% !important; 
        position: relative !important; 
        padding: 0 !important; margin: 0 !important; 
    }

    /* Ẩn rác mặc định của Flatsome */
    .mobile-sidebar .mobile-sidebar-title, .mobile-sidebar .header-search-form, .mobile-sidebar .nav-divider,
    .mobile-sidebar .logo, .mobile-sidebar .widget_media_image, ul.nav-sidebar > li.menu-item-home,
    ul.nav-sidebar > li.header-button, ul.nav-sidebar > li:has(.icon-home), ul.nav-sidebar > li.html:first-child,
    ul.nav-sidebar > li.html:has(img[src*="logo"]), ul.nav-sidebar > li.html:has(a[href*="thegioisua.com"]) {
        display: none !important;
    }

    /* 2. CỘT TRÁI (DANH MỤC) */
    ul.nav-sidebar {
        display: block !important; 
        width: 135px !important; 
        height: 100% !important; 
        overflow-y: auto !important; 
        overflow-x: hidden !important; /* KHÓA TRỤC X */
        background: #E4E8ED !important; 
        border-right: 1px solid #D2D7E0 !important; 
        margin: 0 !important; padding: 0 0 80px 0 !important; 
        flex-shrink: 0 !important;
        -webkit-overflow-scrolling: touch !important;
        
        /* Đưa cột trái nổi lên cao nhất để che mọi thứ rò rỉ */
        position: relative !important; 
        z-index: 99 !important;
    }
    
    ul.nav-sidebar > li { 
        border-bottom: 1px solid #e1e3e8; padding: 0 !important; margin: 0 !important; 
        /* CHÌA KHÓA 1: TRẢ LẠI RELATIVE ĐỂ NHỐT CÁC TAB KHÔNG BỊ RÒ RỈ CHỒNG CHÉO */
        position: relative !important; 
    }
    
    ul.nav-sidebar > li > a {
        display: flex !important; flex-direction: column; align-items: center; justify-content: center; text-align: center; 
        width: 100% !important; box-sizing: border-box !important;
        padding: 14px 6px !important; 
        font-size: 13px !important; font-weight: 500 !important; color: #444 !important; min-height: 60px; 
        white-space: normal !important; word-wrap: break-word !important; overflow-wrap: break-word !important; line-height: 1.35; 
        background: transparent; text-transform: none !important;
        position: relative !important; z-index: 20 !important; 
    }

    ul.nav-sidebar > li > a[href*="he-thong-cua-hang"],
    ul.nav-sidebar > li.header-button > a {
        background-color: transparent !important; color: #444 !important; border-radius: 0 !important; box-shadow: none !important; padding: 14px 6px !important; min-height: 60px !important; font-weight: 500 !important; margin: 0 !important; position: relative !important; z-index: 20 !important; border: none !important;
    }

    ul.nav-sidebar > li.current-menu-item > a[href*="he-thong-cua-hang"],
    ul.nav-sidebar > li.current-menu-item.header-button > a,
    ul.nav-sidebar > li.tgs-tab-active > a[href*="he-thong-cua-hang"],
    ul.nav-sidebar > li.header-button.tgs-tab-active > a {
        background-color: #fff !important; color: #235DA7 !important; font-weight: 700 !important; 
    }

    ul.nav-sidebar > li.current-menu-item > a[href*="he-thong-cua-hang"]::before,
    ul.nav-sidebar > li.current-menu-item.header-button > a::before,
    ul.nav-sidebar > li.tgs-tab-active > a[href*="he-thong-cua-hang"]::before,
    ul.nav-sidebar > li.header-button.tgs-tab-active > a::before {
        content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background-color: #235DA7; z-index: 21;
    }

    ul.nav-sidebar > li:has(.wpml-ls-item) { margin-top: 24px !important; }

    /* Trạng thái Active */
    ul.nav-sidebar > li.tgs-tab-active > a {
        background-color: #fff !important; color: #235DA7 !important; font-weight: 700 !important; 
        margin-right: -1px !important; border-right: 1px solid #fff !important; 
    }
    
    ul.nav-sidebar > li.tgs-tab-active > a::before {
        content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background-color: #235DA7; z-index: 21;
    }

    /* ẨN MÀNG ẢO LỖI FLATSOME */
    ul.nav-sidebar > li > .toggle { display: none !important; }

   /* 3. CỘT PHẢI (HÃNG SỮA & SUBMENU) */
    ul.nav-sidebar > li > .sub-menu,
    ul.nav-sidebar > li > ul.children {
        /* CHÌA KHÓA 2: FIXED ĐỂ NEO VÀO CẠNH MÀN HÌNH (THAY VÌ ĐEO BÁM THEO TAB GÂY TRÀN) */
        position: fixed !important; 
        top: auto !important; bottom: 0 !important; right: 0 !important;
        left: 135px !important; /* Dạt sang bằng độ rộng cột trái */
        width: calc(100% - 135px) !important; 
        height: calc(100dvh - 60px) !important; /* Ép khớp theo khung tổng Popup */
        background: #fff !important; 
        overflow-y: auto !important; overflow-x: hidden !important; 
        padding: 16px 14px 100px 16px !important; 
        
        /* CHÌA KHÓA 3: ẨN SẠCH CÁC CỘT HÃNG SỮA, CHỈ CHO PHÉP HIỂN THỊ KHI CÓ LỆNH (Z-INDEX BỊ ĐÈ BỞI CỘT TRÁI) */
        display: none !important; 
        opacity: 0 !important;
        visibility: hidden !important;
        z-index: 10 !important; 
        
        border: none !important; margin: 0 !important; 
        -webkit-overflow-scrolling: touch !important; 
        
        /* CHÌA KHÓA 4: ÉP CARD ĐỒ HỌA MÁY TÍNH XỬ LÝ RIÊNG, KHÔNG BỊ LỖI CHỒNG HÌNH TÀNG HÌNH */
        transform: translateZ(0) !important;
        will-change: transform, opacity !important;
    }

    ul.nav-sidebar > li.tgs-tab-active > .sub-menu,
    ul.nav-sidebar > li.tgs-tab-active > ul.children {
        /* CHÌA KHÓA 5: CHỈ DUY NHẤT CỘT HÃNG SỮA ĐƯỢC CHỌN LÀ ĐƯỢC BUNG RA */
        display: block !important; 
        visibility: visible !important; 
        opacity: 1 !important; 
        max-height: none !important;
    }

    /* TIÊU ĐỀ HÃNG SỮA / PHÂN LOẠI */
    .tgs-brand-head { 
        font-size: 15px !important; color: #333 !important; font-weight: 700 !important; line-height: 1.2; display: flex; justify-content: space-between; align-items: center !important; border-bottom: none !important; margin-bottom: 8px !important; 
        padding: 0 0 12px 0 !important; 
    }
    .tgs-brand-head span { flex: 1; min-width: 0; word-wrap: break-word; }
    
    .tgs-view-all { 
        font-size: 13px !important; color: #235DA7 !important; font-weight: 500 !important; text-decoration: none !important; white-space: nowrap; flex-shrink: 0; margin-left: 12px; display: flex !important; align-items: center !important; text-transform: none !important;
    }
}

/* ==========================================================================
   4. LƯỚI HÃNG SỮA (BRAND GRID)
   ========================================================================== */
@media (min-width: 481px) and (max-width: 768px) {
    ul.nav-sidebar > li > .sub-menu,
    ul.nav-sidebar > li > ul.children { width: calc(100% - 135px) !important; }
}

@media (max-width: 768px) {
    .tgs-brand-grid { 
        display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 10px !important; margin: 0 0 24px 0 !important; padding: 0 !important; width: 100% !important; box-sizing: border-box !important;
    }
    .tgs-brand-grid::after { display: none !important; }
    .tgs-brand-grid::-webkit-scrollbar { display: none !important; }

    .tgs-brand-pill {
        margin: 0 auto !important; padding: 4px !important; border: 1px solid #e1e3e8 !important; border-radius: 6px !important; background: #fff !important; display: flex !important; align-items: center; justify-content: center; width: 100% !important; max-width: 100px !important; height: 52px !important; font-size: 0 !important; color: transparent !important; box-sizing: border-box !important; overflow: hidden !important;
    }
    
    .tgs-brand-pill img {
        max-height: 85% !important; max-width: 90% !important;  margin: auto !important; display: block !important; object-fit: contain !important; mix-blend-mode: multiply !important; transition: transform 0.2s ease !important;
    }

    /* Scale Zoom 1.2 cho 768px */
	.tgs-brand-pill img[alt*="blackmores" i] { 
		transform: scale(1.2) !important; }
	
	/* Scale Zoom 1.4 cho 768px */
	.tgs-brand-pill img[alt*="frieslandcampina" i],
	.tgs-brand-pill img[alt*="nestle" i],
	.tgs-brand-pill img[alt*="abbott" i],
	.tgs-brand-pill img[alt*="fasska" i],
	.tgs-brand-pill img[alt*="fontactiv" i],
	.tgs-brand-pill img[alt*="vinamilk" i],
	.tgs-brand-pill img[alt*="Mộc Châu" i],
	.tgs-brand-pill img[alt*="meiji" i],
	.tgs-brand-pill img[alt*="opko" i],
	.tgs-brand-pill img[alt*="nutricare" i],
	.tgs-brand-pill img[alt*="meadjohnson" i] { 
		transform: scale(1.4) !important; }
	
	/* Scale zoom 1.5 cho 768px */
    .tgs-brand-pill img[alt*="pigeon" i], 
	.tgs-brand-pill img[alt*="farlin" i],  
	.tgs-brand-pill img[alt*="nutimilk" i],
	.tgs-brand-pill img[alt*="dreavia" i],
	.tgs-brand-pill img[alt*="hipp" i] { 
		transform: scale(1.5) !important; }
    
	/* Scale zoom 1.6 cho 768px*/
	.tgs-brand-pill img[alt*="caryn" i], 
	.tgs-brand-pill img[alt*="farlin" i],  
	.tgs-brand-pill img[alt*="dokma" i], 
	.tgs-brand-pill img[alt*="momotaro" i],
	.tgs-brand-pill img[alt*="love in farm" i],
	.tgs-brand-pill img[alt*="th" i],
	.tgs-brand-pill img[alt*="nutifood" i] {
		transform: scale(1.6) !important; }
	
	/* Scale zoom 1.7 cho 768px */
	.tgs-brand-pill img[alt*="Ngũ Cốc Việt Đài" i] {
		transform: scale(1.7) !important
	}
	
	/* Scale zoom 1.9 cho 768px */
	.tgs-brand-pill img[alt*="fonterra" i],
	.tgs-brand-pill img[alt*="huggies" i],
	.tgs-brand-pill img[alt*="goo:by" i] {
		transform: scale(1.9) !important
	}
	
	/* Scale zoom 2.0 cho 768px */
    .tgs-brand-pill img[alt*="bobby" i] { 
		transform: scale(2) !important; }
	
}
	
/* ĐIỀU CHỈNH CHO ĐIỆN THOẠI LỚN & VỪA (MAX-WIDTH: 480PX) */
@media (max-width: 480px) {
    ul.nav-sidebar { width: 110px !important; } 
    ul.nav-sidebar > li > .sub-menu,
    ul.nav-sidebar > li > ul.children {
        left: 110px !important;
        width: calc(100% - 110px) !important;
        padding: 16px 14px 100px 14px !important; 
    }
    .tgs-brand-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 8px !important; }
    .tgs-brand-pill { max-width: 88px !important; height: 46px !important; padding: 2px !important; }
}

/* ĐIỀU CHỈNH CHO ĐIỆN THOẠI NHỎ (MAX-WIDTH: 390PX) */
@media (max-width: 390px) {
    ul.nav-sidebar { width: 100px !important; }
    ul.nav-sidebar > li > a { font-size: 12px !important; padding: 12px 2px !important; }
    ul.nav-sidebar > li > .sub-menu,
    ul.nav-sidebar > li > ul.children {
        left: 100px !important;
        width: calc(100% - 100px) !important;
        padding: 14px 10px 100px 12px !important; 
    }
    .tgs-brand-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
    .tgs-brand-pill { max-width: 100% !important; height: 44px !important; padding: 4px !important; }
    .tgs-brand-head { font-size: 14px !important; }
    .tgs-view-all { font-size: 12px !important; margin-left: 8px !important; }
    
	/* Scale zoom 1.3 cho 390px */
    .tgs-brand-pill img[alt*="vinamilk" i], 
	.tgs-brand-pill img[alt*="nutricare" i], 
	.tgs-brand-pill img[alt*="huggies" i],
	.tgs-brand-pill img[alt*="bobby" i],
	.tgs-brand-pill img[alt*="th" i],
	.tgs-brand-pill img[alt*="goo:by" i] { 
		transform: scale(1.3) !important; }
	
	/* Scale zoom 1.4 cho 390px */
	.tgs-brand-pill img[alt*="fonterra" i] {
		transform: scale(1.4) !important
	}
	
	/* Scale zoom 1.5 cho 390px */
    .tgs-brand-pill img[alt*="nutimilk" i], 
	.tgs-brand-pill img[alt*="Ngũ Cốc Việt Đài" i]  { 
		transform: scale(1.5) !important; }
}

/* ==========================================================================
   5. DANH MỤC TĨNH CẤP 2 VÀ CẤP 3
   ========================================================================== */
@media (max-width: 768px) {
    ul.nav-sidebar > li > .sub-menu > li { 
        border: none !important; margin-bottom: 0; width: 100%; display: block !important; visibility: visible !important; opacity: 1 !important; 
    }
    ul.nav-sidebar > li > .sub-menu > li > a {
        padding: 14px 0 !important; font-size: 14px !important; color: #333 !important; font-weight: 500 !important; border: none !important; border-bottom: 1px solid #f0f2f5 !important; border-radius: 0 !important; background: transparent !important; display: block !important; text-align: left !important; text-transform: none !important; visibility: visible !important; opacity: 1 !important;
    }
    ul.nav-sidebar > li > .sub-menu > li > .toggle { display: none !important; }

    ul.nav-sidebar > li > .sub-menu .sub-menu {
        display: block !important; position: static !important; padding: 0 !important; margin: 0 !important; visibility: visible !important; opacity: 1 !important; height: auto !important;
    }
    ul.nav-sidebar > li > .sub-menu .sub-menu > li { margin: 0 !important; padding: 0 !important; border: none !important; display: block !important; }
    ul.nav-sidebar > li > .sub-menu .sub-menu > li > a {
        padding: 14px 0 !important; font-size: 14px !important; color: #444 !important; font-weight: 400 !important; border: none !important; border-bottom: 1px solid #f0f2f5 !important; border-radius: 0 !important; background: transparent !important; display: block !important; text-align: left !important; text-transform: none !important; visibility: visible !important; opacity: 1 !important;
    }
    
    .flickity-prev-next-button,
    .slider-nav-circle .flickity-prev-next-button,
    .slider-nav-light .flickity-prev-next-button,
    .pcb-nav { display: none !important; }
}


/* TIÊU ĐỀ HÃNG SỮA / PHÂN LOẠI (TEST) */
    .tgs-brand-head { 
        font-size: 15px !important; color: #333 !important; font-weight: 700 !important; line-height: 1.2; display: flex; justify-content: space-between; align-items: center !important; border-bottom: none !important; margin-bottom: 8px !important; 
        padding: 0 0 12px 0 !important; 
    }
    .tgs-brand-head span { flex: 1; min-width: 0; word-wrap: break-word; }
    
    /* NÚT XEM TẤT CẢ TO BẢN NẰM DƯỚI GRID */
    .tgs-view-all-wrap {
        padding: 0 0 12px 0 !important;
        margin-top: -12px !important; /* Kéo nút sát lên lưới logo một chút cho liền mạch */
    }
    
    .tgs-view-all-btn { 
        display: flex !important; 
        align-items: center !important; 
        justify-content: center !important;
        width: 100% !important;
        height: 42px !important;
        background-color: #F4F8FF !important; /* Nền xanh dương cực nhạt */
        color: #235DA7 !important;
        border: 1px solid #D2E0F5 !important;
        border-radius: 8px !important;
        font-size: 13px !important; 
        font-weight: 600 !important; 
        text-decoration: none !important; 
        text-transform: none !important;
        transition: all 0.15s ease !important;
    }
    
    .tgs-view-all-btn:active {
        background-color: #E6F0FF !important;
        transform: scale(0.98) !important;
    }

/* ==========================================================================
   POPUP TÌM KIẾM MOBILE (CHUẨN APP)
   ========================================================================== */
.tgs-custom-search-popup {
    background: #fff;
    max-width: 340px; /* Ép kích thước nhỏ gọn như trong hình */
    width: 90%;
    margin: 0 auto;
    padding: 32px 24px;
    border-radius: 16px;
    position: relative;
}

.tgs-custom-search-popup h3 {
    text-align: center;
    color: #235DA7 !important;
    font-family: 'iCiel BCCubano', sans-serif !important;
    font-size: 22px !important;
    font-weight: 400 !important;
    margin-top: 0 !important;
    margin-bottom: 24px !important;
    text-transform: uppercase !important;
    line-height: 1.2 !important;
}

.tgs-custom-search-popup .tgs-search-input-group {
    display: flex;
    align-items: center;
    width: 100%;
}

.tgs-custom-search-popup input[type="search"] {
    flex: 1;
    height: 48px !important;
    border: 2px solid #235DA7 !important;
    border-right: none !important; /* Xóa viền phải để dính liền với nút */
    border-radius: 8px 0 0 8px !important; /* Bo tròn góc trái */
    padding: 0 16px !important;
    font-size: 15px !important;
    outline: none !important;
    box-shadow: none !important;
    background: #fff !important;
    margin: 0 !important;
    color: #333 !important;
}

.tgs-custom-search-popup button[type="submit"] {
    width: 54px !important;
    height: 48px !important;
    background: #235DA7 !important;
    border: none !important;
    border-radius: 0 8px 8px 0 !important; /* Bo tròn góc phải */
    color: #fff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: auto !important;
    box-shadow: none !important;
}

/* Tùy chỉnh nút X đóng popup của Flatsome ra ngoài nền đen */
.mfp-wrap .tgs-custom-search-popup .mfp-close {
    color: #fff !important;
    top: -45px !important;
    right: 0px !important;
    font-size: 32px !important;
    opacity: 0.8 !important;
}

@media (min-width: 769px) {
    /* Ẩn triệt để khung chứa giỏ hàng nổi dư thừa trên PC */
    .tgs-mobile-cart-host{
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
}

/* =======================================================
       TÁCH RỜI NÚT NGÔN NGỮ VÀ HỆ THỐNG CỬA HÀNG
       ======================================================= */
       
   ul.nav-sidebar > li.header-button {
        margin-bottom: 24px !important;
    }

    ul.nav-sidebar > li:has(.tgs-lang-switcher) {
        margin-top: 24px !important;
        border-bottom: none !important;
    }

    /* 1. Ép toàn bộ cụm Switcher vào chính giữa cột trái */
    body .mobile-sidebar ul.nav-sidebar .tgs-lang-switcher {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important; 
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* 2. Cố định kích thước 72px an toàn tuyệt đối cho cả nút mẹ và nút con */
    body .mobile-sidebar ul.nav-sidebar .tgs-lang-btn,
    body .mobile-sidebar ul.nav-sidebar .tgs-lang-option {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: center !important;
        
        width: 72px !important; /* Kích thước vàng, không bao giờ tràn khỏi cột 95px */
        height: 40px !important;
        padding: 0 !important;
        margin: 0 !important;
        gap: 6px !important;
        
        background: #fff !important;
        border: 1px solid #D2D7E0 !important;
        border-radius: 8px !important;
        box-sizing: border-box !important;
    }

    /* 3. Khóa kích thước lá cờ không bị méo */
    body .mobile-sidebar ul.nav-sidebar .tgs-lang-switcher img {
        width: 20px !important;
        min-width: 20px !important;
        height: 14px !important;
        min-height: 14px !important;
        object-fit: cover !important;
        flex-shrink: 0 !important;
        margin: 0 !important;
        border-radius: 2px !important;
        display: block !important;
    }

    /* 4. Định dạng chữ "VI" trên nút mẹ */
    body .mobile-sidebar ul.nav-sidebar .tgs-lang-label {
        font-size: 14px !important;
        font-weight: 700 !important;
        color: #235DA7 !important;
        line-height: 1 !important;
        margin: 0 !important;
        display: block !important;
    }

    /* Khóa Mũi tên Dropdown */
    body .mobile-sidebar ul.nav-sidebar .tgs-lang-chevron {
        width: 10px !important;
        min-width: 10px !important;
        height: 6px !important;
        min-height: 6px !important;
        flex-shrink: 0 !important;
        margin: 0 !important;
        display: block !important;
    }
    body .mobile-sidebar ul.nav-sidebar .tgs-lang-chevron path {
        stroke: #235DA7 !important;
        stroke-width: 2 !important;
    }

    /* 5. Căn chỉnh khung thả xuống nằm ngoan ngoãn dưới nút mẹ */
    body .mobile-sidebar ul.nav-sidebar .tgs-lang-dropdown {
        position: static !important;
        display: none !important; 
        flex-direction: column !important;
        align-items: center !important;
        width: 100% !important;
        min-width: 0 !important; 
        margin: 8px 0 16px 0 !important;
        padding: 0 !important;
        background: transparent !important;
        border: none !important;
        box-shadow: none !important;
        transform: none !important;
    }

    body .mobile-sidebar ul.nav-sidebar .tgs-lang-switcher.is-open .tgs-lang-dropdown {
        display: flex !important;
    }

    /* 6. Rút gọn chữ Tiếng Việt / English thành VI / EN cho đồng bộ */
    body .mobile-sidebar ul.nav-sidebar .tgs-lang-option {
        margin: 0 0 8px 0 !important;
    }
    body .mobile-sidebar ul.nav-sidebar .tgs-lang-option span {
        display: none !important; /* Ẩn chữ dài ngoằng gây tràn viền */
    }
    
    /* Bơm chữ rút gọn vào */
    body .mobile-sidebar ul.nav-sidebar .tgs-lang-option[data-lang="vi"]::after {
        content: "VI" !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        color: #444 !important;
        display: block !important;
    }
    body .mobile-sidebar ul.nav-sidebar .tgs-lang-option[data-lang="en"]::after {
        content: "EN" !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        color: #444 !important;
        display: block !important;
    }

    /* Trạng thái đang chọn (Màu cam) */
    body .mobile-sidebar ul.nav-sidebar .tgs-lang-option.is-active {
        background: #FFF1DB !important;
        border-color: #F9A51E !important;
    }
    body .mobile-sidebar ul.nav-sidebar .tgs-lang-option.is-active::after {
        color: #F9A51E !important;
    }

.woocommerce-error.message-wrapper {
	display: none;
}
.checkout-inline-error-message{
	color: red;
}

/* ==========================================================================
   TGS - ÉP SLIDE OUT MƯỢT MÀ ĐỒNG BỘ VỚI JAVASCRIPT (KHÔNG SỬA JS)
   ========================================================================== */
@media (max-width: 768px) {
    /* 1. "Đọc" lệnh làm mờ nền đen từ đoạn JS của bạn để làm tín hiệu trượt Menu */
    body:has(.off-canvas-overlay[style*="opacity: 0"]) #main-menu,
    body:has(.off-canvas-overlay[style*="opacity:0"]) #main-menu {
        transition: transform 0.15s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
    }

    /* 2. Ép Menu trượt ra ngoài êm ái (Xử lý cho Menu trượt từ BÊN TRÁI) */
    body:has(.off-canvas-overlay[style*="opacity: 0"]) .off-canvas-left#main-menu,
    body:has(.off-canvas-overlay[style*="opacity:0"]) .off-canvas-left#main-menu {
        transform: translateX(-100%) !important;
    }

    /* 3. Ép Menu trượt ra ngoài êm ái (Xử lý cho Menu trượt từ BÊN PHẢI) */
    body:has(.off-canvas-overlay[style*="opacity: 0"]) .off-canvas-right#main-menu,
    body:has(.off-canvas-overlay[style*="opacity:0"]) .off-canvas-right#main-menu {
        transform: translateX(100%) !important;
    }
}

/* ==========================================================================
   TGS - DIỆT TẬN GỐC MÀU XANH CỦA PLUGIN GIỎ HÀNG
   ========================================================================== */
@media (max-width: 768px) {
    /* 1. Trạng thái bình thường: Ép toàn bộ SVG và Icon (i) về màu xám chuẩn */
    #ccd-open-cart:not(.is-active) svg,
    #ccd-open-cart:not(.is-active) i {
        color: #4b5563 !important;
    }
    
    /* Luồn sâu vào từng nét vẽ, cướp quyền tô màu (fill) của plugin */
    #ccd-open-cart:not(.is-active) svg path:not([fill="none"]),
    #ccd-open-cart:not(.is-active) svg circle:not([fill="none"]),
    #ccd-open-cart:not(.is-active) svg rect:not([fill="none"]),
    #ccd-open-cart:not(.is-active) i::before {
        fill: #4b5563 !important;
    }

    /* Ép luôn cả viền (stroke) nếu plugin dùng viền màu xanh */
    #ccd-open-cart:not(.is-active) svg path:not([stroke="none"]),
    #ccd-open-cart:not(.is-active) svg circle:not([stroke="none"]),
    #ccd-open-cart:not(.is-active) svg rect:not([stroke="none"]) {
        stroke: #4b5563 !important;
    }

    /* Đề phòng plugin chèn ảnh dạng .png thay vì code SVG */
    #ccd-open-cart:not(.is-active) img {
        filter: grayscale(100%) opacity(0.7) !important;
    }

    /* 2. Trạng thái Active: Tương tự, ép tất cả về màu cam khi được bấm */
    #ccd-open-cart.is-active svg,
    #ccd-open-cart.is-active i {
        color: #f5a623 !important;
    }
    
    #ccd-open-cart.is-active svg path:not([fill="none"]),
    #ccd-open-cart.is-active svg circle:not([fill="none"]),
    #ccd-open-cart.is-active svg rect:not([fill="none"]),
    #ccd-open-cart.is-active i::before {
        fill: #f5a623 !important;
    }

    #ccd-open-cart.is-active svg path:not([stroke="none"]),
    #ccd-open-cart.is-active svg circle:not([stroke="none"]),
    #ccd-open-cart.is-active svg rect:not([stroke="none"]) {
        stroke: #f5a623 !important;
    }
}
.col-margin-bottom{
	margin-bottom: -120px;
}
@media (max-width: 567px){
	.col-margin-bottom{
	margin-bottom: 0px;
}
}
.tgs-sp-accordion .section-title-main{
font-size: 22px;
}
.section-title-main{
font-weight: 400;
}

.accordion .toggle{right: 0; left: auto;top: 20px}