﻿/*
 * CSS bổ sung riêng cho FDCS - nạp bằng thẻ <link> riêng trong Site.Master, SAU bundle cssfe.axd.
 *
 * Vì sao không viết vào Custom.css: bootstrap.css (nằm trong bundle, trước Custom.css) có một khối
 * "@media (min-width: 1200px) {" ở khoảng dòng 8285 bị thiếu dấu "}" -> trình duyệt coi mọi CSS phía sau
 * (bootstrap-select, Custom.css, brand-slider) là nằm trong media đó, tức CHỈ chạy ở màn >= 1200px.
 * Không sửa bootstrap.css vì giao diện mobile/tablet hiện tại đã được chỉnh theo hiện trạng đó.
 */

/* ===== Cỡ chữ toàn site trên màn desktop (khách thấy chữ nhỏ ở zoom 100%) =====
 * Chỉ áp dụng từ 1200px trở lên; tablet/mobile giữ nguyên 14px như cũ. */
@media (min-width: 1200px) {
    body {
        font-size: 16px;
    }
    /* Menu đỏ trên cùng: giữ 14px như cũ - lên 16px thì 8 mục rộng hơn khung, mục "Liên hệ" bị đẩy mất */
    ul.navigation > li > a {
        font-size: 14px;
    }
    /* Dòng "CHUYÊN GIẢI PHÁP MẠNG LAN..." dưới header: khung cố định, lên 16px bị cắt mất chữ "THÔNG TIN" */
    .ticker-caption p {
        font-size: 14px;
    }
    /* Các khối đang khai báo cứng bằng px (không ăn theo body) -> nâng theo cùng tỷ lệ 14 -> 16 */
    .sidebar-post .single-post h5,
    .sidebar-post .single-post h5 a {
        font-size: 16px;
    }
    .sidebar-post .single-post .text,
    .sidebar-post .single-post .text p {
        font-size: 14px;
    }
    .detailpage .prod-title-p,
    .detailpage .prod-title-p p {
        font-size: 16px;
    }
    .detailpage .prod-title-p {
        height: 138px; /* cũ 121px cho chữ 14px -> giữ đủ số dòng mô tả khi chữ 16px */
        max-height: 138px;
    }
    .detailpage .note-call,
    .header-logo .dangnhap {
        font-size: 16px;
    }
}

/* ===== SEO: các thẻ H1 mới thêm - giữ nguyên giao diện cũ ===== */
/* Tên sản phẩm: trước là <div class="prod-title">, nay là <h1 class="prod-title"> */
h1.prod-title {
    font-size: 1.2em;
    font-weight: bold;
    line-height: inherit;
    font-family: inherit;
    color: inherit;
    text-transform: none;
    margin: 0;
    padding: 0;
}
/* Logo trang chủ được bọc trong <h1 class="logo-h1"> */
h1.logo-h1 {
    font-size: inherit;
    line-height: inherit;
    font-weight: inherit;
    margin: 0;
    padding: 0;
}
/* Tiêu đề trang danh sách bài viết (giải pháp, tin tức...) */
h1.listnews-title {
    font-size: 1.5em;
    font-weight: 500;
    color: #078c49;
    text-transform: uppercase;
    margin: 10px 0;
}


/* ===== Trang chi tiết SP - cột thứ 3 (Giải pháp / Chính sách bán hàng / Liên hệ) =====
 * Yêu cầu: "GIAO DIỆN SP WEBSITE FDCS 01.11.2026" + góp ý của khách:
 *  - không bị thụt/lệch trái, nội dung phủ kín khung;
 *  - cao cân bằng với 2 cột còn lại.
 * Cỡ chữ: toàn bộ cột 3 tính theo em từ font-size của .fdc-col3 (= cỡ chữ toàn site ở từng mốc màn hình)
 * -> chỉ cần đổi 1 giá trị là cả khối to/nhỏ đều nhau.
 * Mọi selector đều bắt đầu bằng .chinh-sach để mạnh hơn rule cũ trong style.css/Custom.css (kể cả trong @media).
 */
.detailpage .chinh-sach {
    max-height: none; /* bỏ giới hạn 543px ở màn 1601-2000px (nội dung giờ dài hơn) */
}
/* Khung chung của cột 3: tràn hết bề ngang cột; các dòng có đường kẻ mờ tràn ngang + 2 nút giãn đều
   -> cột không bị trống 2 bên dù chữ chỉ bằng cỡ chữ toàn site. */
.chinh-sach .fdc-col3 {
    margin: 0;
    padding: 0 4px 0 12px; /* cách lề trái cột 1 đoạn */
    font-size: 14px; /* < 1200px: bằng cột giữa */
}
/* Tiêu đề 3 khối: chữ xanh của site + gạch chân xanh tràn ngang cho nổi bật (cỡ chữ giữ nguyên) */
.chinh-sach h4,
.chinh-sach .title-chatinproduct {
    font-size: 1.15em;
    font-weight: bold;
    color: #078c49;
    margin: 0.3em 0 0.2em;
    padding-bottom: 3px;
    border-bottom: 2px solid #078c49;
}
.chinh-sach .chinh-sach-box {
    margin: 0;
    padding: 0;
    list-style: none;
}
.chinh-sach .menu-icon-csbh {
    font-size: 1em;
    line-height: 1.57em;
    margin: 0;
    padding: 1px 0;
    border-bottom: 1px solid #ececec; /* kẻ dòng mờ tràn hết bề ngang cột (cả dòng cuối) */
}
.chinh-sach .text-csbh {
    font-size: 1em;
}
/* Icon sát lề trái (bỏ lề 15px cũ), cùng cỡ cho cả 2 danh sách */
.chinh-sach .csbh-img {
    width: 1.15em;
    margin: 0 0.43em 0 0;
    vertical-align: -0.2em;
}
.fdc-sol-icon {
    display: inline-block;
    width: 1.15em;
    margin: 0 0.43em 0 0;
    text-align: center;
    font-size: 1em;
    line-height: 1;
}
.fdc-sol a {
    color: inherit;
    text-decoration: none;
}
.fdc-sol a:hover .text-csbh {
    color: #078c49;
}
.chinh-sach .fdc-sec h4.fdc-sol-next {
    margin-top: 0.75em;
}
/* "LIÊN HỆ TƯ VẤN NGAY": 2 nút nằm ngang, tự xuống dòng khi cột hẹp */
.chinh-sach .chat-div-inproduct {
    border: 0;
}
.chinh-sach .title-chatinproduct {
    height: auto;
    margin-top: 0.75em;
    padding-top: 0;
    text-align: left;
}
.chinh-sach .row-chat {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0;
    padding-bottom: 6px;
}
.chinh-sach .row-chat:before,
.chinh-sach .row-chat:after {
    display: none;
}
.chinh-sach .row-chat .single-row {
    flex: 1 1 auto; /* 2 nút giãn đều hết bề ngang */
}
.chinh-sach .row-chat .single-row > div {
    float: none;
    width: auto;
    padding: 0;
}
.chinh-sach .row-chatinproduct {
    display: block;
    text-align: center;
    font-size: 0.93em;
    padding: 0.46em 0.77em;
    margin-top: 4px;
    white-space: nowrap;
}
/* Màn >= 1200px (3 cột nằm ngang): 3 cột cao bằng nhau, nội dung cột 3 dàn đều theo chiều cao */
@media (min-width: 1200px) {
    .detailpage #wrap-top-info {
        display: flex;
        align-items: stretch;
    }
    .detailpage #wrap-top-info:before,
    .detailpage #wrap-top-info:after {
        display: none;
    }
    .detailpage #wrap-top-info > div {
        flex: 0 0 auto;
    }
    /* cột 2 có margin-bottom 10px (style.css) -> viền hụt 10px so với 2 cột kia.
       Bỏ margin ở cột 2, chuyển 10px đó xuống dưới cả hàng để giữ khoảng hở với thanh tab bên dưới. */
    .detailpage #wrap-top-info > .top-info-right {
        margin-bottom: 0;
    }
    .detailpage #wrap-top-info {
        margin-bottom: 10px;
    }
    .detailpage .chinh-sach {
        display: flex;
        flex-direction: column;
    }
    .detailpage .chinh-sach .fdc-col3 {
        flex: 1 1 auto;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-self: stretch;
        font-size: 16px; /* bằng cỡ chữ toàn site ở màn này (body 16px, xem đầu file) */
    }
    /* chữ to hơn thì giãn dòng ít lại để cột không cao hơn 2 cột kia */
    .detailpage .chinh-sach .menu-icon-csbh {
        line-height: 1.45em;
        padding: 0;
    }
    /* 2 nút Hotline / Mr Long luôn 1 hàng: ở 1200-1600px (cả zoom 125% trên màn 1920) phần nội dung cột chỉ còn ~354px
       -> bớt lề trong của nút + chữ nút 14px */
    .detailpage .chinh-sach .row-chat {
        flex-wrap: nowrap;
    }
    .detailpage .chinh-sach .row-chatinproduct {
        font-size: 0.875em;
        padding-left: 0.5em;
        padding-right: 0.5em;
    }
}
/* Màn 768-1199px: nội dung cột giữa (.prod-offer, .prod-title-p) đang bị cố định rộng 360px trong khi cột chỉ rộng ~250-323px
   -> tràn đè sang cột thứ 3 (lỗi có từ trước). Cho co theo bề rộng cột. */
@media (min-width: 768px) and (max-width: 1199px) {
    .detailpage .prod-offer,
    .detailpage .prod-title-p {
        width: auto;
        max-width: 100%;
    }
}
