.spl-partners__item img {
    max-height: 130px;
} 
.spl-products ,.spl-adv,.spl-partners,.footer,.spl-about2 ,.spl-shop,.spl-pd,body{
    background: white;
} 
.common-home .header--scrolled .header__main ,.common-home .header__main ,.header .header__main{
    background: #107748;
}
.header .header__menu-link,.header__lang-toggle{
    color: white;

}
.header__logo-img {
    filter: brightness(0) invert(1);
}
.header .header__menu-link {
    font-size: 18px;
}
.cf--round {
    gap: 15px !important; 
}
.spl-pd__related {
    BORDER-top: 1px solid #107748;
    padding-top: 20px;
} 

.cat-sidebar::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 7px;
  background: linear-gradient(90deg, #08733F 36.74%, #B5D033 76.6%);
  border-radius: 12px 12px 0 0; /* chỉ bo 2 góc trên, khớp với góc cha */
}
.cat-sidebar {
    position: relative;

      border-radius: 5px;
      margin: 0 0 12px;
      padding: 23px 12px;
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.cat-sidebar__title {
    border-bottom: 1px solid #5CCD83;
    padding-bottom: 10px;
}

.cat-sidebar__title::before {
        background: linear-gradient(90deg, #08733F 36.74%, #B5D033 76.6%);
}
.spl-page-head {
    background: #fdfdfd;
    padding: 10px 0;
}


.spl-prod__card {
    position: relative;
    display: block;
    width: 100%;
    overflow: hidden;
    background: transparent;
    border-radius: 8px;
}

.spl-prod__img {
    display: block;
    width: 100%;
    height: auto;
    transition: transform 0.35s ease;
}

/* Lớp mô tả phủ lên toàn bộ ảnh */
.spl-prod__overlay {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: block;
    padding: 12px;
    overflow: hidden;
    color: #fff;
    background: linear-gradient(
        to bottom,
        rgba(0, 0, 0, 0.88) 0%,
        rgba(0, 0, 0, 0.72) 55%,
        rgba(0, 0, 0, 0.48) 100%
    );
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition:
        opacity 0.3s ease,
        visibility 0.3s ease,
        transform 0.3s ease;
}

/* Nội dung mô tả */
.spl-prod__description {
    width: 100%;
    max-height: 100%;
    overflow: hidden;
    color: #fff;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
    text-align: left;
    word-break: break-word;
}

/* Đồng bộ định dạng các thẻ HTML trong mô tả */
.spl-prod__description h1,
.spl-prod__description h2,
.spl-prod__description h3,
.spl-prod__description h4,
.spl-prod__description h5,
.spl-prod__description h6,
.spl-prod__description p,
.spl-prod__description div,
.spl-prod__description span,
.spl-prod__description strong,
.spl-prod__description b {
    margin: 0 0 4px;
    padding: 0;
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

.spl-prod__description h1,
.spl-prod__description h2,
.spl-prod__description h3,
.spl-prod__description h4,
.spl-prod__description h5,
.spl-prod__description h6,
.spl-prod__description strong,
.spl-prod__description b {
    font-weight: 600;
}

.spl-prod__description p:last-child,
.spl-prod__description div:last-child {
    margin-bottom: 0;
}

.spl-prod__description br {
    display: none;
}

/* Hiệu ứng khi hover vào sản phẩm */
.spl-prod__card:hover .spl-prod__img,
.spl-prod__card:focus .spl-prod__img {
    transform: scale(1.04);
}

.spl-prod__card:hover .spl-prod__overlay,
.spl-prod__card:focus .spl-prod__overlay {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Tên sản phẩm */
.spl-prod__name {
    margin: 12px 0 0;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.4;
    text-align: center;
}

.spl-prod__name a {
    color: inherit;
    text-decoration: none;
}

.spl-prod__name a:hover {
    color: var(--main-color);
}

/* Giao diện trên điện thoại */
@media (max-width: 767px) {

    .spl-prod__overlay {
        padding: 10px;
    }

    .spl-prod__description {
        max-height: 100%;
        font-size: 14px;
        line-height: 1.35;
    }

    .spl-prod__name {
        margin-top: 10px;
        font-size: 14px;
    }
} 
.spl-prod__name{
background: #0D6A3F;
    padding: 10px;
  margin:0;
}
.spl-prod__name a{
	color:#fff;
}
/* ============================================================
   [2026-08-18] Yêu cầu chỉnh sửa theme aqa (ảnh góp ý trong chat/)
   Đặt ở CUỐI file để override .spl-* của stylesheet/theme/spl-home.css
   ============================================================ */

/* ---- 1. Khung sản phẩm: trang danh mục SP / tất cả SP / tìm kiếm ----
   - Viền khung màu xanh #0D6A3F
   - Rê chuột KHÔNG đổ bóng xám, không nhấc card lên
   - Tên SP nằm trong dải xanh, chữ trắng in đậm, căn giữa */
.spl-prod {
    background: #fff;
    border: 1px solid #0D6A3F;
    border-radius: 8px;
    overflow: hidden;
}

.spl-prod__card {
    border-radius: 0;
    box-shadow: none;
    transform: none;
}

.spl-prod__card:hover,
.spl-prod__card:focus {
    box-shadow: none;
    transform: none;
}

.spl-prod__name {
    margin: 0;
    padding: 10px 12px;
    background: #0D6A3F;
    color: #fff;
    font-weight: 700;
    text-align: center;
}

.spl-prod__name a,
.spl-prod__name a:hover {
    color: #fff;
}

/* ---- 2. Nội dung hiện khi rê chuột vào sản phẩm: nền xám nhạt, chữ đen ---- */
.spl-prod__overlay {
    color: #000;
    background: #F1F1F1;
}

.spl-prod__description {
    color: #000;
}

/* ---- 3. Chi tiết SP: gạch ngang xanh phân tách phần mô tả ----
   Cùng kiểu với đường phía trên mục "Sản phẩm liên quan" */
.spl-pd__desc {
    border-top: 1px solid #107748;
    padding-top: 20px;
}

/* nền .spl-pd đã là trắng nên dải mờ cuối phần thu gọn phải mờ về trắng */
.spl-pd__desc-body.is-collapsed::after {
    background: linear-gradient(rgba(255, 255, 255, 0), #fff);
}

/* ---- 4. Sản phẩm liên quan: nền trắng + khung giống trang danh mục SP ---- */
.spl-pd__related {
    background: #fff;
}

.spl-relcard {
    background: #fff;
    border: 1px solid #0D6A3F;
    box-shadow: none;
}

.spl-relcard:hover {
    border-color: #0D6A3F;
    box-shadow: none;
    transform: none;
}

.spl-relcard__name {
    margin: auto 0 0;
    padding: 10px 12px;
    background: #0D6A3F;
    color: #fff;
    font-weight: 700;
    text-align: center;
}

.spl-relcard:hover .spl-relcard__name {
    color: #fff;
}

/* ============================================================
   MOBILE (< 992px)
   ============================================================ */
@media (max-width: 991.98px) {

    /* ---- 5. Icon "3 dấu gạch ngang" đổi sang màu trắng ---- */
    .header__toggler,
    .header__toggler i {
        color: #fff !important;
    }

    /* ---- 6. Nút chuyển ngôn ngữ Anh - Việt nằm ngay trên thanh header,
         bên trái nút hamburger (trước đây bị khuất trong drawer) ----
         Thanh header chuyển sang xếp hàng ngang: logo | ngôn ngữ | hamburger.
         Không dùng position:absolute nữa để logo tự co lại, không bị đè lên
         nút ngôn ngữ trên màn hình hẹp. */
    .header__inner {
        flex-wrap: nowrap;
        gap: 8px;
    }

    .header__logo {
        order: 1;
        margin: 0 auto;
        min-width: 0;
    }

    .header__logo-img {
        max-width: 100%;
        height: 44px;
        object-fit: contain;
    }

    #form-language {
        order: 2;
        position: static;
        transform: none;
        width: auto;
        flex: 0 0 auto;
    }

    .header__toggler {
        order: 3;
        position: static;
        transform: none;
        flex: 0 0 auto;
    }

    .header__lang-toggle {
        width: auto;
        justify-content: center;
        gap: 6px;
        padding: 8px 10px;
        border-radius: 999px;
        font-size: .9rem;
    }

    .header__lang {
        position: relative;
    }

    .header__lang-menu {
        display: none;
        position: absolute;
        top: calc(100% + 8px);
        right: 0;
        width: auto;
        min-width: 170px;
        border-radius: 8px;
        box-shadow: 0 6px 20px rgba(0, 0, 0, .22);
    }

    .header__lang.is-open .header__lang-menu {
        display: block;
    }

    /* ---- 7. Trang chủ: gạch ngang phân tách 2 khối nội dung ---- */
    .common-home .spl-adv {
        border-top: 1px solid #0D6A3F;
    }

    /* ---- 8. Không hiển thị nội dung rê chuột của sản phẩm trên mobile,
         chỉ hiện hình ảnh sản phẩm ---- */
    .spl-prod__overlay {
        display: none !important;
    }

    /* ---- 9. Không hiển thị cột "DANH MỤC SẢN PHẨM", chỉ hiện list sản phẩm ----
         Ẩn luôn cột bao ngoài (trình duyệt có :has) để không thừa khoảng trắng;
         rule sau là phương án dự phòng cho trình duyệt cũ. */
    body.product-category .spl-shop .row > [class*="col-"]:has(> .spl-shop__side),
    body.product-productall .spl-shop .row > [class*="col-"]:has(> .spl-shop__side),
    body.product-search .spl-shop .row > [class*="col-"]:has(> .spl-shop__side) {
        display: none;
    }

    body.product-category .spl-shop__side,
    body.product-productall .spl-shop__side,
    body.product-search .spl-shop__side {
        display: none;
    }

    /* ---- 10. Trang danh sách bài viết: bỏ cột "Bài viết mới nhất" ---- */
    body.news-category .spl-sidebar {
        display: none;
    }

    /* ---- 11. Trang chi tiết bài viết: bỏ mục "Tin liên quan" ---- */
    body.news-news .spl-related--full {
        display: none;
    }
}

/* ---- 12. Danh sách bài viết trên mobile: đổi sang layout hàng ngang ---- */
@media (max-width: 767.98px) {
    /* 1 cột để mỗi tin chiếm trọn bề ngang, ảnh trái - nội dung phải */
    .spl-news-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .spl-ncard {
        flex-direction: row;
        align-items: stretch;
        border-radius: 10px;
    }

    .spl-ncard:hover {
        transform: none;
    }

    .spl-ncard__media {
        flex: 0 0 118px;
        width: 118px;
        aspect-ratio: 1 / 1;
    }

    .spl-ncard__body {
        padding: 10px 12px;
    }

    .spl-ncard__title {
        font-size: .92rem;
        margin-bottom: 6px;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    .spl-ncard__excerpt {
        display: none;
    }

    .spl-ncard__date {
        margin-bottom: 6px;
    }

    .spl-ncard__more {
        font-size: .8rem;
    }
} 
.spl-share{
margin-bottom:24px
} 
/* ---- 13. Trang liên hệ: thông báo gửi form thành công hiện ngay trong trang ----
   Controller không còn chuyển sang trang information/contact/success nữa. */
.spl-cform__success {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 18px;
    padding: 14px 16px;
    border: 1px solid #0D6A3F;
    border-left-width: 4px;
    border-radius: 6px;
    background: #EAF5EF;
    color: #0D6A3F;
    font-size: .92rem;
    line-height: 1.6;
}

.spl-cform__success > i {
    flex: 0 0 auto;
    margin-top: 2px;
    font-size: 1.05rem;
}

.spl-cform__success-text {
    min-width: 0;
}

/* text_success trong file ngôn ngữ là một thẻ <p> nên phải gỡ margin mặc định */
.spl-cform__success-text p {
    margin: 0;
}

.spl-cform__success-text p + p {
    margin-top: 6px;
}

/* Khối báo lỗi chung của form liên hệ (dùng cho lỗi captcha v3 — loại lỗi
   không gắn với ô nhập nào, trước đây im lặng hoàn toàn) */
.spl-cform__alert {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 18px;
    padding: 14px 16px;
    border: 1px solid #e04b4b;
    border-left-width: 4px;
    border-radius: 6px;
    background: #fdecec;
    color: #b32b2b;
    font-size: .92rem;
    line-height: 1.6;
}

.spl-cform__alert > i {
    flex: 0 0 auto;
    margin-top: 2px;
    font-size: 1.05rem;
}

.spl-cform__alert-text {
    min-width: 0;
}

.spl-cform__alert-text p {
    margin: 0;
}