/* ==========================================================
   Tinh chỉnh trang chủ & khối sản phẩm (desktop + mobile)
   Tiêu đề nhẹ hơn, nút "Xem tất cả" mảnh, banner full trên mobile
   ========================================================== */

/* ---------- Banner chính ---------- */
.slide-top .hero-slide, .slide-top .hero-slide picture { display: block; }
.slide-top .hero-slide img { display: block; width: 100%; height: auto; max-width: 100% !important; }

/* ---------- Tiêu đề khối ---------- */
.homepage-product .title-box h2,
.sanphamhot .title-box h2,
.homepage-product .title-box .h-title h2 {
    font-size: 20px !important; font-weight: 600 !important; line-height: 1.3; color: var(--brand-navy, #0B2D6E) !important; letter-spacing: 0;
}

/* ---------- Nút "Xem tất cả": dạng link viền mảnh ---------- */
.title-box .view-all,
.homepage-product .title-box .view-all,
.homepage-product.top .view-all,
.homepage-product.products .title-box .view-all {
    position: static !important; width: auto !important; flex: 0 0 auto; margin: 0 0 0 auto !important;
    display: inline-flex !important; align-items: center; gap: 6px; height: 32px; padding: 0 12px !important;
    background: #fff !important; color: var(--brand-blue, #1C88D0) !important; border: 1px solid #CFE3F4 !important; border-radius: 8px !important;
    font-family: inherit !important; font-size: 13px !important; font-weight: 500 !important; line-height: 1 !important;
    box-shadow: none !important; text-decoration: none !important; white-space: nowrap; transition: background .15s, border-color .15s, color .15s;
}
.title-box .view-all::after { content: "\f105"; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 11px; }
.title-box .view-all:hover,
.homepage-product.top .view-all:hover { background: #EAF3FB !important; border-color: var(--brand-blue, #1C88D0) !important; color: var(--brand-navy, #0B2D6E) !important; }

/* ---------- Hàng chip thương hiệu ---------- */
.homepage-product .title-box { display: flex !important; align-items: center; gap: 12px; flex-wrap: nowrap; }
.homepage-product .title-box .sub-cate-title { flex: 1 1 auto; min-width: 0; margin: 0 !important; }
.title-box .sub-cate-title .list-sub a {
    font-size: 13px !important; font-weight: 400 !important; padding: 5px 12px !important; border-radius: 6px !important;
    background: #F5F8FC !important; border: 1px solid #DCE6F0 !important; color: #3B4A5E !important;
}
.title-box .sub-cate-title .list-sub a:hover { background: #EAF3FB !important; border-color: var(--brand-blue, #1C88D0) !important; color: var(--brand-navy, #0B2D6E) !important; }

/* ---------- Mobile ---------- */
@media (max-width: 767px) {
    /* Banner tràn viền, không còn khoảng trắng hai bên */
    .content_home .top-content > .container:first-child { padding-left: 0 !important; padding-right: 0 !important; }
    .content_home .top-content > .container:first-child > .row:not(:first-child) { margin-left: 12px; margin-right: 12px; }
    .content_home .right-slide, .content_home .right-slide .row, .content_home .right-slide .col { padding: 0 !important; margin: 0 !important; }
    .slide-top { border-radius: 0 !important; }
    .slide-top .slick-dots { bottom: 6px; }

    .homepage-product .title-box h2,
    .sanphamhot .title-box h2,
    .homepage-product .title-box .h-title h2 { font-size: 16px !important; font-weight: 600 !important; }
    .sanphamhot .title-box { margin-bottom: 8px !important; }

    .title-box .view-all,
    .homepage-product .title-box .view-all,
    .homepage-product.products .title-box .view-all { height: 28px; padding: 0 10px !important; font-size: 12px !important; }

    /* Chip thương hiệu: vuốt ngang, ẩn nút mũi tên */
    .homepage-product div.sub-cate-title { padding: 0 !important; }
    .homepage-product div.sub-cate-title span.span-left,
    .homepage-product div.sub-cate-title span.span-right { display: none !important; }
    .homepage-product .title-box .sub-cate-title .list-sub {
        display: flex !important; gap: 6px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; padding: 2px 0 !important;
    }
    .homepage-product .title-box .sub-cate-title .list-sub::-webkit-scrollbar { display: none; }
    .title-box .sub-cate-title .list-sub a { font-size: 12px !important; padding: 4px 10px !important; flex: 0 0 auto; margin: 0 !important; }

    /* Mũi tên slider đè lên thẻ sản phẩm */
    .homepage-product .slick-prev, .homepage-product .slick-next,
    .sanphamhot .slick-prev, .sanphamhot .slick-next { display: none !important; }

    /* Thẻ sản phẩm gọn hơn */
    .item-product .product-name { font-size: 13px !important; font-weight: 400 !important; line-height: 1.4; }
    .item-product .min-price { font-size: 15px !important; font-weight: 600 !important; }
}

/* Độ đậm chữ thẻ sản phẩm (desktop) */
.item-product .product-name { font-weight: 400 !important; }
.item-product .min-price { font-weight: 600 !important; font-size: 18px; }
div.sub-cate-title span.span-left, div.sub-cate-title span.span-right { font-size: 22px !important; color: #8FA6C2 !important; }
div.sub-cate-title span.span-left:hover, div.sub-cate-title span.span-right:hover { color: var(--brand-blue, #1C88D0) !important; }
