/* NUKY overrides — load last after theme CSS */

body {
    overflow-x: hidden;
}

/*
 * Dropdown .sub-nav nằm ngoài ô header theo chiều dọc; block nội dung kế tiếp (hero, v.v.)
 * thường có position:relative và được vẽ sau header → che mất cấp 2 nếu z-index header thấp.
 */
.header {
    position: relative;
    z-index: 1000;
}

/* Header: menu một dòng (cả header chính + fixed clone), tránh ép nhỏ làm xuống dòng */
.header .header-inner {
    align-items: center;
}

.header .header-inner .header-right {
    flex-shrink: 0;
}

.header .header-inner .header-left {
    flex: 1 1 auto;
    min-width: 0;
    flex-wrap: nowrap !important;
    justify-content: flex-start;
    align-items: center;
    overflow: visible;
}

.header .header-inner .header-left .logo-site {
    flex-shrink: 0;
    padding-right: clamp(20px, 3vw, 56px) !important;
}

/*
 * Không được overflow:hidden/auto trên .main-nav: .sub-nav là position:absolute
 * và nằm dưới hàng menu — sẽ bị cắt, không còn dropdown cấp 2.
 */
.header .header-inner .header-left .main-nav,
.header .fixed-header .header-inner .header-left .main-nav {
    flex: 1 1 auto;
    min-width: 0;
    overflow: visible;
}

@media (max-width: 1400px) {
    .header .header-inner .nav-list,
    .header .fixed-header .header-inner .nav-list {
        gap: clamp(10px, 1.8vw, 28px) !important;
    }
}

/* Chỉ menu cấp 1: luôn hàng ngang, không wrap từng mục */
.header .header-inner .nav-list,
.header .fixed-header .header-inner .nav-list {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center;
    width: max-content;
    min-width: min-content;
    max-width: none !important;
    overflow: visible;
}

/* Đảm bảo cấp 2 luôn nổi trên nội dung trang (styles.css mặc định z-index: 50) */
.header .header-inner .nav-list > .item > .sub-nav,
.header .fixed-header .header-inner .nav-list > .item > .sub-nav {
    z-index: 200 !important;
}

.header .header-inner .nav-list > .item,
.header .fixed-header .header-inner .nav-list > .item {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
}

.header .header-inner .nav-list > .item > a,
.header .fixed-header .header-inner .nav-list > .item > a {
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    max-width: none !important;
    width: max-content;
}

.header .header-inner .nav-list > .item > a span,
.header .fixed-header .header-inner .nav-list > .item > a span {
    white-space: nowrap !important;
    word-break: normal !important;
}

/* Nút Liên hệ header: không xuống dòng */
.header .header-inner .header-right .tf-btn .text-style {
    white-space: nowrap !important;
}

.container {
    max-width: 100%;
}

/* Trang /san-pham — lưới thẻ sản phẩm responsive, thẻ full ô */
.page-shop-product .wg-shop-content .nuky-products-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr));
    gap: clamp(1rem, 2.2vw, 1.75rem);
    align-items: stretch;
}

.page-shop-product .wg-shop-content .nuky-products-grid__empty {
    grid-column: 1 / -1;
    margin: 0;
    padding: 2rem 0;
    text-align: center;
    color: var(--Text-3, #666);
}

.page-shop-product .wg-shop-content .nuky-products-grid > .card-product.style-2 {
    max-width: none !important;
    width: 100%;
    min-width: 0;
    margin: 0;
    height: 100%;
    box-sizing: border-box;
    justify-content: flex-start;
    padding: clamp(1rem, 2vw, 1.5rem) clamp(0.85rem, 1.8vw, 1.25rem);
}

.page-shop-product .wg-shop-content .nuky-products-grid > .card-product.style-2 .image {
    margin-top: 0;
    margin-bottom: 0.85rem;
    aspect-ratio: 1;
    overflow: hidden;
    border-radius: 14px;
    background: var(--Bg-6, #f5f5f5);
    flex-shrink: 0;
}

.page-shop-product .wg-shop-content .nuky-products-grid > .card-product.style-2 .image img {
    width: 100%;
    height: 100%;
    max-width: none !important;
    object-fit: cover;
    display: block;
}

.page-shop-product .wg-shop-content .nuky-products-grid > .card-product.style-2 .name-product {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 1.35;
    min-height: 2.7em;
    margin-bottom: 10px;
}

.page-shop-product .wg-shop-content .nuky-products-grid > .card-product.style-2 .pricing-star {
    flex-wrap: wrap;
    gap: 8px 12px;
    margin-bottom: 12px;
}

.page-shop-product .wg-shop-content .nuky-products-grid > .card-product.style-2 .product-btn-list {
    margin-top: auto;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}

@media (min-width: 1200px) {
    .page-shop-product .wg-shop-content .nuky-products-grid {
        grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr));
    }
}

/* Trang shop: cột lọc 30% — phần sản phẩm 70% */
@media (min-width: 992px) {
    .page-shop-product .nuky-shop-split {
        display: flex;
        flex-wrap: wrap;
        margin-left: 0;
        margin-right: 0;
        --nuky-shop-sidebar-pct: 30%;
    }

    .page-shop-product .nuky-shop-split__aside {
        flex: 0 0 var(--nuky-shop-sidebar-pct);
        max-width: var(--nuky-shop-sidebar-pct);
        width: var(--nuky-shop-sidebar-pct);
        padding-left: 0;
        padding-right: clamp(10px, 1.5vw, 18px);
    }

    .page-shop-product .nuky-shop-split__main {
        flex: 0 0 calc(100% - var(--nuky-shop-sidebar-pct));
        max-width: calc(100% - var(--nuky-shop-sidebar-pct));
        width: calc(100% - var(--nuky-shop-sidebar-pct));
        padding-left: clamp(10px, 1.5vw, 18px);
        padding-right: 0;
        min-width: 0;
    }
}

/* Sidebar: chỉ nhấn mục danh mục đang chọn — cỡ chữ/padding theo theme (.tf-sidebar) */
.page-shop-product .nuky-shop-sidebar .category-list li.current-item > a {
    color: var(--Primary, #2d5a27) !important;
    font-weight: 700 !important;
}

/*
 * Sidebar (.tf-sidebar) — tablet/mobile: padding & khoảng cách theo nuky-theme (--card-padding, --space-*).
 * - Gỡ margin-top widget tác giả (89px chỉ hợp khi sidebar cạnh bài).
 * - Đồng bộ sb-title / sb-content với scale responsive của theme (thay số px cứng trong styles.css).
 */
@media (max-width: 991.98px) {
    .tf-sidebar .sidebar-item .sb-title {
        padding: var(--space-4) var(--card-padding);
    }

    .tf-sidebar .sidebar-item .sb-content {
        padding: var(--card-padding);
    }

    .main-content.page-blog-single .blog-single .content {
        margin-right: 0;
        padding-bottom: var(--space-8);
    }

    .main-content.page-blog-single .tf-sidebar {
        margin-top: var(--space-8);
        max-width: 100%;
    }

    .main-content.page-blog-single .tf-sidebar .wg-author-farm {
        margin-top: 0;
        padding: 0 var(--card-padding) var(--space-8);
    }

    .main-content.page-blog-single .tf-sidebar .wg-author-farm .image-avt {
        margin-top: calc(-1 * var(--space-16));
        margin-bottom: var(--space-6);
    }

    /* Shop: hai cột chồng — tách lưới sản phẩm khỏi khối lọc */
    .page-shop-product .nuky-shop-split__main {
        margin-top: var(--space-8);
    }
}

@media (max-width: 767.98px) {
    .tf-sidebar {
        padding-bottom: var(--space-8);
    }

    .tf-sidebar .sidebar-item .sb-title {
        padding: var(--space-3) var(--card-padding-sm);
    }

    .tf-sidebar .sidebar-item .sb-content {
        padding: var(--card-padding-sm);
    }

    .main-content.page-blog-single .tf-sidebar {
        margin-top: var(--space-6);
    }

    .main-content.page-blog-single .tf-sidebar .wg-author-farm {
        padding-left: var(--card-padding-sm);
        padding-right: var(--card-padding-sm);
        padding-bottom: var(--space-6);
    }

    .main-content.page-blog-single .tf-sidebar .wg-author-farm .image-avt {
        margin-top: calc(-1 * var(--space-12));
    }

    .page-shop-product .nuky-shop-split__main {
        margin-top: var(--space-6);
    }
}

@media (max-width: 575.98px) {
    .tf-sidebar .sidebar-item .sb-content {
        padding: var(--space-4) var(--space-5);
    }

    .tf-sidebar .sidebar-item .sb-title {
        padding: var(--space-3) var(--space-5);
    }
}

@media (max-width: 575px) {
    .tf-product-card {
        width: 50% !important;
    }

    .grid-layout .tf-product-card {
        width: 100% !important;
    }
}

@media (max-width: 767px) {
    .wg-table-cart {
        overflow-x: auto;
    }

    .wg-table-cart table {
        min-width: 500px;
    }
}

@media (max-width: 767px) {
    .checkout-form .col-md-6 {
        width: 100%;
    }
}

@media (max-width: 575px) {
    h1 {
        font-size: 1.8rem !important;
    }

    h2 {
        font-size: 1.4rem !important;
    }

    section.tf-slideshow .title {
        font-size: 1.85rem !important;
        line-height: 1.28 !important;
        padding-bottom: 0.06em;
    }

    /* Hero + trích dẫn break page — không thu nhỏ theo rule h1 toàn site */
    .page-title .content .title,
    .page-title-home-1 .slide-home-1 .content-wrap .content h1.title,
    .s-break-page.style-2 .content h1.title {
        font-size: calc(60px * 0.64) !important;
        /* Playwrite cần line-height > 1 để không cắt chân chữ */
        line-height: 1.2 !important;
    }
}

/*
 * Hero — cỡ chữ (font-family từ public/css/nuky-theme.css, load sau file này).
 * Theme gốc (styles.css) dùng text-transform: uppercase cho .page-title .content .title;
 * tắt để hiển thị đúng chữ gõ trong admin / cài đặt.
 */
.page-title .content .title,
.page-title-home-1 .slide-home-1 .content-wrap .content h1.title,
.s-break-page.style-2 .content h1.title {
    font-weight: 600;
    font-size: calc(90px * 0.7);
    line-height: calc(100px * 0.7);
    /* font-family + text-transform: nuky-theme.css — cùng display font hero */
    /* text-transform: xem nuky-theme.css (load sau) — none !important */
}

.page-title .content .sub-title,
.page-title-home-1 .slide-home-1 .content-wrap .content p.sub-title {
    font-size: calc(23px * 0.7);
}

@media (max-width: 767px) {
    .page-title .content .title,
    .page-title-home-1 .slide-home-1 .content-wrap .content h1.title,
    .s-break-page.style-2 .content h1.title {
        font-size: calc(60px * 0.64);
        line-height: 1.28;
        padding-bottom: 0.06em;
    }

    .page-title-home-1 .slide-home-1 .content-wrap .content p.sub-title {
        font-size: calc(20px * 0.7);
    }
}

.mobile-nav-wrap {
    z-index: 9999;
    position: fixed;
}

/*
 * Menu mobile (drawer) — theme chỉ set màu trắng cho .menu-item-has-children-mobile > a;
 * link đơn (Trang chủ, CMS pages, v.v.) vẫn dùng global a { color: var(--Text-2) } → gần như trùng nền Primary.
 * Hover global a:hover { color: var(--Bg) } cũng xấu trên nền xanh → override trong panel.
 */
.mobile-nav-wrap .inner-mobile-nav {
    /* Một cỡ chữ cho toàn panel (menu / submenu / liên hệ / nút) — đủ lớn đọc trên mobile */
    --nuky-mnav-fs: var(--text-xl);
    padding: var(--space-5) var(--space-5);
    gap: var(--space-8);
}

.mobile-nav-wrap .inner-mobile-nav .logo {
    margin-bottom: var(--space-6);
    padding-right: var(--space-10);
}

.mobile-nav-wrap .inner-mobile-nav .mobile-main-nav #menu-mobile-menu > .menu-item > a.item-menu-mobile {
    color: var(--White);
    font-weight: 500;
    font-size: var(--nuky-mnav-fs);
    line-height: 1.35;
    display: block;
    padding: var(--space-2) 0;
}

.mobile-nav-wrap .inner-mobile-nav .mobile-main-nav #menu-mobile-menu > .menu-item.menu-item-has-children-mobile > a.item-menu-mobile {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--space-3) 0;
    margin-bottom: var(--space-2);
}

.mobile-nav-wrap .inner-mobile-nav .mobile-main-nav a.item-menu-mobile:hover,
.mobile-nav-wrap .inner-mobile-nav .mobile-main-nav a.item-menu-mobile:focus {
    color: var(--Secondary);
}

.mobile-nav-wrap .inner-mobile-nav .mobile-main-nav .menu-item-has-children-mobile .item-menu-mobile i {
    color: inherit;
    font-size: 1em;
}

.mobile-nav-wrap .inner-mobile-nav .mobile-main-nav .sub-menu-mobile .menu-item a {
    color: rgba(255, 255, 255, 0.9);
    font-size: var(--nuky-mnav-fs);
    font-weight: 500;
    line-height: 1.4;
    padding: var(--space-2) 0 var(--space-2) var(--space-4);
}

.mobile-nav-wrap .inner-mobile-nav .mobile-main-nav .sub-menu-mobile .menu-item a:hover,
.mobile-nav-wrap .inner-mobile-nav .mobile-main-nav .sub-menu-mobile .menu-item a:focus {
    color: var(--Secondary);
}

.mobile-nav-wrap .inner-mobile-nav .mobile-main-nav .item-menu-mobile.current,
.mobile-nav-wrap .inner-mobile-nav .mobile-main-nav .menu-item-has-children-mobile .item-menu-mobile.current {
    color: var(--Secondary);
}

.mobile-nav-wrap .inner-mobile-nav .infor-list {
    margin-bottom: var(--space-6);
}

.mobile-nav-wrap .inner-mobile-nav .infor-list .footer-contact > li:not(:last-child) {
    margin-bottom: var(--space-4);
}

.mobile-nav-wrap .inner-mobile-nav .infor-list .footer-contact .title {
    font-size: var(--nuky-mnav-fs);
    font-weight: 700;
    letter-spacing: 0.04em;
    color: var(--White);
    margin-bottom: var(--space-1);
    text-transform: uppercase;
}

.mobile-nav-wrap .inner-mobile-nav .infor-list .footer-contact p,
.mobile-nav-wrap .inner-mobile-nav .infor-list .footer-contact a {
    color: rgba(255, 255, 255, 0.92);
    font-size: var(--nuky-mnav-fs);
    line-height: var(--leading-normal, 1.6);
}

.mobile-nav-wrap .inner-mobile-nav .infor-list .footer-contact a:hover,
.mobile-nav-wrap .inner-mobile-nav .infor-list .footer-contact a:focus {
    color: var(--Secondary);
}

.mobile-nav-wrap .inner-mobile-nav .group-icon {
    gap: var(--space-3);
    flex-wrap: wrap;
    margin-top: var(--space-2);
}

.mobile-nav-wrap .inner-mobile-nav .group-icon .site-nav-icon {
    flex: 1 1 calc(50% - var(--space-2));
    min-width: 0;
    justify-content: center;
    padding: var(--space-3) var(--space-4);
    line-height: 1.3;
    gap: var(--space-2);
    font-weight: 600;
    font-size: var(--nuky-mnav-fs);
    color: var(--Primary);
    background-color: var(--White);
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: var(--space-2);
}

.mobile-nav-wrap .inner-mobile-nav .group-icon .site-nav-icon i {
    font-size: 1em;
}

/* Zalo (chữ) trong drawer — cùng cỡ với phần còn lại, không dùng 10px của .wg-social global */
.mobile-nav-wrap .inner-mobile-nav .bottom .wg-social .list li > a:not(:has(i)) {
    font-size: var(--nuky-mnav-fs) !important;
}

.mobile-nav-wrap .inner-mobile-nav .group-icon .site-nav-icon:hover,
.mobile-nav-wrap .inner-mobile-nav .group-icon .site-nav-icon:focus {
    color: var(--Primary);
    background-color: var(--Secondary);
    border-color: var(--Secondary);
}

.mobile-nav-wrap .inner-mobile-nav .bottom .wg-social .list {
    gap: var(--space-3);
    padding-top: var(--space-2);
}

/*
 * Cart badge in header — xóa pseudo-element hardcode "3" của theme
 * và chỉ hiển thị số lượng từ <span class="cart-count">.
 */
.header .header-inner .header-right .icon-wrap .icon.wg-bag::after,
.tf-topbar.style-3 .icon-wrap .icon.wg-bag::after,
.tf-header-shop .icon-wrap .icon.wg-bag::after,
.tf-topbar.style-3 .topbar-right .icon-wrap .wg-bag::after {
    display: none !important;
    content: "" !important;
}

.header .header-inner .header-right .icon-wrap .icon.wg-bag .cart-count,
.tf-topbar.style-3 .icon-wrap .icon.wg-bag .cart-count,
.tf-header-shop .icon-wrap .icon.wg-bag .cart-count,
.tf-topbar.style-3 .topbar-right .icon-wrap .wg-bag .cart-count {
    position: absolute;
    top: -9px;
    right: -7px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background-color: var(--Secondary);
    color: var(--Text-5);
    font-weight: 600;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

/*
 * Form liên hệ — nhãn (Họ tên*, Email*, …): vàng + cỡ lớn.
 * Cùng #contactform ở trang chủ (for="home-contact-*") và trang /liên-hệ (for="page-contact-*").
 */
#contactform fieldset > label.d-block {
    color: var(--Secondary, #f8c32c);
    font-size: var(--text-xl, 1.25rem);
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: 0.02em;
}

/* Footer — điện thoại & email: vàng (cùng Secondary với form liên hệ) */
#footer-main .footer-inner .footer-contact .phone-number a,
#footer-main .footer-inner .footer-contact .email a {
    color: var(--Secondary, #f8c32c);
    font-weight: 600;
}

#footer-main .footer-inner .footer-contact .phone-number a:hover,
#footer-main .footer-inner .footer-contact .phone-number a:focus,
#footer-main .footer-inner .footer-contact .email a:hover,
#footer-main .footer-inner .footer-contact .email a:focus {
    color: var(--White);
}

/* Slogan dưới logo (footer-top) — không kế thừa màu xám body / nuky-theme trên nền Primary */
#footer-main .footer-top .footer-logo .nuky-footer-tagline {
    color: var(--Secondary, #f8c32c) !important;
    font-size: var(--text-lg, 1.125rem) !important;
    font-weight: 700;
    line-height: var(--leading-normal, 1.6);
    letter-spacing: 0.02em;
    max-width: 22rem;
}

@media (max-width: 767px) {
    .footer-col {
        width: 100% !important;
        margin-bottom: 2rem;
    }
}

/*
 * Mạng xã hội — đồng bộ với topbar .contact-list .item .icon
 * (styles.css: ô 30×30px, nền var(--Secondary), icon i 13px màu var(--Primary)).
 */
:root {
    --nuky-social-icon-box: 30px;
    --nuky-social-icon-size: 13px;
    /* CTA (.tf-btn / .tf-btn-read / .tf-btn-nor): hệ số so với theme — 1.1 = +10% */
    --nuky-cta-scale: 1.1;
}

/* Topbar: mỗi link social = cùng kích thước / bố cục với ô icon điện thoại · email · địa chỉ */
.tf-topbar .topbar-inner .topbar-right .social-list li > a {
    width: var(--nuky-social-icon-box);
    height: var(--nuky-social-icon-box);
    min-width: var(--nuky-social-icon-box);
    min-height: var(--nuky-social-icon-box);
    border-radius: 50%;
    background-color: var(--Secondary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

.tf-topbar .topbar-inner .topbar-right .social-list a i {
    font-size: var(--nuky-social-icon-size) !important;
    line-height: 1 !important;
    color: var(--Primary) !important;
}

.tf-topbar .topbar-inner .topbar-right .social-list li > a:hover i {
    color: var(--White) !important;
}

/* Zalo (chữ, không có <i>) — cùng chiều cao hàng, bo tròn */
.tf-topbar .topbar-inner .topbar-right .social-list li > a:not(:has(i)) {
    width: auto;
    min-width: var(--nuky-social-icon-box);
    padding: 0 10px;
    border-radius: 999px;
    color: var(--Primary);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.tf-topbar .topbar-inner .topbar-right .social-list li > a:not(:has(i)):hover {
    color: var(--White);
}

/* Welcome popup, mobile nav, footer — cùng quy chuẩn với header */
.wg-social .list li a {
    width: var(--nuky-social-icon-box) !important;
    height: var(--nuky-social-icon-box) !important;
    min-width: var(--nuky-social-icon-box);
    min-height: var(--nuky-social-icon-box);
}

.wg-social .list li a i {
    font-size: var(--nuky-social-icon-size) !important;
    line-height: 1 !important;
}

.wg-social .list li a:not(:has(i)) {
    width: auto !important;
    min-width: var(--nuky-social-icon-box);
    padding: 0 10px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-align: center;
}

/* Trang chủ — hàng số + hậu tố (+, %) cho odometer */
.home-odometer-row {
    display: flex;
    align-items: baseline;
    justify-content: center;
    flex-wrap: wrap;
    gap: 2px 6px;
}

.wg-counter.style-2 .home-odometer-row {
    justify-content: flex-start;
}

.s-counter .wg-counter .counter-item .home-odometer-row {
    justify-content: center;
}

.home-stat-suffix--about {
    font-family: "Work Sans", sans-serif;
    font-size: 40px;
    line-height: 1;
    font-weight: 700;
    color: var(--Bg-6);
}

.home-stat-suffix--counter {
    font-family: "Work Sans", sans-serif;
    font-size: 65px;
    line-height: 1;
    font-weight: 700;
    color: var(--Secondary);
}

@media (max-width: 767px) {
    .home-stat-suffix--counter {
        font-size: 50px;
    }
}

/* Giảm khoảng dưới slider «Sản phẩm mới» trước khối Đánh giá */
.main-content.page-index .s-project .slider-side {
    padding-bottom: 0 !important;
}

.main-content.page-index .s-project .slider-side .bot {
    margin-top: 16px !important;
}

/*
 * Trang chủ — Đánh giá + section kế tiếp: nối sát (theme .s-testimonial padding-bottom 150px,
 * .content-section padding-top 94px, responsive 50px / 80px → ghi đè !important).
 */
.main-content.page-index .s-testimonial {
    position: relative;
    z-index: 2;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    /* Chặn ảnh nền/ảnh absolute (theme có img height cố định + margin âm) */
    overflow: hidden !important;
    /* Chống section dưới (counter) che mép đáy / nút swiper — chỉ chừa vừa đủ */
    padding-bottom: clamp(28px, 4vw, 52px) !important;
}

.main-content.page-index .s-testimonial .content-wrap {
    margin-top: 0;
    margin-bottom: 0;
    padding-bottom: clamp(8px, 1.5vw, 16px) !important;
}

.main-content.page-index .s-testimonial .content-wrap .image,
.main-content.page-index .s-testimonial .image {
    margin-top: 0 !important;
}

.main-content.page-index .s-testimonial .content-section {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.main-content.page-index .s-testimonial .content-section .heading-section {
    margin-bottom: 12px;
}

.main-content.page-index .s-testimonial .slider-s-testimonial {
    margin-bottom: 0 !important;
    padding-bottom: 12px !important;
}

@media (max-width: 991px) {
    .main-content.page-index .s-testimonial .content-wrap .content-section {
        padding-top: 0 !important;
    }
}

@media (max-width: 767px) {
    .main-content.page-index .s-testimonial .content-section {
        margin-left: 0 !important;
    }
}

/* Counter dưới testimonial: giữ padding trên 0; có thể thêm margin-top nhỏ nếu vẫn chồng */
.main-content.page-index .s-counter,
.main-content.page-index .s-counter.has-img-item {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    position: relative;
    z-index: 2;
}

/* Nội dung thống kê phải nằm trên .s-img-item (tractor / viền), tránh che số */
.main-content.page-index .s-counter .tf-container {
    position: relative;
    z-index: 3;
}

.main-content.page-index .s-break-page.style-2 {
    position: relative;
    z-index: 1;
    margin-top: 0;
    margin-bottom: 0;
}

.main-content.page-index .s-faq.has-img-item.tf-pt-0 {
    padding-top: 0;
    position: relative;
    z-index: 2;
}

.main-content.page-index .s-faq.has-img-item.tf-pt-0 .tf-container {
    padding-top: 0 !important;
}

.main-content.page-index .s-faq .s-img-item.item-1.t--40 {
    top: 0;
}

/* Banner CTA — style-2 đã xử lý layout; giữ nền nổi bật nhẹ */
.main-content.page-index .nuky-home-promotions {
    position: relative;
    z-index: 2;
    margin-top: 0;
    padding-top: 8px;
    padding-bottom: 8px;
    background-color: var(--Bg-8);
}

.main-content.page-index .nuky-home-promotions + .s-blog-post {
    padding-top: 0;
}

/* Trang chủ — giảm padding mặc định theme giữa các khối (blog, v.v.) */
.main-content.page-index .s-blog-post {
    padding-top: 8px;
    padding-bottom: 48px;
}

/* Blog chi tiết — nội dung CMS: cùng nhịp .blog-single .content .text (donal_farm/blog-single.html) */
.blog-single .content .blog-single-prose {
    margin-bottom: 38px;
}

.blog-single .content .blog-single-prose > p,
.blog-single .content .blog-single-prose p {
    margin-bottom: 24px;
    color: var(--Text-2);
}

.blog-single .content .blog-single-prose > p:last-child {
    margin-bottom: 0;
}

.blog-single .content .blog-single-prose h2,
.blog-single .content .blog-single-prose h3,
.blog-single .content .blog-single-prose h4 {
    margin-top: 32px;
    margin-bottom: 16px;
    font-weight: 700;
    color: var(--Text-2);
    line-height: 1.3;
}

.blog-single .content .blog-single-prose h2 {
    font-size: clamp(1.35rem, 2.5vw, 26px);
}

.blog-single .content .blog-single-prose h3 {
    font-size: clamp(1.2rem, 2vw, 22px);
}

.blog-single .content .blog-single-prose ul,
.blog-single .content .blog-single-prose ol {
    margin-bottom: 24px;
    padding-left: 1.25rem;
}

.blog-single .content .blog-single-prose blockquote {
    margin: 32px 0;
}

.blog-single .content .blog-single-prose img {
    max-width: 100%;
    height: auto;
    border-radius: 12px;
}

.blog-single .content .related-post-wrap {
    padding-bottom: 24px;
    border-bottom: 1px solid var(--Border);
    margin-bottom: 40px;
}

/*
 * Bài viết liên quan: blade dùng .style-2 (cột dọc theo theme). type-2 thiếu style-2 → flex ngang + ảnh 467px → vỡ trong col-md-4.
 * Giữ ảnh trong khung cột + cho text wrap đúng trong flex row Bootstrap.
 */
.blog-single .content .related-post-wrap .row > [class*="col-"] {
    min-width: 0;
}

.blog-single .content .related-post-wrap .article-blog-item.type-2 .image {
    max-width: 100% !important;
    width: 100%;
}

.blog-single .content .related-post-wrap .article-blog-item .image img {
    width: 100%;
    max-height: 240px;
    height: auto;
    object-fit: cover;
    display: block;
}

.blog-single .content .related-post-wrap .article-blog-item .content {
    min-width: 0;
}

.blog-single .content .related-post-wrap .article-blog-item .content .title a {
    white-space: normal;
    word-break: break-word;
}

/* --------------------------------------------------------------------------
   CTA / nút theme — đồng bộ +10% so với styles.css (Đọc tiếp, Xem thêm, Liên hệ, …)
   Hệ số: --nuky-cta-scale trong :root phía trên.
   -------------------------------------------------------------------------- */
a.tf-btn,
button.tf-btn,
.tf-btn {
    font-size: calc(16px * var(--nuky-cta-scale));
    padding-top: calc(6px * var(--nuky-cta-scale));
    padding-bottom: calc(6px * var(--nuky-cta-scale));
    padding-left: calc(35px * var(--nuky-cta-scale));
    padding-right: calc(5px * var(--nuky-cta-scale));
    gap: calc(34px * var(--nuky-cta-scale));
    border-radius: calc(28px * var(--nuky-cta-scale));
}

.tf-btn .icon {
    width: calc(43px * var(--nuky-cta-scale));
    height: calc(43px * var(--nuky-cta-scale));
}

.tf-btn .icon i {
    font-size: calc(23px * var(--nuky-cta-scale));
}

.tf-btn .icon i.fs-14 {
    font-size: calc(14px * var(--nuky-cta-scale));
}

.tf-btn::after {
    width: calc(22px * var(--nuky-cta-scale));
    height: calc(22px * var(--nuky-cta-scale));
    right: calc(14px * var(--nuky-cta-scale));
    top: calc(17px * var(--nuky-cta-scale));
}

.tf-btn.style-2 {
    padding: calc(20px * var(--nuky-cta-scale)) calc(35px * var(--nuky-cta-scale));
    gap: calc(15px * var(--nuky-cta-scale));
}

.tf-btn.style-2.type-2 {
    padding: calc(16px * var(--nuky-cta-scale)) calc(27px * var(--nuky-cta-scale));
    gap: calc(11px * var(--nuky-cta-scale));
}

.tf-btn.style-3 {
    padding: calc(19px * var(--nuky-cta-scale)) calc(35px * var(--nuky-cta-scale))
        calc(18px * var(--nuky-cta-scale)) calc(35px * var(--nuky-cta-scale));
}

.tf-btn.style-3.pd-defalt {
    padding: calc(6px * var(--nuky-cta-scale)) calc(5px * var(--nuky-cta-scale))
        calc(6px * var(--nuky-cta-scale)) calc(35px * var(--nuky-cta-scale));
}

.tf-btn.gap-37 {
    gap: calc(37px * var(--nuky-cta-scale));
}

.tf-btn.gap-34 {
    gap: calc(34px * var(--nuky-cta-scale));
}

.tf-btn.gap-30 {
    gap: calc(30px * var(--nuky-cta-scale));
}

.tf-btn.gap-35 {
    gap: calc(35px * var(--nuky-cta-scale));
}

a.tf-btn-read,
.tf-btn-read {
    font-size: calc(16px * var(--nuky-cta-scale));
    padding-bottom: calc(10px * var(--nuky-cta-scale));
}

a.tf-btn-nor,
button.tf-btn-nor,
.tf-btn-nor {
    font-size: calc(16px * var(--nuky-cta-scale));
    padding: calc(15px * var(--nuky-cta-scale)) calc(35px * var(--nuky-cta-scale));
    line-height: calc(24px * var(--nuky-cta-scale));
    border-radius: calc(28px * var(--nuky-cta-scale));
    gap: calc(10px * var(--nuky-cta-scale));
}

.tf-btn-nor.style-small {
    padding: calc(10px * var(--nuky-cta-scale)) calc(24px * var(--nuky-cta-scale));
}

.wrap-quantity .btn-add-cart i {
    font-size: calc(15px * var(--nuky-cta-scale));
}

.tf-shop-control .control-left .btn-view {
    width: calc(46px * var(--nuky-cta-scale));
    height: calc(46px * var(--nuky-cta-scale));
}

/* Trang chi tiết sản phẩm: Description/Tab cần căn trái theo nội dung đã chỉnh */
.main-content.page-shop-detail .s-tab .wg-tabs.style-2 .widget-content-inner {
    text-align: left;
}

/* Floating CTA: Call / Zalo / Gửi tin nhắn */
.nuky-cta-float {
    position: fixed;
    right: 18px;
    bottom: 110px;
    z-index: 99999;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 12px;
    pointer-events: none; /* chỉ cho phép các nút nhận click */
    animation: nukyCtaFloat 4s ease-in-out infinite;
}

.nuky-cta-float .cta-float-btn,
.nuky-cta-float .cta-float-chat-menu,
.nuky-cta-float .cta-float-chat summary,
.nuky-cta-float .cta-float-chat-menu a {
    pointer-events: auto;
}

.nuky-cta-float .cta-float-btn {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: var(--Secondary, #f8c32c);
    color: var(--Primary, #0d401c);
    box-shadow: 0 10px 28px rgba(13, 64, 28, 0.22);
    border: 2px solid rgba(255, 255, 255, 0.6);
    text-decoration: none;
    transition: transform 160ms ease, box-shadow 160ms ease, background-color 160ms ease;
    backdrop-filter: blur(6px);
}

.nuky-cta-float .cta-float-btn i {
    font-size: 20px;
}

/* Pulse hiệu ứng cho nút Call */
.nuky-cta-float .cta-call {
    animation: nukyCtaPulse 2.6s infinite;
}

@keyframes nukyCtaPulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.035);
    }
    100% {
        transform: scale(1);
    }
}

.nuky-cta-float .cta-float-btn:hover,
.nuky-cta-float .cta-float-btn:focus-visible {
    transform: translateY(-2px) scale(1.03);
    box-shadow: 0 14px 34px rgba(13, 64, 28, 0.28);
}

.nuky-cta-float details.cta-float-chat {
    position: relative;
}

.nuky-cta-float details.cta-float-chat > summary {
    list-style: none;
    cursor: pointer;
    user-select: none;
    width: 56px;
    height: 56px;
    border-radius: 50%;
}

.nuky-cta-float details.cta-float-chat > summary::-webkit-details-marker {
    display: none;
}

.nuky-cta-float .cta-float-chat-menu {
    position: absolute;
    right: 0;
    bottom: 64px;
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(13, 64, 28, 0.16);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.14);
    border-radius: 16px;
    padding: 10px;
    min-width: 210px;
    opacity: 0;
    transform: translateY(10px) scale(0.98);
    pointer-events: none;
    transition: opacity 180ms ease, transform 180ms ease;
}

.nuky-cta-float details.cta-float-chat[open] .cta-float-chat-menu {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

.nuky-cta-float .cta-float-menu-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 12px;
    border-radius: 12px;
    text-decoration: none;
    color: var(--Text-2, #072010);
    font-weight: 700;
    font-family: "Work Sans", sans-serif;
    transition: background-color 140ms ease, transform 140ms ease;
}

.nuky-cta-float .cta-float-menu-item:hover,
.nuky-cta-float .cta-float-menu-item:focus-visible {
    background-color: rgba(13, 64, 28, 0.08);
    transform: translateX(1px);
}

.nuky-cta-float .menu-icon {
    width: 28px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
}

.nuky-cta-float .menu-text {
    display: inline-block;
    line-height: 1.2;
}

@keyframes nukyCtaFloat {
    0% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-2px);
    }
    100% {
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .nuky-cta-float,
    .nuky-cta-float .cta-call {
        animation: none;
    }

    .nuky-cta-float .cta-float-btn:hover,
    .nuky-cta-float .cta-float-btn:focus-visible {
        transform: none;
    }
}

/* Header menu: chỉ đổi màu pseudo icon (giữ nguyên glyph wheat-grains) */
.header .header-inner .nav-list .item::before,
.fixed-header .header-inner .nav-list .item::before,
.header .header-inner .nav-list .item.current-menu::before,
.fixed-header .header-inner .nav-list .item.current-menu::before {
    /* Xanh nhạt ngả vàng (pha vàng) để hợp theme trà */
    color: #669d3e !important;
}

/* Replace icon-font <i> by image in NUKY Tea blocks */
.nuky-tea-icon {
    display: block;
    width: 61px;
    height: 61px;
    object-fit: contain;
    pointer-events: none;
}

/* Featured portfolio block uses style-4 icon sizing */
.box-portfolio.style-4 .content .icon .nuky-tea-icon {
    width: 61px;
    height: 61px;
}

/* About block uses style-3 icon sizing */
.box-icon.style-3 .icon .nuky-tea-icon {
    width: 35px;
    height: 35px;
}

/* Video grid block */
.nuky-video-card__thumb {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    background: rgba(13, 64, 28, 0.06);
    border: 1px solid rgba(13, 64, 28, 0.14);
}

.nuky-video-card__thumb img {
    width: 100%;
    height: auto;
    display: block;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.nuky-video-card__thumb--empty {
    aspect-ratio: 16 / 9;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(13, 64, 28, 0.55);
    font-size: 44px;
}

.nuky-video-card__play {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 180ms ease, transform 180ms ease;
    transform: scale(0.96);
    background: radial-gradient(circle at center, rgba(13, 64, 28, 0.45), rgba(13, 64, 28, 0) 60%);
}

.nuky-video-card:hover .nuky-video-card__play,
.nuky-video-card:focus-visible .nuky-video-card__play {
    opacity: 1;
    transform: scale(1);
}

.nuky-video-card__play i {
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background: var(--Secondary);
    color: var(--Primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 12px 26px rgba(0, 0, 0, 0.18);
}

.nuky-video-card__title {
    margin-top: 12px;
    color: var(--Text-2);
    line-height: 1.35;
}

.nuky-video-modal .modal-content {
    border-radius: 16px;
    overflow: hidden;
}

.nuky-video-modal__frame {
    position: relative;
    border-radius: 14px;
    overflow: hidden;
    background: #000;
    aspect-ratio: 16 / 9;
}

.nuky-video-modal__frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}

.nuky-video-modal .modal-body {
    position: relative;
}

.nuky-video-modal__nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    background: rgba(13, 64, 28, 0.55);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    transition: transform 160ms ease, background 160ms ease;
}

.nuky-video-modal__nav:hover {
    background: rgba(13, 64, 28, 0.75);
    transform: translateY(-50%) scale(1.04);
}

.nuky-video-modal__nav--prev {
    left: 12px;
}

.nuky-video-modal__nav--next {
    right: 12px;
}

/* Share QR — cùng cấu trúc .tf-btn (.text-style + .icon) như nút giỏ hàng; modal QR không dùng backdrop xám toàn màn */
.nuky-share-qr-modal.modal {
    --bs-modal-zindex: 10050;
}

.nuky-share-qr-modal .modal-content {
    box-shadow: 0 16px 48px rgba(13, 64, 28, 0.18);
    border: 1px solid rgba(13, 64, 28, 0.08);
}

.nuky-share-qr-modal .nuky-share-qr__host {
    width: 220px;
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.nuky-share-qr-modal .nuky-share-qr__host canvas,
.nuky-share-qr-modal .nuky-share-qr__host table {
    max-width: 100%;
    height: auto !important;
}

/* Modal khác (có backdrop): nổi trên header theme */
body.modal-open .modal-backdrop {
    z-index: 10040;
}

body.modal-open .modal.show {
    z-index: 10050;
}

/* Share QR (blog: chỉ icon — giữ .tf-btn nhưng phẳng như icon social) */
.page-blog-single .share .nuky-share-qr-social .nuky-share-qr__trigger.tf-btn {
    border: none;
    background: transparent;
    padding: 0.15rem 0.35rem;
    min-height: auto;
    line-height: 1;
    gap: 0;
    color: var(--Primary, #0d401c);
    box-shadow: none;
}

.page-blog-single .share .nuky-share-qr-social .nuky-share-qr__trigger.tf-btn::after {
    content: none;
}

.page-blog-single .share .nuky-share-qr-social .nuky-share-qr__trigger.tf-btn:hover {
    background: transparent;
    color: var(--Secondary, #f8c32c);
}

.page-blog-single .share .nuky-share-qr-social .nuky-share-qr__trigger.tf-btn:hover .text-style {
    color: inherit;
}

.page-blog-single .share .nuky-share-qr-social .nuky-share-qr__trigger .icon {
    width: auto;
    height: auto;
    background: transparent;
    border-radius: 0;
}

.page-blog-single .share .nuky-share-qr-social .nuky-share-qr__trigger .icon i {
    font-size: 1.35rem;
    color: inherit;
}