/* 
 * Deprecated DNN CSS class names will remain available for some time
 * before being  permanently removed. Removal will occur according to
 * the  following process:
 *
 * 1. Removal will only occur with a major (x.y) release, never
 *    with a maintenance (x.y.z) release.
 * 2. Removal will not occur less than six months after the release
 *    when it was deprecated.
 * 3. Removal will not occur until after deprecation has been noted 
 *    in at least two major releases.
 *
 *                                              |        |Planned |
 *  Name                                        |Release |Removal |
 *----------------------------------------------+--------+--------+
 * Mod{NAME}C                                     5.6.2    6.2
 *   {NAME} = sanitized version of the DesktopModule Name 
 *   Used on <div> tag surrounding Module Content, inside container
 *----------------------------------------------+--------+--------+
 */

/* Đồng bộ font chữ cho toàn bộ trang */
body, 
h1, h2, h3, h4, h5, h6,
p, a, span, div, li, td, th {
  font-family: 'Roboto Condensed', Tahoma, Arial, sans-serif !important;
}
 
.branding-top {
	background: url(dnn_large_banner.png) no-repeat top left;
	width: 900px;
	height: 428px;
	clear: both;
	overflow: hidden;
}
.branding-top p {
	padding: 0px 60px 0 60px;
	font-size: 1.4em;
	color: #333;
}
.branding-bottom {
	clear: both;
	margin: 1em 0;
	overflow: hidden;
}
.branding-bottom ul {
	list-style: none;
	margin: 0;
	padding: 0;
	overflow: hidden;
	clear: both;
}
.commmunity, .marketplace, .conferences, .training {
	list-style: none;
	display: block;
	float: left;
  cursor: pointer;
}
.branding-bottom li.training {
	margin: 0;
}
.branding-bottom .feature-block {
	background: url(itembg.gif) repeat-y;
	margin: 33px 0 0 0;
}
.branding-bottom .feature-icon {
	margin: 0;
	height: 66px;
	margin-bottom: 1em;
}
.feature-text {
	margin: 0 10px 20px 10px;
	font-size: 115%;
	text-align: center;
    color: #3e81b5;
    height: 75px;
}
.branding-bottom li {
  margin: 0 20px 0 0;
  width: 210px;
}
.branding-bottom li.training {
  margin: 0;
}
.feature-block li {
  list-style: none;
}
.feature-icon {
  width: 180px;
 }
.branding-bottom .commmunity {
	background: url(community_title.gif) no-repeat top left;
}
.commmunity .feature-icon {
	background: url(community_icon.gif) no-repeat;
	background-position: 50% 10px;
}
.branding-bottom .marketplace {
	background: url(marketplace_title.gif) no-repeat top left;
}
.marketplace .feature-icon {
	background: url(marketplace_icon.gif) no-repeat;
	background-position: 50% 10px;
}
.branding-bottom .conferences {
	background: url(conferences_title.gif) no-repeat top left;
}
.conferences .feature-icon {
	background: url(conferences_icon.gif) no-repeat;
	background-position: 50% 10px;
}
.branding-bottom .training {
	background: url(training_title.gif) no-repeat top left;
}
.training .feature-icon {
	background: url(training_icon.gif) no-repeat;
	background-position: 50% 10px;
}
ul.bt {
	margin: 0 -1em;
	padding: 0;
	background: url(item_bt_bg.gif) no-repeat bottom;
	height: 32px;	
}
ul.bt li {
  margin: 0 1em;
  list-style-type: none;
}
.action-btn {
  height: 26px;
}
.engage-action {
	background: url(engage_btn.png) no-repeat bottom;
}
.shop-action {
	background: url(shop_btn.png) no-repeat bottom;
}
.connect-action {
	background: url(connect_btn.png) no-repeat bottom;
}
.learn-action {
	background: url(learn_btn.png) no-repeat bottom;
}
div.link_manuals {
	float:left;
	background: url(dnn_manuals.png) no-repeat top left;
	width: 316px;
	height: 137px;
	cursor: pointer;
}
div.link_proedition {
	float:right;
	background: url(dnn_proedition.png) no-repeat top left;
	width: 514px;
	height: 137px;
	cursor: pointer;
}
div.link_main {
	margin: 260px 30px 0px 30px;
}

#LoginInfo
{
	width:545px; 
	float:left;
}
#LoginInfo h3
{
	background-color: #f7f7f7;
	color: #8f0000;
	padding: 2px 0px;
}
#LoginInfo dd, #LoginInfo dt 
{
	display:inline;
}
#LoginInfo dt
{
	font-weight:bold;
	color: #333;
}
#LoginInfo p.LoginNotes
{
	font-size: .8em;
}
#LoginInfo div.LoginBlock {
	float: left;
	width: 255px;
	padding: 5px 5px;
	margin: 0px 2px;
	border: 1px #f0f0f0 solid;
}
.SponsorIcon
{
	margin: 5px 15px; 
	float: left;
}
#QuickLinks 
{
	background-color:#f0f0f0;
	border: 1px #cccccc solid;
	padding: 2px 5px;
	position:relative;
	width:330px;
}
#QuickLinks h2, #QuickLinks p
{
	margin: 5px 5px;
}
div.hr
{
	height: 2px;
	background-color: #8f0000;
	margin: 5px 0 15px 0;
	clear:both;
}
div.hr hr
{
	display: none;
}

#TelerikInside
{
	background: white url('telerikInside.jpg');
	border: 1px #cccccc solid;
	padding: 20px 5px 10px 130px;
	margin-bottom: 5px;
	width: 205px;
	height: 140px;
	border-style:none;
}

#TelerikInside h2
{
	font-weight: bold;
}

#RightColumnInfo
{
	float:right;
	width:340px;
	margin-left: 10px;
	margin-bottom: 15px;
}
#qlCol1, #qlCol2
{
	margin: 5px 5px 15px;
	padding-left: 12pt;
	float: left;
	position:relative;
}

/* ============================================
   REFACTOR 3 CỘT TIN TỨC TRANG CHỦ
   ============================================ */
/* Layout tổng: giữ 3 cột cân bằng chiều cao */
#dnn_hoatdongPane,
#dnn_thongtinPane,
#dnn_TbaoPane {
  display: flex !important;
  flex-direction: column !important;
  padding: 0 12px !important;
  padding-bottom: 40px !important;
}

/* Card bao ngoài mỗi cột */
#dnn_hoatdongPane .ModNewsListC,
#dnn_thongtinPane .ModNewsListC,
#dnn_TbaoPane .ModNewsListC {
  background: #fff !important;
  border-radius: 14px !important;
  box-shadow: 0 3px 16px rgba(0,0,0,0.08) !important;
  padding: 24px 20px 16px 20px !important;
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
  transition: box-shadow 0.3s ease !important;
  position: relative !important;
  overflow: hidden !important;
}

#dnn_hoatdongPane .ModNewsListC:hover,
#dnn_thongtinPane .ModNewsListC:hover,
#dnn_TbaoPane .ModNewsListC:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,0.13) !important;
}

/* Dải màu nhấn trên đầu mỗi card - phân biệt 3 chuyên mục */
#dnn_hoatdongPane .ModNewsListC::before,
#dnn_thongtinPane .ModNewsListC::before,
#dnn_TbaoPane .ModNewsListC::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 5px !important;
}

#dnn_hoatdongPane .ModNewsListC::before { background: #2e86c1 !important; }
#dnn_thongtinPane .ModNewsListC::before { background: #f5820d !important; }
#dnn_TbaoPane .ModNewsListC::before { background: #27ae60 !important; }

/* Tiêu đề cột (nằm trong module Text/HTML riêng phía trên) */
#dnn_hoatdongPane h1, #dnn_hoatdongPane h2, #dnn_hoatdongPane h3,
#dnn_thongtinPane h1, #dnn_thongtinPane h2, #dnn_thongtinPane h3,
#dnn_TbaoPane h1, #dnn_TbaoPane h2, #dnn_TbaoPane h3 {
  text-align: center !important;
  font-weight: 700 !important;
  padding-bottom: 12px !important;
  margin-bottom: 4px !important;
  position: relative !important;
}

/* Đồng bộ 1 màu cho cả 3 cột - đổi #2e86c1 thành màu bạn muốn */
#dnn_hoatdongPane .ModNewsListC::before,
#dnn_thongtinPane .ModNewsListC::before,
#dnn_TbaoPane .ModNewsListC::before {
  background: #2e86c1 !important;
}

#dnn_hoatdongPane h1::after, #dnn_hoatdongPane h2::after, #dnn_hoatdongPane h3::after,
#dnn_thongtinPane h1::after, #dnn_thongtinPane h2::after, #dnn_thongtinPane h3::after,
#dnn_TbaoPane h1::after, #dnn_TbaoPane h2::after, #dnn_TbaoPane h3::after {
  background: #2e86c1 !important;
}

#dnn_hoatdongPane .list_lct li::before,
#dnn_thongtinPane .list_lct li::before,
#dnn_TbaoPane .list_lct li::before {
  background: #2e86c1 !important;
}

#dnn_hoatdongPane div[align="center"] b,
#dnn_thongtinPane div[align="center"] b,
#dnn_TbaoPane div[align="center"] b {
  background: #2e86c1 !important;
  color: #fff !important;
}

/* Đảm bảo phân trang luôn thẳng hàng - danh sách tin chiếm hết khoảng trống thừa */
#dnn_hoatdongPane .list_lct,
#dnn_thongtinPane .list_lct,
#dnn_TbaoPane .list_lct {
  flex: 1 1 auto !important;
}

/* Danh sách tin: bỏ bullet mặc định, thêm khoảng cách + đường kẻ phân cách */
#dnn_hoatdongPane .list_lct,
#dnn_thongtinPane .list_lct,
#dnn_TbaoPane .list_lct {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  flex: 1 1 auto !important;
}

#dnn_hoatdongPane .list_lct li,
#dnn_thongtinPane .list_lct li,
#dnn_TbaoPane .list_lct li {
  padding: 12px 0 !important;
  border-bottom: 1px dashed #e5e5e5 !important;
  min-height: 48px !important;
  position: relative !important;
  padding-left: 20px !important;
}

#dnn_hoatdongPane .list_lct li:last-child,
#dnn_thongtinPane .list_lct li:last-child,
#dnn_TbaoPane .list_lct li:last-child {
  border-bottom: none !important;
}

/* Bullet chấm tròn nhỏ thay icon mũi tên */
#dnn_hoatdongPane .list_lct li::before,
#dnn_thongtinPane .list_lct li::before,
#dnn_TbaoPane .list_lct li::before {
  content: none !important;
}

#dnn_hoatdongPane .list_lct li,
#dnn_thongtinPane .list_lct li,
#dnn_TbaoPane .list_lct li {
  padding-left: 0 !important;
}

#dnn_hoatdongPane .list_lct li::before { background: #2e86c1 !important; }
#dnn_thongtinPane .list_lct li::before { background: #f5820d !important; }
#dnn_TbaoPane .list_lct li::before { background: #27ae60 !important; }

/* Link tiêu đề tin: font, màu, hover */
#dnn_hoatdongPane .title_right,
#dnn_thongtinPane .title_right,
#dnn_TbaoPane .title_right {
  height: auto !important;
  display: block !important;
  color: #333 !important;
  line-height: 1.5 !important;
  font-size: 14.5px !important;
  transition: color 0.2s ease !important;
}

#dnn_hoatdongPane .list_lct li:hover .title_right,
#dnn_thongtinPane .list_lct li:hover .title_right,
#dnn_TbaoPane .list_lct li:hover .title_right {
  color: #f5820d !important;
}

/* Phân trang: dạng pill bo tròn */
#dnn_hoatdongPane div[align="center"],
#dnn_thongtinPane div[align="center"],
#dnn_TbaoPane div[align="center"] {
  margin-top: auto !important;
  padding-top: 12px !important;
  border-top: 1px solid #f0f0f0 !important;
}

#dnn_hoatdongPane div[align="center"] div,
#dnn_thongtinPane div[align="center"] div,
#dnn_TbaoPane div[align="center"] div {
  white-space: nowrap !important;
  overflow-x: auto !important;
}

#dnn_hoatdongPane div[align="center"] a,
#dnn_hoatdongPane div[align="center"] b,
#dnn_thongtinPane div[align="center"] a,
#dnn_thongtinPane div[align="center"] b,
#dnn_TbaoPane div[align="center"] a,
#dnn_TbaoPane div[align="center"] b {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 26px !important;
  height: 26px !important;
  margin: 0 2px !important;
  padding: 0 6px !important;
  border-radius: 50px !important;
  font-size: 12.5px !important;
  text-decoration: none !important;
  color: #666 !important;
  transition: all 0.2s ease !important;
}

#dnn_hoatdongPane div[align="center"] a:hover,
#dnn_thongtinPane div[align="center"] a:hover,
#dnn_TbaoPane div[align="center"] a:hover {
  background: #f0f0f0 !important;
}

#dnn_hoatdongPane div[align="center"] b { background: #2e86c1 !important; color: #fff !important; }
#dnn_thongtinPane div[align="center"] b { background: #2e86c1 !important; color: #fff !important; }
#dnn_TbaoPane div[align="center"] b { background: #2e86c1 !important; color: #fff !important; }

/* Nối chuỗi height 100% từ pane xuống tới nội dung, để .ModNewsListC thực sự giãn hết cỡ */
#dnn_hoatdongPane .DNNContainer_noTitle,
#dnn_thongtinPane .DNNContainer_noTitle,
#dnn_TbaoPane .DNNContainer_noTitle,
#dnn_hoatdongPane [id$="_ContentPane"],
#dnn_thongtinPane [id$="_ContentPane"],
#dnn_TbaoPane [id$="_ContentPane"],
#dnn_hoatdongPane [id$="_ModuleContent"],
#dnn_thongtinPane [id$="_ModuleContent"],
#dnn_TbaoPane [id$="_ModuleContent"] {
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}
/* ============================================
   KẾT THÚC REFACTOR 3 CỘT TIN TỨC TRANG CHỦ
   ============================================ */


/* ============================================
   KHU VỰC "MỘT SỐ KỸ THUẬT NỔI BẬT" / "HƯỚNG ĐẾN NGƯỜI BỆNH"
   BẢN REFACTOR HOÀN CHỈNH CUỐI CÙNG
   ============================================ */

/* 0. Section bao ngoài: giữ ảnh nền gốc, chỉ bo góc + tạo khoảng đệm */
section.green_bg {
  border-radius: 20px !important;
  padding: 36px 24px !important;
  margin: 0 20px 35px 20px !important;
  overflow: hidden !important;
}

/* 1. Khoảng cách giữa 2 cột */
#dnn_DVnoibatPane { padding-right: 10px !important; }
#dnn_HDPane { padding-left: 10px !important; }

/* 2. Cân bằng khung 2 cột ở cấp ngoài cùng (không ép giãn nội dung bên trong) */
.row > #dnn_DVnoibatPane,
.row > #dnn_HDPane {
  display: flex !important;
  flex-direction: column !important;
}

/* 3. Tiêu đề: chữ trắng, gạch chân vàng nhấn */
#dnn_DVnoibatPane .DnnModule-DNN_HTML,
#dnn_HDPane .DnnModule-DNN_HTML {
  text-align: center !important;
  margin-bottom: 16px !important;
}

#dnn_DVnoibatPane .DnnModule-DNN_HTML h1,
#dnn_DVnoibatPane .DnnModule-DNN_HTML h2,
#dnn_DVnoibatPane .DnnModule-DNN_HTML h3,
#dnn_HDPane .DnnModule-DNN_HTML h1,
#dnn_HDPane .DnnModule-DNN_HTML h2,
#dnn_HDPane .DnnModule-DNN_HTML h3 {
  color: #fff !important;
  letter-spacing: 0.5px !important;
  margin: 0 !important;
  position: relative !important;
}

/* Gạch chân dưới tiêu đề bài*/
#dnn_DVnoibatPane .DnnModule-DNN_HTML h1::after,
#dnn_DVnoibatPane .DnnModule-DNN_HTML h2::after,
#dnn_DVnoibatPane .DnnModule-DNN_HTML h3::after,
#dnn_HDPane .DnnModule-DNN_HTML h1::after,
#dnn_HDPane .DnnModule-DNN_HTML h2::after,
#dnn_HDPane .DnnModule-DNN_HTML h3::after {
  content: "" !important;
  display: block !important;
  width: 60px !important;
  height: 3px !important;
  background: #139cd0 !important;
  border-radius: 2px !important;
  margin: 8px auto 0 !important;
}

/* 4. Card: nền trắng, bo góc trên, không ép giãn cứng - tự nhiên theo nội dung */
#dnn_DVnoibatPane .cate_list_news_green,
#dnn_HDPane .cate_list_news_green {
  background: #fff !important;
  border-radius: 16px 16px 0 0 !important;
  overflow: hidden !important;
  display: block !important;
  padding-bottom: 16px !important;
  box-shadow: none !important;
}

/* 5. Ảnh: chiều cao cố định, cắt gọn, overlay + zoom hover */
#dnn_DVnoibatPane .cate_list_news_green > a:first-child,
#dnn_HDPane .cate_list_news_green > a:first-child {
  display: block !important;
  overflow: hidden !important;
  position: relative !important;
}

#dnn_DVnoibatPane .cate_list_news_green > a:first-child img,
#dnn_HDPane .cate_list_news_green > a:first-child img {
  width: 100% !important;
  height: 300px !important;
  object-fit: cover !important;
  object-position: center !important;
  transition: transform 0.4s ease !important;
}

#dnn_DVnoibatPane .cate_list_news_green > a:first-child:hover img,
#dnn_HDPane .cate_list_news_green > a:first-child:hover img {
  transform: scale(1.06) !important;
}

#dnn_DVnoibatPane .cate_list_news_green > a:first-child::after,
#dnn_HDPane .cate_list_news_green > a:first-child::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 60px !important;
  background: linear-gradient(to top, rgba(0,0,0,0.30), transparent) !important;
  pointer-events: none !important;
}

/* 6. Tiêu đề tin (trong <p>): ẩn ảnh spacer, style link */
#dnn_DVnoibatPane .cate_list_news_green p img,
#dnn_HDPane .cate_list_news_green p img {
  display: none !important;
}

#dnn_DVnoibatPane .cate_list_news_green p,
#dnn_HDPane .cate_list_news_green p {
  padding: 16px 20px 0 20px !important;
  margin: 0 !important;
  text-align: left !important;
}

#dnn_DVnoibatPane .title_right,
#dnn_HDPane .title_right {
  height: auto !important;
  display: inline-block !important;
  line-height: 1.4 !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #222 !important;
}

/* 7. Mô tả: khoảng cách vừa phải, không ép giãn full */
#dnn_DVnoibatPane .NewsDescription_green,
#dnn_HDPane .NewsDescription_green {
  padding: 8px 20px 0 20px !important;
  margin: 0 !important;
  text-align: left !important;
  line-height: 1.5 !important;
  font-size: 13.5px !important;
  color: #666 !important;
}

/* 8. Khối chứa nút: bo góc dưới, khoảng cách cố định vừa phải với nội dung phía trên */
#dnn_DVnoibatPane center,
#dnn_HDPane center {
  display: block !important;
  text-align: left !important;
  padding: 20px 20px 20px 20px !important;
  background: #fff !important;
  border-radius: 0 0 16px 16px !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.15) !important;
}

/* 9. Nút "chi tiết": icon mũi tên, hover nâng lên */
#dnn_DVnoibatPane a.event-read,
#dnn_HDPane a.event-read {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: auto !important;
  max-width: none !important;
  padding: 9px 20px !important;
  text-align: center !important;
  border-radius: 18px !important;
  font-weight: 500 !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
}

#dnn_DVnoibatPane a.event-read:hover,
#dnn_HDPane a.event-read:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 6px 14px rgba(245,130,13,0.35) !important;
}

#dnn_DVnoibatPane .list_lct,
#dnn_HDPane .list_lct {
  padding: 16px 20px !important;
  margin: 0 !important;
}

/*Tiêu đề  card*/
#dnn_DVnoibatPane .DnnModule-DNN_HTML span,
#dnn_HDPane .DnnModule-DNN_HTML span {
  color: #337ab7 !important;
}

/* ===== 1. Khung banner: bo góc, đổ bóng, cắt phần tràn ra ngoài ===== */
#dnn_ctr796_HtmlModule_lblContent {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.18);
   margin-bottom: 30px; /* thêm dòng này để tạo khoảng cách */
}

/* ===== 2. Ảnh banner: responsive, zoom nhẹ liên tục + hiệu ứng xuất hiện ===== */
#dnn_ctr796_HtmlModule_lblContent img {
  width: 100% !important;
  height: auto !important;
  display: block;
  animation: banner796-kenburns 14s ease-in-out infinite alternate,
  banner796-fadeIn 0.8s ease-out;
  transition: transform 0.5s ease;
}

/* Zoom nhẹ thêm khi rê chuột vào */
#dnn_ctr796_HtmlModule_lblContent:hover img {
  transform: scale(1.04);
}

@keyframes banner796-kenburns {
  0%   { transform: scale(1); }
  100% { transform: scale(1.07); }
}

@keyframes banner796-fadeIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ===== 3. Hiệu ứng ánh sáng quét nhẹ qua banner (shimmer) ===== */
#dnn_ctr796_HtmlModule_lblContent::after {
  content: "";
  position: absolute;
  top: 0;
  left: -60%;
  width: 40%;
  height: 100%;
  background: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.35) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  transform: skewX(-20deg);
  animation: banner796-shimmer 6s ease-in-out infinite;
  pointer-events: none; /* không chặn click vào ảnh/link */
}

@keyframes banner796-shimmer {
  0%   { left: -60%; }
  35%  { left: 130%; }
  100% { left: 130%; } /* dừng lại rồi lặp, tránh quét liên tục gây rối mắt */
}

/* ===== 4. Ẩn 2 dòng &nbsp; rỗng gây khoảng trắng thừa ===== */
#dnn_ctr796_HtmlModule_lblContent p:not(:first-child) {
  display: none;
}
/* ================================================================
   KẾT THÚC KHU VỰC "MỘT SỐ KỸ THUẬT NỔI BẬT" / "HƯỚNG ĐẾN NGƯỜI BỆNH"
   ================================================================ */

/* ============================================
   KHỐI "BẢNG GIÁ / PHẢN HỒI / GIÁO DỤC SỨC KHỎE"
   ============================================ */

#dnn_Banggiapane,
#dnn_PhanhoiPane,
#dnn_GDSKPane {
  padding-left: 2px !important;
  padding-right: 12px !important;
}

/* Tiêu đề: bỏ ::after cũ, đổi sang khung viền dạng ngoặc cong */
#dnn_Banggiapane .NewsListTitle,
#dnn_PhanhoiPane .NewsListTitle,
#dnn_GDSKPane .NewsListTitle {
  display: inline-block !important;
  text-align: center !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #2e86c1 !important;
  margin: 0 auto 24px auto !important;
  padding: 0 28px 10px 28px !important;
  border: none !important;
  border-left: 2px solid #337ab7 !important;
  border-right: 2px solid #337ab7 !important;
  border-bottom: 2px solid #337ab7 !important;
  border-radius: 0 0 24px 24px !important;
  width: auto !important;
  position: static !important;
}

/* Căn giữa khối tiêu đề trong cột (vì giờ là inline-block, cần parent canh giữa) */
#dnn_Banggiapane .DNNModuleContent,
#dnn_PhanhoiPane .DNNModuleContent,
#dnn_GDSKPane .DNNModuleContent {
  text-align: center !important;
}

/* Xóa hẳn thanh gạch chân ::after cũ, không dùng nữa */
#dnn_Banggiapane .NewsListTitle::after,
#dnn_PhanhoiPane .NewsListTitle::after,
#dnn_GDSKPane .NewsListTitle::after {
  content: none !important;
}


/* ============ CỘT "BẢNG GIÁ" & "PHẢN HỒI" (dạng card) ============ */

#dnn_Banggiapane .cate_list_news,
#dnn_PhanhoiPane .cate_list_news {
  background: #fff !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.08) !important;
  transition: box-shadow 0.3s ease, transform 0.3s ease !important;
  padding-bottom: 16px !important;
}

#dnn_Banggiapane .cate_list_news:hover,
#dnn_PhanhoiPane .cate_list_news:hover {
  box-shadow: 0 10px 26px rgba(0,0,0,0.15) !important;
  transform: translateY(-4px) !important;
}

#dnn_Banggiapane .cate_list_news > a:first-child,
#dnn_PhanhoiPane .cate_list_news > a:first-child {
  display: block !important;
  overflow: hidden !important;
}

#dnn_Banggiapane .cate_list_news > a:first-child img,
#dnn_PhanhoiPane .cate_list_news > a:first-child img {
  width: 100% !important;
  height: 200px !important;
  object-fit: cover !important;
  object-position: center !important;
  transition: transform 0.4s ease !important;
}

#dnn_Banggiapane .cate_list_news > a:first-child:hover img,
#dnn_PhanhoiPane .cate_list_news > a:first-child:hover img {
  transform: scale(1.06) !important;
}

#dnn_Banggiapane .cate_list_news p img,
#dnn_PhanhoiPane .cate_list_news p img {
  display: none !important;
}

#dnn_Banggiapane .cate_list_news p,
#dnn_PhanhoiPane .cate_list_news p {
  padding: 16px 18px 0 18px !important;
  margin: 0 !important;
}

#dnn_Banggiapane .title_right,
#dnn_PhanhoiPane .title_right {
  height: auto !important;
  display: block !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  color: #222 !important;
  line-height: 1.4 !important;
}

#dnn_Banggiapane .NewsDescription,
#dnn_PhanhoiPane .NewsDescription {
  padding: 8px 18px 0 18px !important;
  margin: 0 !important;
  font-size: 13.5px !important;
  color: #666 !important;
  line-height: 1.5 !important;
}

#dnn_Banggiapane center,
#dnn_PhanhoiPane center {
  padding: 18px !important;
}

#dnn_Banggiapane a.event-read,
#dnn_PhanhoiPane a.event-read {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 9px 20px !important;
  border-radius: 18px !important;
  font-weight: 500 !important;
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
}

#dnn_Banggiapane a.event-read:hover,
#dnn_PhanhoiPane a.event-read:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 6px 14px rgba(245,130,13,0.35) !important;
}

/* ============ CỘT "GIÁO DỤC SỨC KHỎE" (dạng danh sách + thumbnail) ============ */

#dnn_GDSKPane #dnn_ctr504_ModuleContent {
  padding: 0 !important;
}

#dnn_GDSKPane .title_img_NewsItem {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  background: #fff !important;
  border-radius: 14px !important;
  padding: 12px 14px !important;
  margin-bottom: 2px !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.08) !important;
  transition: box-shadow 0.3s ease, transform 0.3s ease !important;
}

#dnn_GDSKPane .title_img_NewsItem:hover {
  box-shadow: 0 10px 26px rgba(0,0,0,0.15) !important;
  transform: translateY(-4px) !important;
}

#dnn_GDSKPane .title_img_NewsItem:last-of-type {
  margin-bottom: 0 !important;
}

#dnn_GDSKPane .title_img_NewsImage {
  flex-shrink: 0 !important;
  width: 72px !important;
  height: 72px !important;
  border-radius: 10px !important;
  overflow: hidden !important;
}

#dnn_GDSKPane .title_img_NewsImage img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  transition: transform 0.4s ease !important;
}

#dnn_GDSKPane .title_img_NewsItem:hover .title_img_NewsImage img {
  transform: scale(1.06) !important;
}

#dnn_GDSKPane .title_img_NewsHeadline {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #222 !important;
  line-height: 1.45 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

#dnn_GDSKPane .title_img_NewsHeadline a {
  color: inherit !important;
  text-decoration: none !important;
}

/* =======================================================
   KẾT THÚC KHỐI "BẢNG GIÁ / PHẢN HỒI / GIÁO DỤC SỨC KHỎE"
   ======================================================*/

/* ============================================
   KHỐI "CHUYỂN ĐỔI SỐ / ĐƯỜNG DÂY NÓNG / ĐĂNG KÝ KCB"
   BẢN NÂNG CẤP - đồng bộ hệ thống spacing + hiệu ứng
   ============================================ */

/* 1. Khoảng cách giữa 3 cột - đồng nhất */
#dnn_Lketpane1 { padding-right: 14px !important; }
#dnn_Lketpane2 { padding: 0 14px !important; }
#dnn_Lketpane3 { padding-left: 14px !important; }

/* 2. Card nền trắng, dải màu nhấn trên đầu (đồng bộ khối tin tức) */
#dnn_Lketpane1 .DNNModuleContent,
#dnn_Lketpane2 .DNNModuleContent,
#dnn_Lketpane3 .DNNModuleContent {
  background: #fff !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 18px rgba(0,0,0,0.07) !important;
  padding: 28px 20px 20px 20px !important;
  position: relative !important;
  overflow: hidden !important;
  transition: box-shadow 0.3s ease !important;
}

#dnn_Lketpane1 .DNNModuleContent:hover,
#dnn_Lketpane2 .DNNModuleContent:hover,
#dnn_Lketpane3 .DNNModuleContent:hover {
  box-shadow: 0 10px 28px rgba(0,0,0,0.12) !important;
}

#dnn_Lketpane1 .DNNModuleContent::before,
#dnn_Lketpane2 .DNNModuleContent::before,
#dnn_Lketpane3 .DNNModuleContent::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 5px !important;
  background: linear-gradient(90deg, #2e86c1, #5dade2) !important;
}

/* 3. Tiêu đề: đồng bộ font, gạch chân, khoảng cách nhất quán */
#dnn_Lketpane1 h3 span,
#dnn_Lketpane2 h3 span,
#dnn_Lketpane3 h3 span {
  color: #337ab7 !important;
  font-family: 'Roboto Condensed', Tahoma, sans-serif !important;
  font-weight: 700 !important;
  font-size: 22px !important;
  letter-spacing: 0.3px !important;
  margin: 28px 0 18px 0 !important;
  padding-bottom: 10px !important;
  position: relative !important;
}

#dnn_Lketpane1 h3:first-of-type,
#dnn_Lketpane2 h3:first-of-type,
#dnn_Lketpane3 h3:first-of-type {
  margin-top: 0 !important;
}

#dnn_Lketpane1 h3::after,
#dnn_Lketpane2 h3::after,
#dnn_Lketpane3 h3::after {
  content: "" !important;
  display: block !important;
  width: 40px !important;
  height: 3px !important;
  border-radius: 2px !important;
  background: #f5820d !important;
  margin: 10px auto 0 !important;
}

/* 4. Ảnh: bo góc, viền mỏng, khoảng cách đều, hiệu ứng glow + nâng khi hover */
#dnn_Lketpane1 p,
#dnn_Lketpane2 p,
#dnn_Lketpane3 p {
  margin: 0 0 20px 0 !important;
}

#dnn_Lketpane1 p:last-of-type,
#dnn_Lketpane2 p:last-of-type,
#dnn_Lketpane3 p:last-of-type {
  margin-bottom: 0 !important;
}

#dnn_Lketpane1 p a,
#dnn_Lketpane2 p a,
#dnn_Lketpane3 p a {
  display: block !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  position: relative !important;
}

#dnn_Lketpane1 p img,
#dnn_Lketpane2 p img,
#dnn_Lketpane3 p img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  border-radius: 12px !important;
  border: 1px solid #eef0f2 !important;
  box-shadow: 0 3px 10px rgba(0,0,0,0.08) !important;
  transition: transform 0.35s ease, box-shadow 0.35s ease, filter 0.35s ease !important;
  display: block !important;
  margin: 0 auto !important;
  cursor: pointer !important;
}

#dnn_Lketpane1 p a:hover img,
#dnn_Lketpane2 p a:hover img,
#dnn_Lketpane3 p a:hover img {
  transform: translateY(-6px) scale(1.02) !important;
  box-shadow: 0 14px 28px rgba(46,134,193,0.25) !important;
  filter: brightness(1.03) !important;
}

/* Viền sáng nhẹ xuất hiện khi hover, tạo cảm giác "được chọn" */
#dnn_Lketpane1 p a::after,
#dnn_Lketpane2 p a::after,
#dnn_Lketpane3 p a::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: 12px !important;
  border: 2px solid transparent !important;
  transition: border-color 0.3s ease !important;
  pointer-events: none !important;
}

#dnn_Lketpane1 p a:hover::after,
#dnn_Lketpane2 p a:hover::after,
#dnn_Lketpane3 p a:hover::after {
  border-color: #2e86c1 !important;
}

/* Hover cho ảnh KHÔNG có link bao ngoài (trực tiếp trong <p>) */
#dnn_Lketpane1 p > img,
#dnn_Lketpane2 p > img,
#dnn_Lketpane3 p > img {
  transition: transform 0.35s ease, box-shadow 0.35s ease, filter 0.35s ease !important;
}

#dnn_Lketpane1 p:hover > img,
#dnn_Lketpane2 p:hover > img,
#dnn_Lketpane3 p:hover > img {
  transform: translateY(-6px) scale(1.02) !important;
  box-shadow: 0 14px 28px rgba(46,134,193,0.25) !important;
  filter: brightness(1.03) !important;
}

/* ============================================
   KẾT THÚC KHỐI "CHUYỂN ĐỔI SỐ / ĐƯỜNG DÂY NÓNG / ĐĂNG KÝ KCB"
   BẢN NÂNG CẤP - đồng bộ hệ thống spacing + hiệu ứng
   ============================================ */

/* =====================================================
   KHỐI "LIÊN KẾT CƠ QUAN, BAN NGÀNH" (module 768)
   ===================================================== */
 
/* Tiêu đề */
#dnn_ctr768_HtmlModule_lblContent span[style*="color"] {
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: #337ab7 !important;
  padding-bottom: 15px;
  padding-top: 25px;
}
 
/* Bỏ khoảng trắng thừa từ các dấu &nbsp; nối giữa các logo */
#dnn_ctr768_HtmlModule_lblContent p {
  font-size: 0;
}
 
/* Giới hạn chiều rộng khớp với khung .container của layout chính,
   tránh bị canh giữa lệch theo toàn màn hình */
#dnn_ctr768_HtmlModule_lblContent {
  max-width: 1190px !important;
  margin: 0 auto;
  padding: 0 10px;
  box-sizing: border-box;
}
 
/* Hàng logo: căn giữa đều, tự xuống dòng, cách đều nhau */
#dnn_ctr768_HtmlModule_lblContent p[style*="text-align:center"] {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  gap: 15px;
  margin: 15px 0;
}
 
/* Mỗi logo: bọc khung card trắng, bo góc, đổ bóng nhẹ */
#dnn_ctr768_HtmlModule_lblContent p[style*="text-align:center"] a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 250px;
  background: #fff;
  border-radius: 12px;
  padding: 12px 14px;
  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.08);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
 
#dnn_ctr768_HtmlModule_lblContent p[style*="text-align:center"] a:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.14);
}
 
/* Ảnh lấp đầy chiều rộng card, giữ tỉ lệ gốc */
#dnn_ctr768_HtmlModule_lblContent p[style*="text-align:center"] img {
  width: 100%;
  height: auto;
  max-height: 150px;
  object-fit: contain;
  display: block;
  font-size: 15px; /* khôi phục cỡ chữ cho alt text nếu ảnh lỗi */
}

/*=============================================================*/
/* =========================================================
   BREADCRUMB - trang tin chi tiết
   Scope: #dnn_BREADCRUMB_lblBreadCrumb (không dùng class chung)
   Dán vào DNN Custom CSS. Kiểm tra bằng Ctrl+Shift+R / tab ẩn danh.
   ========================================================= */

/* ---------- Biến màu: đổi 1 chỗ là đổi cả thanh ---------- */
#dnn_BREADCRUMB_lblBreadCrumb {
  --bc-main:   #0b6cb0;   /* xanh bệnh viện */
  --bc-dark:   #084c7d;
  --bc-soft:   #e8f2fa;   /* nền chip khi hover */
  --bc-text:   #4a5560;
  --bc-sep:    #a9b7c4;
}

/* ---------- Khung ngoài ---------- */
#dnn_BREADCRUMB_lblBreadCrumb {
  display: block !important;
  margin: 10px 0 14px !important;
  padding: 9px 16px !important;
  background: linear-gradient(90deg, #f4f9fd 0%, #ffffff 100%) !important;
  border: 1px solid #e1ebf3 !important;
  border-left: 4px solid var(--bc-main) !important;
  border-radius: 6px !important;
  box-shadow: 0 1px 3px rgba(11, 108, 176, .07) !important;
}

/* ---------- Danh sách: font-size:0 để ẩn các ký tự "&nbsp;>&nbsp;" cũ ---------- */
#dnn_BREADCRUMB_lblBreadCrumb > span[itemtype$="BreadcrumbList"] {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  font-size: 0 !important;
  line-height: 1 !important;
}

/* ---------- Từng mục ---------- */
#dnn_BREADCRUMB_lblBreadCrumb span[itemprop="itemListElement"] {
  display: inline-flex !important;
  align-items: center;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

/* Dấu phân cách chevron vẽ bằng CSS (thay cho ký tự ">") */
#dnn_BREADCRUMB_lblBreadCrumb span[itemprop="itemListElement"] + span[itemprop="itemListElement"]::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 12px 0 10px;
  border-top: 2px solid var(--bc-sep);
  border-right: 2px solid var(--bc-sep);
  transform: rotate(45deg);
  flex: none;
}

/* ---------- Link ---------- */
#dnn_BREADCRUMB_lblBreadCrumb span[itemprop="itemListElement"] a {
  color: var(--bc-text) !important;
  text-decoration: none !important;
  font-weight: 500;
  padding: 3px 8px;
  border-radius: 4px;
  transition: color .2s ease, background-color .2s ease;
}

#dnn_BREADCRUMB_lblBreadCrumb span[itemprop="itemListElement"] a:hover {
  color: var(--bc-main) !important;
  background-color: var(--bc-soft);
}

/* ---------- Mục đầu (Trang chủ): thêm icon ngôi nhà ---------- */
#dnn_BREADCRUMB_lblBreadCrumb span[itemprop="itemListElement"]:first-child a::before {
  content: "";
  display: inline-block;
  width: 15px;
  height: 15px;
  margin-right: 6px;
  vertical-align: -2px;
  background-color: var(--bc-main);
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 3 2 12h3v8h5v-6h4v6h5v-8h3z'/></svg>") center / contain no-repeat;
          mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 3 2 12h3v8h5v-6h4v6h5v-8h3z'/></svg>") center / contain no-repeat;
}

/* ---------- Mục cuối (trang hiện tại): nổi bật ---------- */
#dnn_BREADCRUMB_lblBreadCrumb span[itemprop="itemListElement"]:last-child a {
  color: #fff !important;
  background-color: var(--bc-main);
  font-weight: 600;
  padding: 3px 12px;
  border-radius: 999px;
  pointer-events: none; /* trang hiện tại không cần click */
}

/* ---------- Mobile ---------- */
@media (max-width: 767px) {
  #dnn_BREADCRUMB_lblBreadCrumb {
    padding: 7px 10px !important;
  }
  #dnn_BREADCRUMB_lblBreadCrumb span[itemprop="itemListElement"] {
    font-size: 13px !important;
  }
  #dnn_BREADCRUMB_lblBreadCrumb span[itemprop="itemListElement"] + span[itemprop="itemListElement"]::before {
    margin: 0 8px 0 6px;
  }
  /* Mục cuối quá dài thì cắt bớt */
  #dnn_BREADCRUMB_lblBreadCrumb span[itemprop="itemListElement"]:last-child a {
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}
/* =========================================================
   KẾT THÚC BREADCRUMB - trang tin chi tiết
   Scope: #dnn_BREADCRUMB_lblBreadCrumb (không dùng class chung)
   Dán vào DNN Custom CSS. Kiểm tra bằng Ctrl+Shift+R / tab ẩn danh.
   ========================================================= */

/* =========================================================
   KHỐI LIÊN KẾT: Đường dây nóng (505), Đăng ký KCB (506), Chuyển đổi số (507)
   Scope: class riêng của từng module (DnnModule-505/506/507),
   không dùng class chung DnnModule / DnnModule-DNN_HTML.
   Dán vào DNN Custom CSS. Kiểm tra bằng Ctrl+Shift+R / tab ẩn danh.
   ========================================================= */

/* ---------- Khoảng cách giữa các khối ---------- */
.DnnModule-505,
.DnnModule-506,
.DnnModule-507 {
  box-sizing: border-box;
  margin: 0 0 16px !important;         /* chỉnh khoảng cách ở đây */
  overflow: hidden;
  border-radius: 8px;
  transition: transform .25s ease, box-shadow .25s ease;
}

/* Bootstrap col-md-12 chứa khối: thêm khe giữa các pane */
#dnn_Lketpane2,
#dnn_Lketpane3 {
  padding-top: 0;
  padding-bottom: 0;
}

/* ---------- Ảnh/banner bên trong co theo chiều rộng khối ---------- */
.DnnModule-505 img,
.DnnModule-506 img,
.DnnModule-507 img {
  display: block;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 auto;
  transition: transform .4s ease;
}

/* ---------- Hover ---------- */
.DnnModule-505:hover,
.DnnModule-506:hover,
.DnnModule-507:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 18px rgba(11, 108, 176, .18);
}
.DnnModule-505:hover img,
.DnnModule-506:hover img,
.DnnModule-507:hover img {
  transform: scale(1.03);
}

@media (prefers-reduced-motion: reduce) {
  .DnnModule-505, .DnnModule-506, .DnnModule-507,
  .DnnModule-505 img, .DnnModule-506 img, .DnnModule-507 img { transition: none; }
}
/*=============================================================*/

/* =========================================================
   SIDEBAR PHẢI - danh sách tin (module 546)
   Scope: #dnn_ctr546_ModuleContent (không dùng class chung)
   Dán vào DNN Custom CSS. Kiểm tra bằng Ctrl+Shift+R / tab ẩn danh.
   ========================================================= */

#dnn_ctr546_ModuleContent {
  --nl-main:  #0b6cb0;
  --nl-soft:  #f1f7fc;
  --nl-text:  #2f3a45;
  --nl-line:  #e3ecf3;
  --nl-img-w: 104px;   /* chiều rộng ảnh: chỉnh ở đây */
  --nl-gap:   10px;    /* khoảng cách ảnh - chữ: chỉnh ở đây */
}

#dnn_ctr546_ModuleContent,
#dnn_ctr546_ModuleContent [name="test"] {
  box-sizing: border-box;
  max-width: 100%;
  overflow: visible;
}

/* ---------- Thẻ tin: ảnh trái, chữ phải ---------- */
#dnn_ctr546_ModuleContent .title_img_NewsItem {
  position: relative;
  display: flex !important;
  align-items: center;
  gap: var(--nl-gap);
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-height: 80px;
  margin: 0 0 10px !important;
  padding: 8px 12px 8px 10px !important;
  float: none !important;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--nl-line);
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(11, 108, 176, .05);
  transition: transform .25s ease, box-shadow .25s ease, background-color .25s ease, border-color .25s ease;
}

#dnn_ctr546_ModuleContent .title_img_NewsItem::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: var(--nl-main);
  transform: scaleY(0);
  transform-origin: top;
  transition: transform .25s ease;
}

/* Reset toàn bộ con trực tiếp: bỏ float, margin, padding, width từ skin */
#dnn_ctr546_ModuleContent .title_img_NewsItem > * {
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box;
  min-width: 0;
  text-indent: 0 !important;
  text-align: left !important;
}

/* ---------- Khối ảnh: rộng cố định, ảnh giữ nguyên tỉ lệ (hiện đủ logo) ---------- */
#dnn_ctr546_ModuleContent .title_img_NewsItem > :has(img) {
  flex: 0 0 var(--nl-img-w) !important;
  width: var(--nl-img-w) !important;
  max-width: var(--nl-img-w) !important;
  overflow: hidden;
  border-radius: 6px;
  line-height: 0;
}

/* mọi lớp bọc trung gian (a, div, span) chứa ảnh cũng không được có khoảng trống */
#dnn_ctr546_ModuleContent .title_img_NewsItem > :has(img) :not(img) {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

#dnn_ctr546_ModuleContent .title_img_NewsItem img {
  display: block !important;
  width: 100% !important;
  height: auto !important;        /* không cắt: hiện đủ ảnh + logo */
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 6px;
  transition: transform .4s ease;
}

/* ---------- Khối chữ: chiếm phần còn lại ---------- */
#dnn_ctr546_ModuleContent .title_img_NewsItem > :not(:has(img)) {
  flex: 1 1 0 !important;
  width: auto !important;
  max-width: none !important;
}

#dnn_ctr546_ModuleContent .title_img_NewsItem > :not(:has(img)) * {
  margin-left: 0 !important;
  padding-left: 0 !important;
  text-indent: 0 !important;
  white-space: normal !important;
  overflow-wrap: anywhere;
}

#dnn_ctr546_ModuleContent .title_img_NewsItem a:not(:has(img)) {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
  color: var(--nl-text) !important;
  font-size: 13.5px !important;
  font-weight: 500;
  line-height: 1.4 !important;
  text-decoration: none !important;
  transition: color .2s ease;
}

/* ---------- Hover ---------- */
#dnn_ctr546_ModuleContent .title_img_NewsItem:hover {
  transform: translateX(4px);
  background: var(--nl-soft);
  border-color: #c9dff0;
  box-shadow: 0 6px 16px rgba(11, 108, 176, .14);
}
#dnn_ctr546_ModuleContent .title_img_NewsItem:hover::before { transform: scaleY(1); }
#dnn_ctr546_ModuleContent .title_img_NewsItem:hover img { transform: scale(1.08); }
#dnn_ctr546_ModuleContent .title_img_NewsItem:hover a:not(:has(img)) { color: var(--nl-main) !important; }

#dnn_ctr546_ModuleContent div[align="center"] {
  margin: 0;
  padding: 0;
  min-height: 0;
}

@media (prefers-reduced-motion: reduce) {
  #dnn_ctr546_ModuleContent .title_img_NewsItem,
  #dnn_ctr546_ModuleContent .title_img_NewsItem img,
  #dnn_ctr546_ModuleContent .title_img_NewsItem::before { transition: none; }
}
/*===============================================================*/

/* =========================================================
   SIDEBAR PHẢI - danh sách tin (module 547-Phần bài bên dưới sidebar)
   Cấu trúc: .title_img_NewsItem > .title_img_NewsImage + .title_img_NewsHeadline
   Scope: #dnn_ctr547_ModuleContent (không dùng class chung)
   Dán vào DNN Custom CSS. Kiểm tra bằng Ctrl+Shift+R / tab ẩn danh.
   ========================================================= */
#dnn_ctr547_ModuleContent {
  --nl-main:  #0b6cb0;
  --nl-soft:  #f1f7fc;
  --nl-text:  #2f3a45;
  --nl-line:  #e3ecf3;
  --nl-img-w: 104px;   /* chiều rộng khung ảnh */
  --nl-img-h: 72px;    /* chiều cao khung ảnh */
  --nl-gap:   10px;    /* khoảng cách ảnh - chữ */
}

#dnn_ctr547_ModuleContent,
#dnn_ctr547_ModuleContent [name="test"] {
  box-sizing: border-box;
  max-width: 100%;
  overflow: visible;
}

/* ---------- Thẻ tin ---------- */
#dnn_ctr547_ModuleContent .title_img_NewsItem {
  position: relative;
  display: flex !important;
  align-items: center;
  gap: var(--nl-gap);
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  margin: 0 0 10px !important;
  padding: 8px 12px 8px 10px !important;
  float: none !important;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--nl-line);
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(11, 108, 176, .05);
  transition: transform .25s ease, box-shadow .25s ease, background-color .25s ease, border-color .25s ease;
}

/* Thanh nhấn trái, trượt ra khi hover */
#dnn_ctr547_ModuleContent .title_img_NewsItem::before {
  content: "";
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: var(--nl-main);
  transform: scaleY(0);
  transform-origin: top;
  transition: transform .25s ease;
}

/* ---------- Khối ảnh ---------- */
#dnn_ctr547_ModuleContent .title_img_NewsImage {
  flex: 0 0 var(--nl-img-w) !important;
  width: var(--nl-img-w) !important;
  max-width: var(--nl-img-w) !important;
  height: var(--nl-img-h);
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  background: var(--nl-soft);          /* nền cho ảnh lỗi / ảnh không đủ tỉ lệ */
  border: 1px solid var(--nl-line);
  border-radius: 6px;
  box-sizing: border-box;
  line-height: 0;
}

#dnn_ctr547_ModuleContent .title_img_NewsImage a {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

#dnn_ctr547_ModuleContent .title_img_NewsImage img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  object-fit: contain;                 /* hiện đủ ảnh/logo, không cắt */
  transition: transform .4s ease;
}

/* ---------- Khối tiêu đề ---------- */
#dnn_ctr547_ModuleContent .title_img_NewsHeadline {
  flex: 1 1 0 !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  text-indent: 0 !important;
}

#dnn_ctr547_ModuleContent .title_img_NewsHeadline a {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;               /* tối đa 4 dòng rồi hiện "…" */
  overflow: hidden;
  overflow-wrap: anywhere;
  white-space: normal !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--nl-text) !important;
  font-size: 13.5px !important;
  font-weight: 500;
  line-height: 1.4 !important;
  text-decoration: none !important;
  transition: color .2s ease;
}

/* ---------- Hover ---------- */
#dnn_ctr547_ModuleContent .title_img_NewsItem:hover {
  transform: translateX(4px);
  background: var(--nl-soft);
  border-color: #c9dff0;
  box-shadow: 0 6px 16px rgba(11, 108, 176, .14);
}
#dnn_ctr547_ModuleContent .title_img_NewsItem:hover::before { transform: scaleY(1); }
#dnn_ctr547_ModuleContent .title_img_NewsItem:hover .title_img_NewsImage img { transform: scale(1.08); }
#dnn_ctr547_ModuleContent .title_img_NewsItem:hover .title_img_NewsHeadline a { color: var(--nl-main) !important; }

#dnn_ctr547_ModuleContent div[align="center"] {
  margin: 0;
  padding: 0;
  min-height: 0;
}

@media (prefers-reduced-motion: reduce) {
  #dnn_ctr547_ModuleContent .title_img_NewsItem,
  #dnn_ctr547_ModuleContent .title_img_NewsImage img,
  #dnn_ctr547_ModuleContent .title_img_NewsItem::before { transition: none; }
}
/* =========================================================
   KẾT THÚC SIDEBAR PHẢI - danh sách tin (module 547-Phần bài bên dưới sidebar)
   Cấu trúc: .title_img_NewsItem > .title_img_NewsImage + .title_img_NewsHeadline
   Scope: #dnn_ctr547_ModuleContent (không dùng class chung)
   Dán vào DNN Custom CSS. Kiểm tra bằng Ctrl+Shift+R / tab ẩn danh.
   ========================================================= */

/* =========================================================
   SIDEBAR PHẢI - khối banner liên kết (module 548, HTML module)
   Cấu trúc: #dnn_ctr548_HtmlModule_lblContent > p > (a >) img
   Scope: #dnn_ctr548_HtmlModule_lblContent (không dùng class chung)
   Dán vào DNN Custom CSS. Kiểm tra bằng Ctrl+Shift+R / tab ẩn danh.
   ========================================================= */

#dnn_ctr548_HtmlModule_lblContent {
  --lk-main: #0b6cb0;
  --lk-soft: #f1f7fc;
  --lk-line: #e3ecf3;
  box-sizing: border-box;
  max-width: 100%;
  overflow: hidden;
}

/* ---------- Mỗi banner là một thẻ ---------- */
#dnn_ctr548_HtmlModule_lblContent p:has(img) {
  position: relative;
  box-sizing: border-box;
  margin: 0 0 12px !important;         /* khoảng cách giữa các banner */
  padding: 6px !important;
  overflow: hidden;
  text-align: center !important;
  text-indent: 0 !important;
  line-height: 0;                      /* bỏ khe hở dưới ảnh */
  background: #fff;
  border: 1px solid var(--lk-line);
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(11, 108, 176, .05);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease, background-color .25s ease;
}

/* Thanh nhấn phía dưới, chạy ra khi hover */
#dnn_ctr548_HtmlModule_lblContent p:has(img)::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 3px;
  background: var(--lk-main);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .3s ease;
}

/* ---------- Ảnh: đè inline style height/width của editor ---------- */
#dnn_ctr548_HtmlModule_lblContent p img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  border: 0 !important;
  border-radius: 5px;
  transition: transform .4s ease;
}

#dnn_ctr548_HtmlModule_lblContent p a {
  display: block;
  overflow: hidden;
  border-radius: 5px;
}

/* ---------- Đoạn <p> trống (không có ảnh): không chiếm chỗ ---------- */
#dnn_ctr548_HtmlModule_lblContent p:not(:has(img)) {
  display: none !important;
}

/* ---------- Hover ---------- */
#dnn_ctr548_HtmlModule_lblContent p:has(img):hover {
  transform: translateY(-3px);
  background: var(--lk-soft);
  border-color: #c9dff0;
  box-shadow: 0 8px 18px rgba(11, 108, 176, .16);
}
#dnn_ctr548_HtmlModule_lblContent p:has(img):hover::after { transform: scaleX(1); }
#dnn_ctr548_HtmlModule_lblContent p:has(img):hover img { transform: scale(1.04); }

@media (prefers-reduced-motion: reduce) {
  #dnn_ctr548_HtmlModule_lblContent p:has(img),
  #dnn_ctr548_HtmlModule_lblContent p img,
  #dnn_ctr548_HtmlModule_lblContent p:has(img)::after { transition: none; }
}
/* =========================================================
   ========================================================= */
/* =====================================================
   KHỐI DANH SÁCH VĂN BẢN (module 461)
   "YÊU CẦU BÁO GIÁ", "THÔNG BÁO", "QUYẾT ĐỊNH", "THƯ MỜI BÁO GIÁ"...
   Badge màu tự động theo loại văn bản, nhận diện qua từ khóa
   có sẵn trong href (không cần sửa HTML, không cần JS).
   ===================================================== */
 
/* Bỏ bullet mặc định, mỗi dòng cách nhau */
#dnn_ctr461_ModuleContent .list_lct {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
 
#dnn_ctr461_ModuleContent .list_lct li::marker {
  content: none;
}
 
/* Mỗi dòng: khung viền mỏng, bo góc, hover đổi nền */
#dnn_ctr461_ModuleContent .list_lct li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-left: 14px;
  border: 1px solid #ececec;
  border-radius: 10px;
  transition: background 0.2s ease, border-color 0.2s ease;
}
 
#dnn_ctr461_ModuleContent .list_lct li:hover {
  background: #f5f9f5;
  border-color: #cfe3cf;
}
 
/* Icon tài liệu dùng chung cho mọi dòng */
#dnn_ctr461_ModuleContent .list_lct li::before {
  content: "📄";
  flex-shrink: 0;
  font-size: 16px;
}
 
/* Link chiếm phần còn lại của dòng, canh giữa theo chiều dọc với badge */
#dnn_ctr461_ModuleContent .title_right {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  padding: 12px 14px 12px 0;
  text-decoration: none;
  color: #1a1a1a;
  font-size: 14px;
  line-height: 1.5;
}
 
#dnn_ctr461_ModuleContent .title_right:hover {
  color: #6699FF;
}
 
/* Badge dùng chung: kích thước, hình dạng pill */
#dnn_ctr461_ModuleContent .title_right::before {
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 999px;
  white-space: nowrap;
}
 
/* Màu badge theo từng loại văn bản, nhận diện qua href */
#dnn_ctr461_ModuleContent a[href*="YEU-CAU"]::before {
  content: "Yêu cầu";
  background: #e6f1fb;
  color: #0c447c;
}
 
#dnn_ctr461_ModuleContent a[href*="THONG-BAO"]::before {
  content: "Thông báo";
  background: #faeeda;
  color: #633806;
}
 
#dnn_ctr461_ModuleContent a[href*="QUYET-DINH"]::before {
  content: "Quyết định";
  background: #eeedfe;
  color: #3c3489;
}
 
#dnn_ctr461_ModuleContent a[href*="THU-MOI"]::before {
  content: "Thư mời";
  background: #eaf3de;
  color: #27500a;
}

/* ============================================================================
 DANH SACH BAI VIET template col-img - HOVER KIEU 2 + 3
   Kieu 2: nen xanh nhat tran tu trai sang phai, tieu de doi mau, mui ten hien o cuoi the.
   Kieu 3: anh toi lai co nhan "Xem chi tiet" o giua anh.
   Cau truc: div.col-img > figure > a > img ; h5 (tieu de) ; cac phan tu sau (ngay, tom tat)
   Scope: .ModNewsListC .col-img (class col-img chi co o template nay). File chi dung ky tu ASCII. 
==============================================================================
*/
.ModNewsListC {
  --cl-main: #0b6cb0;
  --cl-dark: #084c7d;
  --cl-soft: #e8f2fa;
  --cl-line: #e3ecf3;
  --cl-img-w: 180px;
  --cl-img-h: 120px;
  --cl-gap: 14px;
}

/* The bai viet */
.ModNewsListC .col-img {
  position: relative;
  display: flow-root !important;
  float: none !important;
  width: auto !important;
  max-width: 100% !important;
  box-sizing: border-box;
  margin: 0 0 12px 0 !important;
  padding: 10px 48px 10px 10px !important;   /* chua cho cho mui ten ben phai */
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--cl-line) !important;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(11, 108, 176, 0.06);
  transition: border-color .3s ease, box-shadow .3s ease;
}

/* KIEU 2: lop nen tran tu trai sang phai */
.ModNewsListC .col-img::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 0;
  background: linear-gradient(90deg, var(--cl-soft) 0%, #f6fafd 100%);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .5s cubic-bezier(.22, .61, .36, 1);
}

/* KIEU 2: mui ten o cuoi the */
.ModNewsListC .col-img::after {
  content: "\2192";
  position: absolute;
  top: 50%;
  right: 16px;
  z-index: 1;
  color: var(--cl-main);
  font-size: 22px;
  font-weight: 700;
  line-height: 1;
  opacity: 0;
  transform: translate(-12px, -50%);
  transition: opacity .3s ease .1s, transform .3s ease .1s;
}

/* Noi dung nam tren lop nen */
.ModNewsListC .col-img figure,
.ModNewsListC .col-img figure ~ * {
  position: relative;
  z-index: 1;
}

/* Khung anh */
.ModNewsListC .col-img figure {
  float: left !important;
  box-sizing: border-box;
  width: var(--cl-img-w) !important;
  height: var(--cl-img-h) !important;
  margin: 0 var(--cl-gap) 0 0 !important;
  padding: 0 !important;
  overflow: hidden;
  line-height: 0;
  background: #f1f7fc;
  border-radius: 6px;
}

.ModNewsListC .col-img figure a {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.ModNewsListC .col-img figure img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  object-fit: contain;
  transform: scale(1);
  transition: transform .5s ease;
}

/* KIEU 3: lop phu toi len anh */
.ModNewsListC .col-img figure::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  background: rgba(8, 76, 125, 0.58);
  opacity: 0;
  pointer-events: none;
  transition: opacity .35s ease;
}

/* KIEU 3: nhan "Xem chi tiet" giua anh */
.ModNewsListC .col-img figure::after {
  content: "Xem chi ti\1EBF t";
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 3;
  padding: 6px 14px;
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  border: 1.5px solid #fff;
  border-radius: 999px;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -30%);
  transition: opacity .35s ease, transform .35s ease;
}

/* Phan chu: nam canh anh, khong chay xuong duoi anh */
.ModNewsListC .col-img figure ~ * {
  display: flow-root;
  margin-left: 0 !important;
  padding-left: 0 !important;
  text-indent: 0 !important;
}

.ModNewsListC .col-img h5 {
  margin: 0 0 4px 0 !important;
  line-height: 1.45 !important;
}

.ModNewsListC .col-img h5 a {
  color: #1f2a36 !important;
  font-weight: 700;
  text-decoration: none !important;
  transition: color .3s ease;
}

/* HOVER */
.ModNewsListC .col-img:hover {
  border-color: #c9dff0 !important;
  box-shadow: 0 6px 18px rgba(11, 108, 176, 0.12);
}

.ModNewsListC .col-img:hover::before {
  transform: scaleX(1);
}

.ModNewsListC .col-img:hover::after {
  opacity: 1;
  transform: translate(0, -50%);
}

.ModNewsListC .col-img:hover figure img {
  transform: scale(1.06);
}

.ModNewsListC .col-img:hover figure::before {
  opacity: 1;
}

.ModNewsListC .col-img:hover figure::after {
  opacity: 1;
  transform: translate(-50%, -50%);
}

.ModNewsListC .col-img:hover h5 a {
  color: var(--cl-main) !important;
}
/*================================================================*/

