/* ==========================================================================
   1. THIẾT LẬP TIÊU ĐỀ HÀNG ĐẦU (H1, H2, H3, H4): ĐEN ĐẬM, FONT CHUẨN, KHÔNG VIỀN
   ========================================================================== */
h1,
h1.product-title,
h1 span,
h1 b,
h1 strong,
h2,
h3,
h4,
h2 span,
h3 span,
h2 b,
h3 b {}

h1,
h1.product-title,
h2,
h3,
h4 {
    display: block !important;
    /* margin-bottom: 20px !important; */
    /* font-size: 26px !important; */
    /* Đặt kích thước cố định cho H1 */
}

/* ==========================================================================
   2. CÁC ĐOẠN TEXT ĐẶC BIỆT, TỪ KHÓA IN ĐẬM
   ========================================================================== */
.tab-content strong,
.tab-content b,
.s_content strong,
.s_content b,
figcaption,
figcaption strong,
.product-custom-meta strong,
ul li b,
ul li strong {
    color: #000000 !important;
    font-weight: bold !important;
    border: none !important;
}

/* Định dạng chung cho các liên kết */
.tab-content a,
.tab-content a strong,
.tab-content a em,
.s_content a,
.s_content a strong,
.s_content a em {
    color: #000000 !important;
    font-weight: bold !important;
    text-decoration: none !important;
    border: none !important;
}

/* Xóa bỏ các khung viền, nét đứt bao quanh text */
figure,
figcaption,
.contact-info {
    border: none !important;
}

#news-bodyhtml span[style*="font-size: 16px"] {
    color: #000000 !important;
    font-weight: bold !important;
}

/* ==========================================================================
   3. GIỮ NGUYÊN GIAO DIỆN NÚT BẤM (.PRODUCT-ACTIONS)
   ========================================================================== */
.product-actions a.btn {
    color: inherit;
    font-weight: inherit;
    border: inherit;
    background: inherit;
    display: inline-block;
}

/* ==========================================================================
   4. TEXT MÔ TẢ VÀ VĂN BẢN THÔNG THƯỜNG
   ========================================================================== */
p,
.product-short-desc p,
.attr-item,
span,
li,
ul,
td,
th,
div:not(.tab-content):not(.tab-pane):not(.product-actions) {
    color: #333333 !important;
    /* font-weight: normal; */
}

/* ==========================================================================
   5. CẤU HÌNH KHUNG CHỨA (TAB-CONTENT VÀ S_CONTENT) RỘNG RÃI
   ========================================================================== */
.tab-pane,
.tab-content,
.tab-content div,
.s_content,
.s_content div {
    max-width: 100% !important;
}

/* ==========================================================================
   6. CỐ ĐỊNH KÍCH THƯỚC HÌNH ẢNH (790X593PX)
   ========================================================================== */
.tab-content figure.image,
.s_content figure.image,
.s_content .image,
figure.image.alignnone,
figure.image.size-medium {
    width: 790px !important;
    max-width: 100% !important;
    height: 593px !important;
    display: inline-block !important;
    margin: 15px auto !important;
    padding: 0 !important;
    border: none !important;
}

.tab-content figure.image img,
.s_content img,
figure.image img.alignnone,
figure.image img[class*="wp-image-"] {
    width: 790px !important;
    min-width: 790px !important;
    height: 593px !important;
    min-height: 593px !important;
    object-fit: cover !important;
    border: none !important;
    display: block !important;
    margin: 0 auto !important;
}

.s_content img[width="16"],
.s_content img[width="48"] {
    width: auto !important;
    min-width: auto !important;
    height: auto !important;
    min-height: auto !important;
    display: inline-block !important;
}

figcaption {
    color: #333333 !important;
    font-weight: normal !important;
    font-size: 15px !important;
    margin-top: 8px !important;
    text-align: center !important;
    width: 100% !important;
    display: block !important;
}

/* ==========================================================================
   7. ĐỊNH DẠNG BẢNG THÔNG SỐ VÀ VIDEO
   ========================================================================== */
.s_content table {
    width: 790px !important;
    max-width: 100% !important;
    margin: 20px auto !important;
    border-collapse: collapse !important;
}

.s_content iframe {
    width: 790px !important;
    max-width: 100% !important;
    height: 445px !important;
    display: block !important;
    margin: 20px auto !important;
}

/* ==========================================================================
   8. RESPONSIVE
   ========================================================================== */
@media (max-width: 820px) {

    .tab-content figure.image,
    .tab-content figure.image img,
    .s_content figure.image,
    .s_content .image,
    .s_content img,
    figure.image.alignnone,
    figure.image.size-medium,
    figure.image img.alignnone,
    figure.image img[class*="wp-image-"],
    .s_content table,
    .s_content iframe {
        width: 100% !important;
        min-width: 100% !important;
        height: auto !important;
        min-height: auto !important;
    }
}


/* ============================================================= */
/* 1. ĐỔI THANH TOP BAR SANG NỀN ĐEN SẪM & THÊM DẤU GẠCH ĐỨNG */
#top-bar {
    background-color: #1a1a1a !important;
    /* Đổi nền sang đen sẫm */
    border: none !important;
}

#top-bar .nav {
    background-color: transparent !important;
    /* Xóa khung nền trắng của menu */
}

#top-bar .nav>li>a {
    color: #b5b5b5 !important;
    /* Chữ màu xám sáng */
    font-size: 13px !important;
    padding: 0 10px !important;
}

#top-bar .nav>li>a:hover {
    color: #ffffff !important;
}

/* Tạo dấu gạch đứng phân tách giữa các mục menu phụ */
#top-bar .nav>li+li {
    border-left: 1px solid #444 !important;
}

/* 2. CĂN CHỈNH HOTLINE NẰM THẲNG HÀNG NGANG */
.header-hotline-custom {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
}

.header-hotline-custom .hotline-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    border: 2px solid #1a1a1a !important;
    border-radius: 50% !important;
}

.header-hotline-custom .hotline-icon i {
    font-size: 15px !important;
    color: #1a1a1a !important;
    margin: 0 !important;
}

.header-hotline-custom .hotline-text {
    font-size: 15px !important;
    font-weight: bold !important;
    color: #1a1a1a !important;
    line-height: 1 !important;
}

/* 3. ĐỔI VIỀN Ô TÌM KIẾM SANG MÀU ĐEN ĐẬM */
.searchform .search-field {
    border-radius: 0 !important;
    border: 1px solid #000000 !important;
    /* Viền đen đậm */
    background-color: #fff !important;
    height: 38px !important;
}

.searchform button[type="submit"] {
    background-color: transparent !important;
    color: #000000 !important;
    border: none !important;
    box-shadow: none !important;
    font-size: 18px !important;
}

/* 4. TỐI ƯU MENU CHÍNH: KHÔNG BỊ RỚT DÒNG */
.header-bottom {
    background-color: #ffffff !important;
    border-top: 1px solid #eaeaea !important;
    border-bottom: 2px solid #1a1a1a !important;
    /* Viền đen mỏng ở đáy menu */
}

.header-bottom .nav>li>a {
    color: #111111 !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    font-size: 12.5px !important;
    /* Thu nhỏ chữ để vừa 1 dòng */
    padding-left: 8px !important;
    /* Giảm khoảng cách giữa các nút */
    padding-right: 8px !important;
    letter-spacing: -0.3px !important;
}

/* Đổi màu icon ngôi nhà và các mũi tên chỉ xuống sang màu đỏ */
.header-bottom .nav>li.menu-item-has-children>a::after,
.header-bottom .nav>li.menu-item-has-children>a .icon-angle-down,
.header-bottom .nav .icon-home {
    color: #ff0000 !important;
}

/* ÉP MENU CHÍNH NẰM TRÊN 1 DÒNG DUY NHẤT */
.header-bottom .nav {
    display: flex !important;
    flex-wrap: nowrap !important;
    /* Không cho phép các mục menu tự động xuống dòng */
    justify-content: space-between !important;
    width: 100% !important;
}

/* Thu nhỏ cỡ chữ và giảm khoảng cách giữa các mục menu */
.header-bottom .nav>li>a {
    font-size: 12.5px !important;
    /* Thu nhỏ cỡ chữ xuống 12.5px */
    padding-left: 8px !important;
    /* Giảm khoảng cách đệm bên trái */
    padding-right: 8px !important;
    /* Giảm khoảng cách đệm bên phải */
    letter-spacing: -0.4px !important;
    /* Thu hẹp khoảng cách giữa các chữ cái một chút */
    white-space: nowrap !important;
    /* Không cho phép chữ trong từng mục bị xuống dòng */
    font-weight: bold;
    font-size: 16px;
    line-height: 23px;
}

/* Đảm bảo container của bottom header co giãn hết cỡ */
.header-bottom .flex-row {
    max-width: 100% !important;
}

/* ĐƯA ICON KÍNH LÚP VÀO BÊN TRONG Ô TÌM KIẾM */
.search-wrapper,
.searchform {
    position: relative !important;
    display: block !important;
}

/* 1. Thiết lập ô nhập liệu: chừa khoảng trống bên phải để chứa icon */
.searchform .search-field,
.header-search-form input[type="search"] {
    width: 100% !important;
    padding-right: 40px !important;
    /* Chừa 40px bên phải để icon không đè lên chữ */
    border: 1px solid #ccc !important;
    /* Viền xám mỏng */
    border-radius: 0 !important;
    /* Góc vuông */
    height: 38px !important;
    box-sizing: border-box !important;
}

/* 2. Ép nút kính lúp bay vào trong góc phải của ô input */
.searchform button[type="submit"],
.searchform .submit-button,
#header-searchform .submit-btn,
.searchform .flex-col:last-child {
    position: absolute !important;
    right: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background-color: transparent !important;
    /* Bỏ màu nền */
    border: none !important;
    /* Bỏ viền */
    box-shadow: none !important;
    height: 100% !important;
    width: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
    z-index: 9 !important;
}

/* 3. Chuyển icon kính lúp sang màu đen sẫm */
.searchform button[type="submit"] i,
.searchform button[type="submit"] svg,
#header-searchform .submit-btn img {
    color: #1a1a1a !important;
    font-size: 16px !important;
    filter: brightness(0) !important;
    /* Chuyển icon sang màu đen sẫm nếu là ảnh */
}

/* 4. Reset các cột flex của Flatsome để tránh bị lệch */
.searchform .flex-row {
    display: block !important;
}

.searchform .flex-col {
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
}

/* ============================================================= */
/* 1. RESET THANH TOP BAR VÀ KHUNG MENU (XÓA BỎ NỀN TRẮNG) */
#top-bar {
    background-color: #222222 !important;
    /* Nền đen sẫm toàn thanh */
}

#top-bar .nav,
#top-bar .nav-right-col,
#top-bar .html-1-col,
#top-bar .header-nav {
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

/* 2. STYLE LAYOUT CHO MENU PHỤ */
.top-nav {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    background: transparent !important;
    border: none !important;
}

.top-nav .nav-links {
    display: flex !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: center !important;
}

.top-nav .nav-links li {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
}

/* Dấu gạch đứng giữa các chữ */
.top-nav .nav-links li+li::before {
    content: "|" !important;
    color: #444444 !important;
    margin: 0 12px !important;
}

/* Dấu gạch đứng ngăn cách giữa chữ "Liên hệ" và "Cờ" */
.top-nav .top-divider {
    color: #444444 !important;
    margin: 0 12px !important;
    font-size: 13px !important;
}

/* Màu chữ của menu phụ */
.top-nav .nav-links li a {
    color: #8da2b5 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
}

.top-nav .nav-links li a:hover {
    color: #ffffff !important;
}

/* 3. ĐỊNH HÌNH CỤM CỜ VÀ ĐẢO THỨ TỰ (CỜ VIỆT LÊN TRƯỚC CỜ ANH) */
.top-nav .top-flags {
    display: flex !important;
    align-items: center !important;
}

/* Ép plugin GTranslate đảo thứ tự hiển thị cờ */
.top-nav .top-flags>div,
.top-nav .top-flags .switcher {
    display: flex !important;
    flex-direction: row-reverse !important;
    /* Đảo ngược cờ Việt lên trước */
    align-items: center !important;

}

/* Đảm bảo ảnh cờ hiển thị đẹp */
.top-nav .top-flags img {
    margin: 0 !important;
    border-radius: 2px !important;
}

/* 1. TĂNG KÍCH THƯỚC CHỮ MENU PHỤ */
.top-nav .nav-links li a {
    font-size: 14.5px !important;
    /* Tăng từ 13px lên 14.5px */
}

/* 2. ĐẨY DẤU GẠCH ĐỨNG VÀ LÁ CỜ CÁCH XA CHỮ "LIÊN HỆ" */
.top-nav .top-divider {
    margin: 0 22px !important;
    /* Đẩy khoảng cách 2 bên dấu gạch đứng rộng ra */
    font-size: 15px !important;
}

/* Thêm khoảng cách thụt lề cho cụm cờ */
.top-nav .top-flags {
    margin-left: 5px !important;
}

/* DROPDOWN SUBMENU - STYLE DỌC CHUẨN */

/* Khung dropdown: nền trắng, viền trên đỏ */
.header-bottom .nav .sub-menu,
.nav-dropdown .sub-menu {
    background-color: #ffffff !important;
    border-top: 3px solid #e53935 !important;
    border-left: 1px solid #eeeeee !important;
    border-right: 1px solid #eeeeee !important;
    border-bottom: 1px solid #eeeeee !important;
    border-radius: 0 !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12) !important;
    min-width: 240px !important;
    padding: 8px 0 !important;
}

/* TIÊU ĐỀ CẤP 1 TRONG DROPDOWN (mục đầu tiên): Đỏ cam + đậm */
.header-bottom .nav .sub-menu>li:first-child>a {
    /* color: #8d8d8d !important;
    font-weight: 700 !important;
    font-size: 15px !important;
    text-transform: none !important;
    padding: 10px 18px 10px 18px !important;
    border-bottom: 1px solid #f0f0f0 !important;
    display: block !important;
    pointer-events: none !important;
    cursor: default !important; */
}

/* CÁC MỤC CON: Chữ đen, thường */
.header-bottom .nav .sub-menu>li>a {
    color: #333333 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    text-transform: none !important;
    padding: 8px 20px !important;
    display: block !important;
    background-color: transparent !important;
    border: none !important;
    line-height: 1.5 !important;
}

/* HOVER MỤC CON: Chữ đỏ, nền xám nhạt */
.header-bottom .nav .sub-menu>li:not(:first-child)>a:hover {
    color: #8d8d8d !important;
    background-color: #fafafa !important;
    padding-left: 24px !important;
    /* Thụt lề nhẹ khi hover */
    transition: all 0.2s ease !important;
}

/* ANIMATION: Dropdown xuất hiện mượt mà */
.header-bottom .nav li:hover>.sub-menu,
.header-bottom .nav li.sfHover>.sub-menu {
    animation: dropdownFadeIn 0.2s ease forwards !important;
}

@keyframes dropdownFadeIn {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }

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

article.post .s_content {
    border: 1px solid #d9d9d9 !important;
    padding: 20px 24px !important;
    background: #fff !important;
}

/* Căn giữa thông tin meta sản phẩm */
.product-custom-meta,
.contact-info {
    text-align: center;
}

/* Căn giữa nội dung bên trong attr-item nếu cần */
.attr-item {
    /* display: flex;
    justify-content: center; */
}

.product-custom-meta .contact-info {
    align-items: start !important;
    justify-content: start !important;
}

/* Loại bỏ nền xám, viền và khoảng cách của khối bao ngoài */
.product-custom-meta,
.contact-info,
.attr-item {
    background-color: transparent !important;
    /* Xóa màu nền xám */
    border: none !important;
    /* Xóa khung viền */
    box-shadow: none !important;
    /* Xóa đổ bóng nếu có */
    padding: 0 !important;
    /* Xóa khoảng cách bên trong khung */
}

/* Điều chỉnh kích thước và đồng bộ hóa phần Liên hệ */
.contact-info {
    font-size: 14px !important;
    /* Thay đổi số này để khớp với cỡ chữ các dòng trên */
    display: flex;
    align-items: center;
    justify-content: center;
    /* Căn giữa */
    gap: 8px;
    /* Khoảng cách giữa chữ Liên hệ, icon và số đt */
}

/* Phóng to Icon (nếu là font-icon hoặc SVG) */
.contact-info i,
.contact-info svg {
    font-size: 16px !important;
    /* Phóng to icon */
    width: 16px !important;
    height: 16px !important;
}

/* Đảm bảo chữ Liên hệ và SĐT hiển thị rõ nét */
.contact-info span,
.contact-info a {
    font-size: 14px !important;
    line-height: 1.5;
}

/* --- Cấu hình khối Liên hệ --- */
.contact-info {
    font-size: 14px !important;
    /* Cỡ chữ tổng thể */
    display: flex;
    align-items: center;
    justify-content: center;
    /* Căn giữa nội dung */
    gap: 8px;
    /* Khoảng cách giữa chữ, icon và SĐT */
    margin-top: 10px;
    /* Khoảng cách phía trên */
}

/* --- Màu sắc cho Chữ và SĐT --- */
.contact-info span {
    color: #d12020 !important;
    /* Chữ "Liên hệ" màu đỏ */
    font-weight: bold;
    font-size: 14px !important;
}

.contact-info a {
    color: #000000 !important;
    /* Số điện thoại màu đen */
    font-weight: bold;
    font-size: 17px !important;
    line-height: 1.5;
}

/* --- Tùy chỉnh Icon (Xanh lá và kích thước) --- */
.contact-info i,
.contact-info svg {
    color: #28a745 !important;
    /* Màu xanh lá */
    font-size: 16px !important;
    /* Kích thước icon */
    width: 16px !important;
    height: 16px !important;
}

/* Nếu icon là thẻ img thì dùng đoạn này */
.contact-info img {
    width: 16px !important;
    height: 16px !important;
}

/* Chỉ áp dụng cho trang chi tiết sản phẩm - Bỏ căn giữa */
.single-product .product-custom-meta,
.single-product .contact-info {
    text-align: left !important;
    justify-content: flex-start !important;
    /* Đẩy nội dung về phía bên trái */
}

/* Đảm bảo các mục thông tin con cũng căn trái */
.single-product .attr-item {
    justify-content: flex-start !important;
}

/* Chỉ áp dụng riêng cho thanh Breadcrumb */
.page-breadcrumb {
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;

    /* Khoảng cách: 40px trên, 0 phải, 20px dưới, 80px trái (dịch phải) */
    padding: 40px 0 0px 100px !important;

    background: transparent !important;
    background-image: none !important;
    /* Xóa ảnh nền gạch trắng */
    border: none !important;

    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    /* Căn trái */
    box-sizing: border-box !important;
}



/* 1. Ẩn breadcrumb mặc định của theme */
.page-breadcrumb {
    display: none !important;
}

/* 2. Cấu trúc cụm nút bấm */
.product-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin-top: 15px !important;
}

.product-actions a {
    display: flex !important;
    flex-direction: column !important;
    /* Thay đổi: Cho phép chữ xếp chồng dọc */
    justify-content: center !important;
    align-items: center !important;
    padding: 15px !important;
    color: #fff !important;
    font-weight: bold !important;
    text-decoration: none !important;
    border-radius: 4px !important;
    flex: 1 1 45% !important;
}

/* 3. Màu sắc và thêm Content phụ */

/* Nút Đăng ký mua */
.product-actions a[data-target="#buyModal"] {
    background-color: #009688 !important;
    padding: 8px 12px !important;
}

.product-actions a[data-target="#buyModal"]::after {
    content: "Được tư vấn miễn phí";
    font-size: 12px !important;
    font-weight: normal !important;
    margin-top: 4px !important;
}

/* Nút Hẹn lịch xem */
.product-actions a[data-target="#scheduleModal"] {
    background-color: #3f51b5 !important;
    padding: 8px 12px !important;
}

.product-actions a[data-target="#scheduleModal"]::after {
    content: "Được sắp chỗ để xe miễn phí";
    font-size: 12px !important;
    font-weight: normal !important;
    margin-top: 4px !important;
}

/* Nút Nhận báo giá */
.product-actions .btn-tertiary {
    background-color: #d84315 !important;
    flex: 1 1 100% !important;
}

/* Thiết lập chiều cao cố định và cắt ảnh giữ tỷ lệ */
.box-image img {
    width: 100% !important;
    /* Đảm bảo chiều rộng lấp đầy khung */
    height: auto !important;
    /* Thay đổi số này theo chiều cao bạn muốn */
    object-fit: cover;
    /* Quan trọng: giúp ảnh không bị biến dạng */
    object-position: center;
    /* Căn giữa ảnh */
}

/* Đảm bảo các khung chứa ảnh có kích thước ổn định */
.box-image {
    position: relative;
    overflow: hidden;
}

/* =============================================================
     2    CSS HOÀN CHỈNH CHO FOOTER (NỀN TRẮNG - CHỮ ĐEN - FONT ARIAL)
     3    ============================================================= */

/* =============================================================
     2    FOOTER DARK MODE (NỀN ĐEN - CHỮ TRẮNG - FONT ARIAL)
     3    ============================================================= */

/* 1. Thiết lập tổng thể Footer - Nền đen chữ trắng */
footer#footer {
    background-color: #000000 !important;
    /* Đổi sang nền đen */
    color: #ffffff !important;
    /* Đổi sang chữ trắng */
    padding: 60px 0 0 0 !important;
    border-top: 1px solid #222222 !important;
    line-height: 1.6 !important;
}

/* Ép tất cả các thẻ con dùng font Arial và màu trắng */
footer#footer * {
    color: #ffffff !important;
}

/* 2. Tiêu đề các cột (Về chúng tôi, Hỗ trợ khách hàng...) */
footer#footer .title {
    color: #ffffff !important;
    /* Tiêu đề trắng */
    font-size: 19px !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    margin-bottom: 25px !important;
    display: inline-block !important;
    border: none !important;
    /* Đảm bảo không viền theo yêu cầu cũ */
}

/* 3. Định dạng danh sách Menu */
footer#footer .footer-menu ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

footer#footer .footer-menu li {
    padding: 10px 0 !important;
    border-bottom: 1px solid #222222 !important;
    /* Đường kẻ tối màu */
}

/* 4. Định dạng các liên kết (Links) */
footer#footer a {
    color: #ffffff !important;
    /* Link trắng */
    text-decoration: none !important;
    transition: all 0.3s ease;
}

footer#footer a:hover {
    color: #d4af37 !important;
    /* Hover vẫn giữ màu vàng đồng cho sang */
    padding-left: 5px;
}

/* ÉP CÁC MỤC MENU FOOTER LUÔN TRÊN 1 DÒNG & THU NHỎ CHỮ */
footer#footer .footer-menu ul li a {
    white-space: nowrap !important;
    display: block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 100% !important;
    font-size: 13px !important;
    letter-spacing: -0.2px !important;
}

/* 5. Mạng xã hội (Social Icons) */
footer#footer .socialList ul {
    display: flex !important;
    list-style: none !important;
    gap: 12px !important;
    padding: 0 !important;
    margin-top: 20px !important;
}

footer#footer .socialList li a {
    background: #ffffff !important;
    /* Nền nút trắng */
    color: #000000 !important;
    /* Icon đen */
    width: 36px;
    height: 36px;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
}

/* 6. Bảng thông tin liên hệ */
footer#footer table.info-table td {
    padding: 10px 0 !important;
    color: #ffffff !important;
    vertical-align: top !important;
    border: none !important;
}

/* Thay thế biểu tượng bằng dấu > */
footer#footer .footer-menu ul li i::before,
footer#footer table td i::before {
    content: ">" !important;
    font-weight: bold !important;
    font-style: normal !important;
}

footer#footer .footer-menu ul li i,
footer#footer table td i {
    width: 15px !important;
    display: inline-block !important;
    color: #ffffff !important;
    /* Dấu > trắng */
    font-size: 14px !important;
}

/* 7. Phần Bộ đếm (Counter) */
footer#footer .counter {
    background-color: #111111 !important;
    /* Nền đen nhẹ */
    border: 1px solid #222222 !important;
    padding: 15px 20px !important;
    border-radius: 10px !important;
    margin-top: 30px !important;
}

footer#footer .counter li {
    display: flex !important;
    justify-content: space-between !important;
    padding: 8px 0 !important;
    border-bottom: 1px solid #222222 !important;
}

/* 8. Bản quyền dưới cùng (Copyright) */
footer#footer .s_bottom {
    background-color: #000000 !important;
    /* Nền đen tuyền */
    padding: 25px 0 !important;
    margin-top: 50px !important;
    border-top: 1px solid #222222 !important;
    font-size: 14px !important;
}

footer#footer .s_bottom strong {
    color: #ffffff !important;
}

/* 9. Hệ thống Grid (24 cột) & Responsive (Đã sửa lỗi Media Query) */
footer#footer .row {
    display: flex !important;
    flex-wrap: wrap !important;
}

@media screen and (min-width: 992px) {
    footer#footer .col-md-6 {
        width: 25% !important;
    }

    footer#footer .col-md-7 {
        width: 29.16% !important;
    }

    footer#footer .col-md-5 {
        width: 20.83% !important;
    }

    footer#footer .col-md-12 {
        width: 50% !important;
    }

    footer#footer .col-md-6,
    footer#footer .col-md-7 {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}

@media screen and (max-width: 767px) {
    footer#footer [class*="col-xs-24"] {
        width: 100% !important;
        margin-bottom: 30px !important;
    }

    footer#footer .text-right {
        text-align: left !important;
        margin-top: 10px !important;
    }
}

/* Tùy chỉnh Bản đồ & Xóa khung viền */
footer#footer .s_content,
footer#footer .block_default,
footer#footer table,
footer#footer td {
    border: none !important;
    background: transparent !important;
}

footer#footer .block_default iframe {
    height: 145px !important;
    border: none !important;
    border-radius: 5px !important;

}

/* =============================================================
   TIN TỨC_RIGHT
============================================================= */


/* Tùy chỉnh khối tin tức tổng thể */
.news-block {
    border: 1px solid #e1e1e1;
    padding: 15px;
}

/* Logo công ty */
.news-logo img {
    max-width: 100px;
    margin-bottom: 10px;
    margin: auto;
    max-height: 100px;
}

.news-logo {
    margin: auto;
    text-align: center;
    margin-bottom: 20px;
}


/* Xóa style mặc định của ul và thiết lập khoảng cách */
.news-list .news-item {
    margin: 0 !important;
    list-style: none !important;
}

.news-list .news-item h3 {
    margin-bottom: 0px;
}

/*  xóa cả khoảng cách giữa các hàng kẻ ngang */
.news-item {
    padding-top: 1px !important;
    padding-bottom: 12px !important;
}

/* Định dạng từng mục tin tức */
.news-item {
    border-bottom: 1px dashed #ccc;
    padding: 6px 0;
    /* ĐÃ THAY ĐỔI: Giảm từ 12px xuống 6px để thu hẹp khoảng cách các dòng */
}

/* Loại bỏ đường kẻ ở mục cuối cùng */
.news-item:last-child {
    border-bottom: none;
}

/* Định dạng tiêu đề tin tức */
.news-item h3 a {
    font-size: 16px;
    /* ĐÃ THAY ĐỔI: Giảm từ 16px xuống 13px để text nhỏ lại */
    margin: 0;
    font-weight: normal;
    line-height: 1.3;
    /* ĐÃ THAY ĐỔI: Giảm từ 1.4 xuống 1.2 để các dòng trong tiêu đề (nếu dài) sát lại */
}

/* Định dạng link */
.news-item a {
    text-decoration: none;
    color: #333;
    display: block;
}

/* Hiệu ứng khi di chuột vào - Đổi sang màu đỏ cam */
.news-item a:hover {
    color: #d84315;
}

/* =============================================================
   TIN TỨC_DUOIPHAI
============================================================= */

/* 1. TẠO BORDER CHO CẢ KHỐI CHA */
.projects-col {
    border: 1px solid #cccccc !important;
    /* Viền bao quanh cả khối */
    padding: 20px !important;
    /* Khoảng cách từ viền vào các bài viết bên trong */

    background: #fff !important;
    /* Màu nền cho cả khối */
    max-width: 280px !important;
    /* Thu nhỏ độ rộng của cả khối */
    margin: 0 auto !important;
    /* Căn giữa khối ra giữa trang */
}

/* 2. SẮP XẾP CÁC BÀI VIẾT BÊN TRONG (XẾP DỌC) */
.projects-col .swiper-wrapper {
    display: flex !important;
    flex-direction: column !important;
    /* Xếp các bài viết theo hàng dọc */
    transform: none !important;
    /* Tắt hiệu ứng trượt */
    gap: 10px !important;
    /* Khoảng cách giữa các bài viết bên trong */
}

/* 3. ĐỊNH DẠNG TỪNG BÀI VIẾT (KHÔNG CÓ BORDER RIÊNG) */
.projects-col .project-item {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    /* Ảnh trên, chữ dưới */
    align-items: center !important;
    height: auto !important;
    padding-bottom: 15px !important;
    border-bottom: 3px dashed #eee !important;
    /* Đường gạch nhẹ giữa các bài (tùy chọn) */
}

/* Xóa đường gạch cho bài viết cuối cùng */
.projects-col .project-item:last-child {
    border-bottom: none !important;
    padding-bottom: 0 !important;
}

/* 4. ĐỊNH DẠNG ẢNH */
.projects-col .project-item img {
    width: 200px !important;
    height: 200px !important;
    border-radius: 8px !important;
    margin-bottom: 12px !important;
}

/* 5. CĂN GIỮ TIÊU ĐỀ */
.projects-col .project-item h4 {
    text-align: center !important;
    margin: 0 !important;
}

.projects-col .project-item h4 a {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #333 !important;
    text-decoration: none !important;
    line-height: 1.4;
}

.projects-col .project-item h4 a:hover {
    color: #d84315 !important;
}

/* =============================================================
   TIN TỨC_DUOITRAI
============================================================= */
/* Container danh sách bài viết */
.posts-col .post-list {
    display: flex;
    flex-direction: column;
    gap: 30px;
    /* Khoảng cách giữa các bài viết */
}

/* Định dạng từng bài viết thành Grid */
.posts-col .post-item {
    display: grid;
    /* Cột 1 rộng 280px cho ảnh, cột 2 chiếm phần còn lại */
    grid-template-columns: 130px 1fr;
    /* Hàng 1 cho Tiêu đề, Hàng 2 cho nội dung */
    grid-template-rows: auto 1fr;
    gap: 10px;
    /* Khoảng cách ngang giữa ảnh và chữ là 25px */
    align-items: start;
    padding-bottom: 10px;
    border-bottom: 2px solid #ececec;
    /* Đường kẻ phân cách nhẹ */
}

/* Cấu hình cho Ảnh bài viết */
.posts-col .post-item img {
    grid-column: 1;
    /* Nằm ở cột 1 */
    grid-row: 1 / span 2;
    /* Chiếm cả 2 hàng để cao bằng khối text bên phải */
    width: 100% !important;
    height: 100px !important;
    /* Bạn có thể chỉnh độ cao tùy ý */
    object-fit: cover;
    /* Giúp ảnh không bị méo khi thu phóng */
    border-radius: 5px;
    /* Bo góc ảnh cho mềm mại */
    margin-bottom: 0 !important;
}

/* Cấu hình cho Tiêu đề (H3) */
.posts-col .post-item h3 {
    grid-column: 2;
    /* Nằm ở cột 2 */
    grid-row: 1;
    /* Nằm ở hàng 1 */
    margin: 0 0 0px !important;
    /* Khoảng cách dưới tiêu đề */
    /* font-size: 1.3rem; */
    padding: 0 !important;
}

.posts-col .post-item h3 a {
    color: #333;
    text-decoration: none;
    font-weight: bold;
}

.posts-col .post-item h3 a:hover {
    color: #d2691e;
    /* Màu khi di chuột vào tiêu đề */
}

/* Cấu hình cho Đoạn mô tả (P) */
.posts-col .post-item p {
    grid-column: 2;
    /* Nằm ở cột 2 */
    grid-row: 2;
    /* Nằm ở hàng 2 */
    margin: 0 !important;
    color: #666;
    font-size: 0.95rem;
    line-height: 1.6;
    /* Giới hạn text hiển thị 3 dòng (tùy chọn) */
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Tối ưu hiển thị trên Điện thoại (Mobile) */
@media (max-width: 768px) {
    .posts-col .post-item {
        grid-template-columns: 1fr;
        /* Trên mobile chuyển về 1 cột dọc */
        grid-template-rows: auto auto auto;
        gap: 15px 0;
    }

    .posts-col .post-item img {
        grid-column: 1;
        grid-row: 1;
        height: auto !important;
    }

    .posts-col .post-item h3 {
        grid-column: 1;
        grid-row: 2;
    }

    .posts-col .post-item p {
        grid-column: 1;
        grid-row: 3;
    }
}

/*=============================================================
   TIN TỨC_CACTINKHAC
============================================================= */

/*bỏ margin */
.other-news-block {
    margin: 0 !important
}

/* 1. Khoảng cách cho toàn bộ khối tin khác */
.other-news-block {
    margin-top: 40px;
    padding: 20px 0;
}

#section_549899625 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

#section_806619048 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

#section_806619048 .other-news-block {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

#section_1799376075 {
    padding-top: 0 !important;

}

/* 2. Bold tiêu đề "Các tin khác" và tạo khoảng cách */
.other-news-block .block-title {
    font-weight: bold;
    text-transform: uppercase;
    /* Viết hoa cho chuyên nghiệp (tùy chọn) */
    margin-bottom: 25px;
    /* Khoảng cách từ tiêu đề đến danh sách */
    font-size: 1.5rem;
    color: #1c1c1c;
}

/* 3. Xóa dấu chấm mặc định của danh sách */
.other-news-list {
    list-style: none !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}

/* 4. Tạo dấu > và thiết kế từng mục tin */
.other-news-item {
    position: relative;
    padding: 10px 0 10px 25px;
    /* Tạo khoảng trống bên trái để đặt dấu > */
    border-bottom: 1px solid #f1f1f1;
    /* Đường kẻ mờ giữa các tin */
}

.other-news-item:last-child {
    border-bottom: none;
}

/* Chèn dấu > vào trước mỗi bài viết */
.other-news-item::before {
    content: ">";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    color: #000000;
    /* Màu của dấu > */
    font-weight: bold;
}

.other-news-item a:hover {
    color: #d84315;
    /* Màu khi di chuột vào */
}

/* 6. Chỉnh font chữ cho ngày tháng */
.other-news-item .date {
    font-size: 0.85rem;
    color: #888;
    font-weight: normal;
    /* Ngày tháng để bình thường cho dễ phân biệt */
}

/* Thêm dấu mở ngoặc trước ngày tháng */
.other-news-item .date::before {
    content: "(";
}

/* Thêm dấu đóng ngoặc sau ngày tháng */
.other-news-item .date::after {
    content: ")";
}

/* Tinh chỉnh lại một chút để ngày tháng trông gọn hơn */
.other-news-item .date {
    font-size: 0.85rem;
    color: #888;
    font-weight: normal;
    margin-left: 5px;
    /* Tạo khoảng cách nhỏ với tiêu đề bài viết */
}

/* 1. Xóa đường kẻ giữa các bài viết */
.other-news-item {
    border-bottom: none !important;
    /* Bỏ gạch ngang */
    padding-top: 3px !important;
    /* Thu nhỏ khoảng cách trên */
    padding-bottom: 3px !important;
    /* Thu nhỏ khoảng cách dưới */
    margin-bottom: 0 !important;
    /* Xóa khoảng cách lề nếu có */
}

/* 2. Căn chỉnh lại dấu > cho khớp với khoảng cách mới */
.other-news-item::before {
    top: 10px;
    /* Điều chỉnh lại vị trí dấu > cho cân đối */
    transform: none;
}

/* 3. Giảm khoảng cách danh sách tổng thể */
.other-news-list {
    margin-top: 10px !important;
}

/* 1. Tiêu đề chính "Các tin khác" - làm đậm vừa phải */
.other-news-block .block-title {
    font-weight: 600 !important;
    /* Mức độ đậm vừa (Semi-bold) */
    margin-bottom: 15px;
    font-size: 1.4rem;
}

/* 2. Tiêu đề từng bài viết - làm đậm nhẹ */
.other-news-item a {
    font-weight: 500 !important;
    /* Mức độ đậm nhẹ (Medium) */
    color: #333;
    text-decoration: none;
}

/* 3. Đảm bảo các bài viết sát nhau và không có gạch ngang */
.other-news-item {
    border-bottom: none !important;
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}

/*=============================================================
   TIN TỨC_TRANG
============================================================= */
/* 1. Container: Thu hẹp khoảng cách các ô */
.mina-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    /* Giảm từ 10px xuống 6px để sát nhau hơn */
    margin-top: 20px;
}

/* 2. Thiết kế chung cho các ô số */
.mina-pagination .page-numbers {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 38px;
    /* Thu nhỏ một chút để thanh thoát hơn */
    height: 38px;
    border-radius: 50% !important;
    text-decoration: none;
    transition: all 0.3s ease;
    font-weight: 500;
    border: 1px solid #ddd;
    color: #333;
    background-color: #fff;
    font-size: 14px;
}

/* 3. Trang hiện tại (Xám đen, chữ trắng) */
.mina-pagination .page-numbers.current {
    background-color: #333 !important;
    color: #fff !important;
    border-color: #333 !important;
}

/* 4. XỬ LÝ NÚT TRANG TRƯỚC / TRANG SAU (Khớp với text) */
.mina-pagination .next.page-numbers,
.mina-pagination .prev.page-numbers {
    width: auto !important;
    /* Bỏ cố định hình tròn để text không bị tràn */
    min-width: 38px;
    padding: 0 15px !important;
    /* Thêm khoảng trống 2 bên cho text */
    border-radius: 20px !important;
    /* Chuyển sang dạng bo góc dài (viên thuốc) */
    white-space: nowrap;
    /* Giữ text trên 1 dòng */
}

/* 5. Hiệu ứng Hover */
.mina-pagination a.page-numbers:hover {
    background-color: #333;
    color: #fff !important;
    border-color: #333;
}

/* 6. Dấu ba chấm */
.mina-pagination .page-numbers.dots {
    border: none;
    background: none;
    width: 20px;
    /* Thu hẹp khoảng cách dấu ... */
}

/*=============================================================
   CHI_TIET_TINTUC
============================================================= */

/* 1. TẠO KHUNG VIỀN BAO BỌC TOÀN BỘ TRANG (ROW TỔNG) */
.row.pt-half.pb-half {
    border: 1px solid #e1e1e1;
    background-color: #fff;
    padding: 30px;
    margin-top: 20px !important;
    margin-bottom: 40px !important;
    border-radius: 8px;
}

/* 1. Định dạng khung bao quanh */
.toc-wrapper {
    border: 1px solid #ddd !important;
    padding: 10px !important;
    background: #fff;
}

/* 2. Tiêu đề "Mục lục nội dung" */
.ez-toc-title {
    font-size: 24px !important;
    font-weight: bold !important;
    color: #333 !important;
    margin-bottom: 10px !important;
}

/* 3. Màu chữ cho các đường link mục lục */
.ez-toc-link {
    color: #4b8b3b !important;
    /* Màu xanh lá nhạt như trong ảnh */
    font-size: 16px !important;
    text-decoration: none !important;
}

.ez-toc-link:hover {
    color: #33662a !important;
    /* Đậm hơn một chút khi di chuột vào */
    text-decoration: underline !important;
}

/* 4. Tạo đường kẻ ngang giữa các mục */
.ez-toc-list li a {
    border-bottom: 1px dashed #ccc !important;
    /* Đường kẻ đứt nét */
    padding: 8px 0 !important;
}

/* Loại bỏ đường kẻ ở mục cuối cùng để nhìn gọn hơn */
.ez-toc-list li:last-child {
    border-bottom: none !important;
}

/* 5. Ẩn các mục phụ (3.1, 3.2...) nếu bạn chỉ muốn hiện mục chính như ảnh */
/* Nếu muốn hiện tất cả thì bỏ đoạn này đi */
.ez-toc-list-level-3,
.ez-toc-list-level-4 {
    display: none;
}

/* Chặn plugin sinh ra số bằng kỹ thuật Counter */
#ez-toc-container,
#ez-toc-container ul,
#ez-toc-container li {
    counter-reset: none !important;
    /* Xóa bộ đếm */
    list-style-type: none !important;
    /* Xóa dấu chấm/số mặc định */
}

/* Xóa các con số đã hiển thị ra ngoài */
#ez-toc-container .ez-toc-number,
#ez-toc-container .ez-toc-list li::before {
    display: none !important;
    content: none !important;
}

/* Ẩn tiêu đề cấp 1 (H1) */
#ez-toc-container .ez-toc-list-level-1>li>a {
    display: none !important;
}

/* Ẩn các cấp mục lục con (H3, H4...) */
#ez-toc-container .ez-toc-list-level-3,
#ez-toc-container .ez-toc-list-level-4,
#ez-toc-container .ez-toc-list-level-5 {
    display: none !important;
}

/* Căn lề trái cho thẳng hàng */
#ez-toc-container ul.ez-toc-list-level-2 {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* 1. Xóa các thẻ chứa số do plugin tạo ra */
#ez-toc-container span[class*="ez-toc-number"] {
    display: none !important;
}

/* 2. Triệt tiêu số tự động bằng kỹ thuật Counter */
#ez-toc-container .ez-toc-list,
#ez-toc-container .ez-toc-list li,
#ez-toc-container .ez-toc-list li a {
    counter-reset: none !important;
    counter-increment: none !important;
}

/* 3. Xóa nội dung số hiển thị trước mỗi dòng bài viết */
#ez-toc-container .ez-toc-list li::before,
#ez-toc-container .ez-toc-list li a::before {
    content: none !important;
    display: none !important;
}

/* 4. Đảm bảo danh sách không dùng kiểu mặc định của trình duyệt */
#ez-toc-container ul {
    list-style: none !important;
    list-style-type: none !important;
}

/* Áp dụng padding bên phải cho tất cả thẻ figure trong nội dung bài viết */
figure img {
    padding-right: 95px !important;
    display: inline-block !important;
    /* Bắt buộc để nhận padding và nằm cùng hàng */
}


/* --- THIẾT KẾ FORM BÁO GIÁ --- */

/* 2. Giảm khoảng cách giữa các hàng tổng thể */
.quote-contact-form .wpcf7-form {
    display: flex;
    flex-direction: column;
}

.quote-contact-form {
    padding-bottom: 0 !important;
}

/* 3. Nhóm các hàng có 2 cột (row-flex) */
.quote-contact-form .wpcf7-form .row-flex {
    display: flex;
    gap: 8px;
    /* Khoảng cách giữa 2 cột bên trong hàng */
}

.row-flex .dk-tv-field {
    margin: 0
}

.dk-tv-field {
    margin: 0 !important;
}

.quote-contact-form .dk-tv-field span input {
    margin: 0;

}

.quote-contact-form .row-flex {
    margin-bottom: 9px !important;
}

.dk-tv-captcha {
    margin: 0 !important;
}

.quote-contact-form .dk-tv-field span textarea {
    margin: 0;
}

/* Chỉnh ô input */
.dk-tv-captcha .dk-captcha-input input {
    height: 40px !important;
    margin: 0 !important;
    padding: 0 10px;
    box-sizing: border-box;
}

/* Chỉnh nút refresh cho đẹp */
.dk-tv-captcha .dk-captcha-refresh {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 20px;
    /* Tăng giảm kích thước icon tùy ý */
    padding: 0;
    margin: 0 0;
}

/* NÚT GỬI ĐI*/
.quote-contact-form .wpcf7-submit {
    grid-column: 1 / span 2 !important;
    width: 20% !important;
    background-color: #d84315 !important;
    color: #fff !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    border: none !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    transition: 0.3s !important;
}

.quote-contact-form .wpcf7-submit:hover {
    background-color: #cc3300 !important;
}

/* --- THIẾT KẾ FORM Bình luận --- */

/* --- THIẾT KẾ KHUNG BÌNH LUẬN --- */
#respond {
    /* background-color: #f8f9fa !important;
    border-radius: 12px !important;
    border: 1px solid #eee !important; */
}

#reply-title {
    font-weight: 600 !important;
    font-size: 1.3rem !important;
    color: #333 !important;
    margin-bottom: 20px !important;
}

/* Ô nhập bình luận */
#commentform textarea {
    border: 1px solid #ddd !important;
    border-radius: 8px !important;
    padding: 15px !important;
    min-height: 120px !important;
}

/* Nút Gửi bình luận */
#commentform .submit {
    background-color: #d84315 !important;
    /* Màu xám đen đồng bộ với phân trang */
    /* color: #fff !important;
    font-weight: 600 !important;
    padding: 9px 9px !important; */
    border-radius: 4px !important;
    /* Hình viên thuốc */
    border: none !important;
    text-transform: uppercase;
    transition: 0.3s;
}



/* Thông báo lỗi hoặc yêu cầu đăng nhập */
.comment-respond .alert {
    border-radius: 8px !important;
    font-size: 14px !important;
}



/* css header */
.header-main .header-inner .logo {
    margin-right: 0 !important;
}

.header-nav-main .html_topbar_right {
    margin-left: 285px !important;
}

.project-gallery h2 {
    font-size: 1.25rem;
}

.block-about.col,
.block-news.col {
    padding-bottom: 0px;
}

body .slick-dots li {
    margin: 0px
}

body .slick-dots .col-inner ul li {
    margin-left: 0px;
}