@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700&family=Orbitron:wght@700;800&display=swap');
:root {
  --hp-primary:       #0B4F9E;   /* Xanh công vụ - màu chủ đạo            */
  --hp-primary-dark:  #083C79;   /* Xanh đậm - thanh menu, menu footer    */
  --hp-primary-light: #E9F1FB;   /* Xanh rất nhạt - nền khi rê chuột      */
  --hp-accent:        #C41E22;   /* Đỏ cờ - gạch chân tiêu đề, điểm nhấn  */
  --hp-gold:          #E9A319;   /* Vàng - viền focus bàn phím            */
  --hp-link-footer:   #FFD98A;   /* Vàng nhạt - liên kết trong footer     */

  --hp-ink:           #1B2733;   /* Chữ chính                             */
  --hp-muted:         #5A6779;   /* Chữ phụ: ngày tháng, chú thích        */
  --hp-border:        #DCE3ED;   /* Đường viền thẻ                        */
  --hp-page:          #F3F6FA;   /* Nền trang                             */
  --hp-card:          #FFFFFF;   /* Nền thẻ                               */

  --hp-radius:        10px;      /* Bo góc thẻ                            */
  --hp-radius-sm:     8px;       /* Bo góc nút, ô nhập                    */
  --hp-shadow:        0 1px 2px rgba(16,32,64,.06), 0 6px 18px rgba(16,32,64,.07);
  --hp-shadow-hover:  0 10px 24px rgba(11,79,158,.16);
}
body,
h1, h2, h3, h4, h5, h6,
p, a, li, td, th, span, div, label, strong, b, blockquote,
input, button, select, textarea,
.btn, .form-control {
  font-family: 'Be Vietnam Pro', 'Inter', 'Segoe UI', Roboto, Arial, sans-serif !important;
}

/* Trả lại font biểu tượng cho trình phát video JWPlayer */
.jwplayer, .jwplayer div, .jwplayer span, .jwplayer button {
  font-family: Arial, Helvetica, sans-serif !important;
}
.jwplayer [class*="jw-icon"], .jwplayer .jw-icon {
  font-family: jw-icons !important;
}
/* Trả lại font biểu tượng cho FontAwesome / Glyphicons / slick */
.fa, .fas, .far, .fal, .fab, em.fa, i.fa,
[class^="fa-"], [class*=" fa-"] {
  font-family: FontAwesome !important;
}
.glyphicon, [class^="glyphicon-"], [class*=" glyphicon-"] {
  font-family: 'Glyphicons Halflings' !important;
}
.slick-prev:before, .slick-next:before, .slick-dots li button:before {
  font-family: 'slick' !important;
}

body {
  background: var(--hp-page) !important;
  color: var(--hp-ink) !important;
  font-size: 16px !important;
  line-height: 1.65 !important;
  -webkit-font-smoothing: antialiased !important;
}

a {
  color: var(--hp-primary) !important;
  text-decoration: none !important;
  transition: color .15s ease !important;
}
a:hover { color: var(--hp-accent) !important; }

#body { background: transparent !important; }
/* ==========================================================================
   4. HEADER & MENU CHÍNH
   ========================================================================== */

/* Giữ ảnh nền sông Đồng Nai, phủ thêm lớp chuyển sắc xanh để logo và
   dòng chữ "ĐẢNG ỦY - HĐND - UBND" nổi rõ trên nền ảnh. */
header {

background-image: linear-gradient(90deg, rgba(8, 60, 121, .92) 0%, rgba(11, 79, 158, .72) 5%, rgb(223 238 255 / 15%) 100%),
  url("https://hungphuoc.dongnai.gov.vn/uploads/hungphuoc/header-hp.png") !important;
  background-size: cover !important;
  background-position: center !important;
    url("https://hungphuoc.dongnai.gov.vn/uploads/hungphuoc/header-hp.png") !important;
  background-size: cover !important;
  background-position: center !important;
}

/* Thanh menu chính */
.section-nav {
  background: var(--hp-primary-dark) !important;
  box-shadow: 0 2px 10px rgba(8,60,121,.25) !important;
}
#menusite .custom_menu_all { background: transparent !important; }

#menusite ul.slimmenucs > li > a {
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: .4px !important;
  padding: 13px 25px !important;
  border-radius: var(--hp-radius-sm) !important;
  transition: background .15s ease !important;
}
#menusite ul.slimmenucs > li > a:hover,
#menusite ul.slimmenucs > li:hover > a,
#menusite ul.slimmenucs > li.active > a {
  background: rgba(255,255,255,.16) !important;
  color: #fff !important;
}

/* Menu con đổ xuống: thẻ trắng bo góc, có đổ bóng */
#menusite ul.slimmenucs ul {
  background: #fff !important;
  border: 1px solid var(--hp-border) !important;
  border-radius: var(--hp-radius) !important;
  box-shadow: 0 12px 28px rgba(8,60,121,.18) !important;
  padding: 6px !important;
}
#menusite ul.slimmenucs ul li a {
  color: var(--hp-ink) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 9px 12px !important;
  border-radius: 6px !important;
  text-transform: none !important;
}
#menusite ul.slimmenucs ul li a:hover {
  background: var(--hp-primary-light) !important;
  color: var(--hp-primary) !important;
}
/* ==========================================================================
   5. THANH NGÀY THÁNG & DÒNG CHỮ CHẠY
   ========================================================================== */
.third-nav .bg {
  background: #fff !important;
  border: 1px solid var(--hp-border) !important;
  border-radius: var(--hp-radius) !important;
  padding: 10px 16px !important;
  box-shadow: var(--hp-shadow) !important;
  color: var(--hp-muted) !important;
}
.third-nav .clearfix { background: transparent !important; }

/* Chữ chạy: đổi từ đỏ chói sang xanh đậm cho dễ đọc */
.my_marquee span {
  color: var(--hp-primary-dark) !important;
  font-weight: 600 !important;
  font-size: 14.5px !important;
}
/* ==========================================================================
   6. THẺ TIN (PANEL) & TIÊU ĐỀ KHỐI
   ========================================================================== */
.panel,
.news_column .panel {
  background: var(--hp-card) !important;
  border: 1px solid var(--hp-border) !important;
  border-radius: var(--hp-radius) !important;
  box-shadow: var(--hp-shadow) !important;
  margin-bottom: 22px !important;
  overflow: hidden !important;
}

/* Tiêu đề khối: bỏ kiểu "tab xanh chữ trắng",
   chuyển sang chữ xanh đậm + gạch chân đỏ 3px */
/* Có 2 kiểu tiêu đề khối trong theme:
     (a) <div class="panel-heading"><h4><a><span>Tiêu đề</span></a></h4></div>
         -> phần lớn các khối tin ở cột giữa
     (b) <div class="panel-heading">Tiêu đề</div>  (chữ trần, không có span)
         -> các khối cột phải: Lịch làm việc, Thông báo, Thăm dò ý kiến,
            Thống kê truy cập
   Phải xử lý CẢ HAI, nếu chỉ tô màu cho span thì kiểu (b) giữ nguyên
   chữ trắng của theme -> trắng trên nền trắng, không đọc được. */
.panel-heading {
  background: #fff !important;
  color: var(--hp-primary) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  letter-spacing: .3px !important;
  padding: 14px 18px 12px !important;
  border-bottom: 1px solid var(--hp-border) !important;
  border-radius: 0 !important;
}
/* Kiểu (a): gạch chân đỏ chỉ nằm dưới dòng chữ.
   margin-bottom âm kéo đường gạch xuống sát mép dưới của khối tiêu đề. */
.panel-heading span {
  background: transparent !important;
  color: var(--hp-primary) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  letter-spacing: .3px !important;
  padding: 0 0 12px !important;
  margin: 0 0 -12px !important;
  border-bottom: 3px solid var(--hp-accent) !important;
  display: inline-block !important;
  border-radius: 0 !important;
}
/* Kiểu (b): gạch chân đỏ chạy hết chiều ngang khối tiêu đề.
   Dùng :has() - trình duyệt cũ (trước 2023) bỏ qua dòng này,
   khi đó tiêu đề vẫn đọc tốt, chỉ không có vạch đỏ. */
.panel-heading:not(:has(span)) {
  border-bottom: 3px solid var(--hp-accent) !important;
}

.panel-body { padding: 18px !important; }
.panel-body img { border-radius: var(--hp-radius-sm) !important; }

/* Tiêu đề tin trong thẻ */
.panel-body a,
.news_column .panel-body a {
  font-size: 15px !important;
  line-height: 1.55 !important;
  font-weight: 600 !important;
  color: var(--hp-ink) !important;
}
.news_column .panel-body a:hover { color: var(--hp-primary) !important; }
/* ==========================================================================
   7. TAB "TIN MỚI / TIN XEM NHIỀU"
   ========================================================================== */
.slide-tab .nav-tabs,
.slide-tab .nav.nav-tabs {
  background: #fff !important;
  border-radius: var(--hp-radius) var(--hp-radius) 0 0 !important;
}
.nav-tabs { border-bottom: 1px solid var(--hp-border) !important; }
.nav-tabs > li > a {
  background: #fff !important;
  color: var(--hp-muted) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  padding: 12px 18px !important;
  border: 0 !important;
  border-radius: 0 !important;
  border-bottom: 3px solid transparent !important;
}
.nav-tabs > li.active > a,
.nav-tabs > li > a:hover {
  background: #fff !important;
  color: var(--hp-primary) !important;
  border-bottom: 3px solid var(--hp-accent) !important;
}
/* ==========================================================================
   8. Ô TÌM KIẾM & MENU CỘT PHẢI
   ========================================================================== */
.kttt-search {
  background: #fff !important;
  border: 1px solid var(--hp-border) !important;
  border-radius: var(--hp-radius) !important;
  box-shadow: var(--hp-shadow) !important;
  padding: 14px !important;
  margin-bottom: 20px !important;
}
.kttt-search .form-control {
  height: 44px !important;                        /* đủ chuẩn vùng chạm */
  border: 1px solid var(--hp-border) !important;
  border-radius: var(--hp-radius-sm) 0 0 var(--hp-radius-sm) !important;
  font-size: 15px !important;
  box-shadow: none !important;
}
.kttt-search .form-control:focus {
  border-color: var(--hp-primary) !important;
  box-shadow: 0 0 0 3px rgba(11,79,158,.15) !important;
}
.kttt-search .btn {
  background: var(--hp-primary) !important;
  border-color: var(--hp-primary) !important;
  color: #fff !important;
  height: 44px !important;
  border-radius: 0 var(--hp-radius-sm) var(--hp-radius-sm) 0 !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  padding: 0 18px !important;
}
.kttt-search .btn:hover { background: var(--hp-primary-dark) !important; }
.form-control::placeholder { color: #8A94A6 !important; opacity: 1 !important; }

/* Menu dọc cột phải: từ nền đen #333 -> thẻ trắng */
aside.sidebar {
  background: #fff !important;
  border: 1px solid var(--hp-border) !important;
  border-radius: var(--hp-radius) !important;
  box-shadow: var(--hp-shadow) !important;
  overflow: hidden !important;
}
.sidebar-nav, aside.sidebar nav, aside.sidebar ul { background: #fff !important; }
/* CHÚ Ý: file jquery.metisMenu.css của theme có rule
     .metismenu a { color: #fff !important; }
   cùng độ ưu tiên chọn lọc với ".metismenu a". Nếu file này nạp trước
   file đó thì chữ sẽ trở lại màu trắng -> trắng trên nền trắng.
   Vì vậy dùng chuỗi chọn lọc dài hơn để luôn thắng, bất kể thứ tự nạp. */
.metismenu aside.sidebar nav ul li a {
  background: #fff !important;
  color: var(--hp-ink) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  padding: 13px 18px !important;
  box-shadow: none !important;
  border-bottom: 1px solid var(--hp-border) !important;
  border-left: 3px solid transparent !important;
}
.metismenu aside.sidebar nav ul li a:hover,
.metismenu aside.sidebar nav ul li a:focus,
.metismenu aside.sidebar nav ul li a:active {
  background: var(--hp-primary-light) !important;
  color: var(--hp-primary) !important;
  border-left-color: var(--hp-accent) !important;
}
.metismenu aside.sidebar nav ul li:last-child a { border-bottom: 0 !important; }
.metismenu .arrow { color: var(--hp-muted) !important; }
/* ==========================================================================
   9. Ô DỊCH VỤ NHANH (Chuyển đổi số, DVC trực tuyến, 1022, ...)
   ========================================================================== */
.item_quick_link {
  background: #fff !important;
  border: 1px solid var(--hp-border) !important;
  border-left: 4px solid var(--hp-primary) !important;
  border-radius: var(--hp-radius) !important;
  padding: 14px !important;
  box-shadow: var(--hp-shadow) !important;
  transition: transform .15s ease, box-shadow .15s ease !important;
}
.item_quick_link:hover {
  transform: translateY(-2px) !important;
  box-shadow: var(--hp-shadow-hover) !important;
  border-left-color: var(--hp-accent) !important;
}
.item_quick_link a,
.item_quick_link h3 a {
  color: var(--hp-primary-dark) !important;
  font-weight: 600 !important;
  font-size: 14.5px !important;
  line-height: 1.45 !important;
  text-transform: none !important;
}
/* Icon vốn là ảnh PNG màu trắng -> đặt trong khối nền xanh để nhìn thấy rõ */
.item_quick_link .item_td {
  background: var(--hp-primary) !important;
  border-radius: var(--hp-radius-sm) !important;
  padding: 7px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.item_quick_link:hover .item_td { background: var(--hp-accent) !important; }

/* Xếp icon và chữ trên một hàng, chữ dài không tràn ra ngoài ô */
.item_quick_link .item_head_landing {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
.item_quick_link .item_td { float: none !important; flex: 0 0 auto !important; margin: 0 !important; }
.item_quick_link h3, .item_quick_link .m2 {
  margin: 0 !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
}
/* ==========================================================================
   10. BANNER LIÊN KẾT CỘT PHẢI
   ========================================================================== */
.nv-block-banners {
  background: #fff !important;
  border: 1px solid var(--hp-border) !important;
  border-radius: var(--hp-radius-sm) !important;
  overflow: hidden !important;
  margin-bottom: 12px !important;
}
.nv-block-banners img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
}
/* ==========================================================================
   11. NÚT BẤM CHUNG
   ========================================================================== */
.btn { border-radius: var(--hp-radius-sm) !important; font-weight: 600 !important; }
.btn-primary, .btn-info {
  background: var(--hp-primary) !important;
  border-color: var(--hp-primary) !important;
  color: #fff !important;
}
.btn-primary:hover, .btn-info:hover {
  background: var(--hp-primary-dark) !important;
  border-color: var(--hp-primary-dark) !important;
}
.btn-success {                                   /* nút "Bình chọn" */
  background: #137A45 !important;
  border-color: #137A45 !important;
  color: #fff !important;
}
/* ==========================================================================
   12. FOOTER
   Trước: chữ trắng/đỏ trên nền cyan #3BC3F5 -> tương phản ~2.2:1 (không đạt).
   Sau:   chữ trắng trên nền xanh #0B4F9E    -> tương phản ~8.3:1 (đạt AA/AAA).
   ========================================================================== */
.custom-menu-footer { background: var(--hp-primary-dark) !important; }
.custom-menu-footer a {
  color: #fff !important;
  font-weight: 600 !important;
  font-size: 15px !important;
}

footer#footer {
  background: var(--hp-primary) !important;
  color: #E7EEF8 !important;
  font-size: 15px !important;
  line-height: 1.8 !important;
  padding: 32px 0 !important;
}
footer#footer h1, footer#footer h2, footer#footer h3,
footer#footer strong, footer#footer b, footer#footer span { color: #fff !important; }
footer#footer a { color: var(--hp-link-footer) !important; }

/* Nút "Lên đầu trang" */
.footer-bttop .bttop a, .bttop a {
  background: var(--hp-accent) !important;
  color: #fff !important;
}
/* ==========================================================================
   12b. ĐƯỜNG DẪN ĐIỀU HƯỚNG (breadcrumb) - các trang con
   ========================================================================== */
.breadcrumbs li a {
  background: var(--hp-primary-light) !important;
  color: var(--hp-primary) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
}
.breadcrumbs li a:after { border-left-color: var(--hp-primary-light) !important; }
.breadcrumbs li a:hover { background: var(--hp-primary) !important; color: #fff !important; }
.breadcrumbs li a:hover:after { border-left-color: var(--hp-primary) !important; }
.breadcrumbs li.active a,
.breadcrumbs li:last-child a { background: var(--hp-primary) !important; color: #fff !important; }
.breadcrumbs li.active a:after,
.breadcrumbs li:last-child a:after { border-left-color: var(--hp-primary) !important; }
/* ==========================================================================
   12c. TRANG CHI TIẾT TIN / VĂN BẢN
   ========================================================================== */
h1.title {
  font-size: 26px !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
  color: var(--hp-ink) !important;
}
.bodytext {
  font-size: 16.5px !important;
  line-height: 1.8 !important;
  color: #26313F !important;
}
.bodytext p { margin-bottom: 14px !important; }
.bodytext a {
  color: var(--hp-primary) !important;
  font-size: inherit !important;
  font-weight: 600 !important;
}
.bodytext img {
  border-radius: var(--hp-radius-sm) !important;
  max-width: 100% !important;
  height: auto !important;
}
.bodytext table { max-width: 100% !important; }
/* ==========================================================================
   12d. KHỐI "THỐNG KÊ TRUY CẬP" - CHỮ SỐ KIỂU KỸ THUẬT SỐ
   Cấu trúc HTML gốc:
     <div class="counter hitcounter">
       <p><b>Hôm nay</b></p>          <div class="hitngay">1,730</div>
       <p><b>Tổng lượt truy cập</b></p><div class="hittatca">589,531</div>
     </div>
   Font: Orbitron (chữ số vuông vức, hiện đại).
   Dự phòng: 'Digital-7 Mono' - font 7 đoạn CÓ SẴN trên máy chủ của trang
   (theme đã khai báo @font-face nhưng chưa dùng), nên kể cả khi không tải
   được Google Fonts thì chữ số vẫn ra kiểu điện tử.
   Đã kiểm tra: hiển thị vừa khung tới 8 chữ số (12,345,678).
   ========================================================================== */
.hitcounter { text-align: center !important; }
.hitcounter p { margin: 0 0 8px !important; }
.hitcounter p b {
  font-family: 'Be Vietnam Pro', 'Inter', 'Segoe UI', Roboto, Arial, sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--hp-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: .5px !important;
}

/* Bảng số: nền xanh rất nhạt + các vạch dọc mảnh tạo cảm giác bảng điện tử,
   viền trái đỏ làm điểm nhấn, viền trong sáng ở mép trên cho có chiều sâu. */
.hitcounter .hitngay,
.hitcounter .hittatca {
  font-family: 'Orbitron', 'Digital-7 Mono', 'Be Vietnam Pro', sans-serif !important;
  font-weight: 800 !important;
  font-variant-numeric: tabular-nums !important;   /* mọi chữ số cùng bề rộng */
  text-align: center !important;
  line-height: 1.15 !important;
  letter-spacing: 1px !important;
  margin: 0 0 16px !important;
  padding: 12px 8px !important;
  border-radius: var(--hp-radius-sm) !important;
  background-color: #EFF5FD !important;
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.9), rgba(233,241,251,.6)),
    repeating-linear-gradient(90deg, rgba(11,79,158,.07) 0 1px, transparent 1px 14px) !important;
  border: 1px solid #CFDDF0 !important;
  border-left: 4px solid var(--hp-accent) !important;
  box-shadow: inset 0 1px 0 #fff !important;
  overflow: hidden !important;
}
.hitcounter .hitngay  { font-size: 26px !important; color: var(--hp-primary) !important; }
.hitcounter .hittatca { font-size: 32px !important; color: var(--hp-accent) !important; margin-bottom: 0 !important; }

@media (max-width: 380px) {
  .hitcounter .hitngay  { font-size: 22px !important; }
  .hitcounter .hittatca { font-size: 27px !important; }
}
/* ==========================================================================
   13. KHẢ NĂNG TIẾP CẬN (người dùng bàn phím, người khiếm thị)
   ========================================================================== */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--hp-gold) !important;
  outline-offset: 2px !important;
  border-radius: 4px !important;
}
/* ==========================================================================
   14. MÀN HÌNH NHỎ (điện thoại, máy tính bảng)
   ========================================================================== */
@media (max-width: 767px) {
  body { font-size: 15.5px !important; }
  .panel-heading span { font-size: 15px !important; padding: 12px 14px 10px !important; }
  .panel-body { padding: 14px !important; }
  .panel, .news_column .panel { margin-bottom: 16px !important; }
  #menusite ul.slimmenucs > li > a {
    border-radius: 0 !important;
    padding: 12px 14px !important;
    border-bottom: 1px solid rgba(255,255,255,.12) !important;
  }
  .kttt-search { padding: 12px !important; }
  footer#footer { padding: 24px 12px !important; font-size: 14.5px !important; }
}
/* ==========================================================================
   15. TÙY CHỌN - ĐANG TẮT
   Chuẩn hoá ảnh trong thẻ tin về cùng tỷ lệ 16:9 cho đều nhau.
   Ưu điểm: trang gọn hơn hẳn. Nhược điểm: có thể cắt bớt ảnh dọc.
   >>> Muốn bật: xoá dòng bắt đầu bằng   (*   và dòng   *)   ở dưới.
   ========================================================================== */
/*
.news_column .panel-body img,
.two_column .panel-body img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  object-fit: cover !important;
  float: none !important;
  margin: 0 0 10px 0 !important;
}
*/

#body .unit-logo {
  display: block !important;
  margin: 0 0 22px !important;      /* bằng khoảng cách giữa các thẻ tin */
  line-height: 0 !important;        /* khử khe hở dưới ảnh do inline gây ra */
  text-align: center !important;
}
#body .unit-logo img {
  display: block !important;        /* trước đây là inline -> hở chân ảnh */
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 auto !important;
  background: #fff !important;
  border: 1px solid var(--hp-border, #DCE3ED) !important;
  border-radius: var(--hp-radius, 10px) !important;
  box-shadow: var(--hp-shadow, 0 1px 2px rgba(16,32,64,.06), 0 6px 18px rgba(16,32,64,.07)) !important;
}
/* Nếu sau này chèn một logo NHỎ (không phải băng-rôn ngang), dòng
   width:100% sẽ kéo giãn làm vỡ nét. Khi đó đổi thành:  width: auto !important;
   ảnh sẽ giữ đúng kích thước gốc và tự canh giữa. */
/* ==========================================================================
   17. ẢNH TIN NỔI BẬT TRONG SLIDER TRANG CHỦ
   ========================================================================== */
.item_s img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  border-radius: var(--hp-radius, 10px) !important;
}
/* ==========================================================================
   18. ẢNH THU NHỎ DANH SÁCH "TIN MỚI / TIN XEM NHIỀU"
   ========================================================================== */
.list_news .img-thumbnail,
.img-thumbnail {
  border-radius: 6px !important;
  border: 1px solid var(--hp-border, #DCE3ED) !important;
  padding: 0 !important;
  background: #fff !important;
}
/* ==========================================================================
   19. ẢNH BANNER LIÊN KẾT CỘT PHẢI - bo góc ảnh khớp với khung ngoài
   ========================================================================== */
.nv-block-banners img {
  border-radius: 7px !important;
}
/* ==========================================================================
   20. KHUNG VIDEO - bo góc cho khớp với thẻ chứa nó
   ========================================================================== */
.video-content .jwplayer,
.video-content video,
.videoplayer_bl {
  border-radius: var(--hp-radius, 10px) !important;
  overflow: hidden !important;
}
/* ==========================================================================
   21. KHỐI TIN ĐƯỢC QUAN TÂM - bố cục 2 cột, căn đều lề
   ========================================================================== */
.block_tophits {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.block_tophits > li {
  display: flex !important;              /* thay cho float -> hết chạy vòng chữ */
  align-items: flex-start !important;
  gap: 10px !important;
  margin: 0 !important;
  padding: 11px 8px !important;
}

/* Cột ảnh: rộng cố định 64px, mọi ảnh cùng khuôn 64x46 */
.block_tophits > li > a:first-child {
  flex: 0 0 64px !important;
  display: block !important;
  line-height: 0 !important;
}
.block_tophits img.img-thumbnail {
  float: none !important;                /* huỷ class pull-left của theme */
  margin: 0 !important;                  /* huỷ class mr-1 của theme */
  width: 64px !important;
  height: 46px !important;
  object-fit: cover !important;          /* ảnh ngang/dọc đều vừa khuôn, không méo */
  padding: 0 !important;
  background: #fff !important;
  border: 1px solid var(--hp-border, #DCE3ED) !important;
  border-radius: 5px !important;
}

/* Cột chữ: chiếm phần còn lại, giới hạn 3 dòng cho các hàng đều nhau */
.block_tophits > li > a.show {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  font-size: 13.5px !important;
  line-height: 1.45 !important;
  font-weight: 600 !important;
  color: var(--hp-ink, #1B2733) !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;      /* muốn hiện nhiều hơn: đổi thành 4 */
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
.block_tophits > li:hover > a.show { color: var(--hp-primary, #0B4F9E) !important; }
/* ==========================================================================
   22. PHÂN CÁCH GIỮA CÁC TIN - KIỂU A: ĐƯỜNG KẺ  (đang bật)
   ========================================================================== */
.block_tophits > li {
  border-bottom: 1px solid var(--hp-border, #DCE3ED) !important;
}
.block_tophits > li:last-child { border-bottom: 0 !important; }
.block_tophits > li:hover { background: var(--hp-primary-light, #E9F1FB) !important; }
/* ==========================================================================
   23. PHÂN CÁCH GIỮA CÁC TIN - KIỂU B: NỀN XEN KẼ  (đang tắt)
   Muốn dùng kiểu B: xoá nguyên MỤC 22 ở trên, rồi bỏ dấu chú thích
   (dòng bắt đầu bằng   (*   và dòng   *)  ) của khối dưới đây.
   ========================================================================== */

.block_tophits > li {
  border-bottom: 0 !important;
  border-radius: 8px !important;
}
.block_tophits > li:nth-child(odd)  { background: #F2F7FD !important; }
.block_tophits > li:hover           { background: var(--hp-primary-light, #E9F1FB) !important; }


/* ===================== HẾT PHẦN BỔ SUNG 1.4 ============================== */