/* ============================================================
   Cong Nghe BIM - giao dien bao/tap chi
   Phang, vuong, phan cach bang duong ke manh (tham khao VnExpress).
   Phu len all.css nen phai dung !important o hau het cho.
   ============================================================ */
:root{
  --nv-900:#0a1f3d; --nv-800:#0f2d55; --nv-700:#16406f; --nv-600:#1d5490;
  --nv-500:#2b6cb0; --nv-050:#f2f6fb;
  --ac:#0d9488;
  --ink:#1a1a1a;
  --ink-2:#333; --sapo:#6b7280; --meta:#9aa3ad;
  --line:#e5e7eb; --line-2:#d8dde3;
  --font:"Be Vietnam Pro","Segoe UI",system-ui,-apple-system,Arial,sans-serif;
}
body{font-family:var(--font)!important;color:var(--ink-2)!important;background:#fff!important;
  font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
a,body,div,li,p,span,td{font-family:var(--font)!important}
h1,h2,h3,h4,h5{font-family:var(--font)!important;color:var(--ink)!important;
  font-weight:700;letter-spacing:-.01em}
a{color:var(--ink);text-decoration:none;transition:color .15s}
a:hover{color:var(--nv-600)}
img{max-width:100%;height:auto;background:var(--nv-050)}

/* ---------------------------------------------------- thanh dieu huong */
.navbar.block-nav,nav.navbar,nav.navbar.bg-light{
  background:var(--nv-800)!important;padding:0!important;border:0!important;box-shadow:none!important;
  border-bottom:3px solid var(--ac)!important}
.navbar .site-brand{color:#fff!important;font-weight:800!important;font-size:20px!important;
  letter-spacing:-.02em;padding:15px 0!important;text-decoration:none!important;white-space:nowrap;
  margin-right:26px}
.navbar .site-brand span{color:var(--ac)!important}
.navbar .site-brand:hover{opacity:.92}
.navbar .list-menu>li>a,.navbar .nav-link{
  color:rgba(255,255,255,.9)!important;font-weight:600!important;font-size:14.5px!important;
  padding:17px 13px!important;position:relative;text-transform:none!important}
.navbar .list-menu>li>a:hover,.navbar .nav-link:hover{color:#fff!important;background:rgba(255,255,255,.07)}
.navbar .nav-link::after{content:"";position:absolute;left:13px;right:13px;bottom:0;height:3px;
  background:var(--ac);transform:scaleX(0);transform-origin:left;transition:transform .2s}
.navbar .nav-link:hover::after{transform:scaleX(1)}
.navbar-toggler{border-color:rgba(255,255,255,.35)!important;padding:6px 10px!important}
.navbar-toggler-icon{filter:invert(1) brightness(2)}
.navbar .container{flex-wrap:nowrap}

/* ---------------------------------------------------- tieu de chuyen muc */
.title-arti,.title-theme{
  background:0 0!important;border:0!important;border-bottom:2px solid var(--nv-800)!important;
  padding:0 0 8px!important;margin:0 0 18px!important;text-transform:none!important;position:static!important}
.title-arti::after,.title-theme::after{display:none!important}
.title-arti .name-title{background:0 0!important}
.title-arti .left-title,.title-theme strong,.title-theme #featured_topic{
  display:inline-block!important;background:0 0!important;box-shadow:none!important;
  color:var(--nv-800)!important;font-size:19px!important;font-weight:800!important;
  letter-spacing:-.01em!important;padding:0!important;border-radius:0!important;line-height:1.3!important;
  text-transform:uppercase!important}
.title-arti .left-title a,.title-arti .left-title a.text-dark,.title-arti .left-title *{
  color:var(--nv-800)!important;background:0 0!important;text-decoration:none!important}
.title-arti .left-title a:hover{color:var(--ac)!important}
.xem-them{float:right;font-size:13.5px!important;font-weight:600!important;color:var(--nv-600)!important;
  text-transform:none!important;letter-spacing:0!important;padding-top:5px}
.xem-them:hover{color:var(--ac)!important}

/* ---------------------------------------------------- khoi chuyen muc trang chu */
section.block-arti{background:0 0!important;border:0!important;border-radius:0!important;
  padding:0!important;box-shadow:none!important;margin:0 0 40px!important}
.category-item{background:0 0!important;border:0!important;border-radius:0!important;
  padding:0!important;margin:0 0 40px!important;box-shadow:none!important}
.category-item:hover{transform:none!important;box-shadow:none!important;background:0 0!important}

/* tin chinh: anh lon 16:9 + tieu de lon + sapo */
.arti-left img,.arti-left img.img-thumbnail{width:100%!important;height:auto!important;
  aspect-ratio:16/9!important;object-fit:cover!important;border-radius:3px!important;
  border:0!important;padding:0!important;box-shadow:none!important;display:block;max-width:100%!important}
.arti-left h2{margin:14px 0 8px!important}
.arti-left h2 a{font-size:24px!important;line-height:1.3!important;font-weight:700!important;
  color:var(--ink)!important;letter-spacing:-.02em}
.arti-left h2 a:hover{color:var(--nv-600)!important}
.arti-left .entry-excerpt,.arti-left .text-decrip-4{
  font-size:15px!important;line-height:1.65!important;color:var(--sapo)!important;display:block}

/* tin phu: hang ngang, thumbnail 16:9 nho, ngan cach bang duong ke */
.arti-right{padding-left:28px!important}
.arti-right ul.list-topic{list-style:none;margin:0!important;padding:0!important}
.arti-right li.itemtopic{border-bottom:1px solid var(--line);padding:0 0 15px!important;margin-bottom:15px}
.arti-right ul.list-topic:last-child li.itemtopic{border-bottom:0;margin-bottom:0;padding-bottom:0!important}
.arti-right li.itemtopic .d-flex{gap:14px;align-items:flex-start}
.arti-right li.itemtopic .me-3{margin-right:0!important;flex:0 0 116px;max-width:116px}
.arti-right li.itemtopic img{width:116px!important;height:74px!important;object-fit:cover!important;
  border-radius:3px!important;display:block;box-shadow:none!important;border:0!important;padding:0!important}
.arti-right li.itemtopic .col-9{flex:1 1 auto;max-width:none!important;width:auto!important;padding:0!important}
.arti-right li.itemtopic a.fs-4,.arti-right li.itemtopic .col-9 a{
  font-size:16px!important;line-height:1.45!important;font-weight:600!important;color:var(--ink)!important}
.arti-right li.itemtopic .col-9 a:hover{color:var(--nv-600)!important}

/* ---------------------------------------------------- trang danh sach */
.header-archive,.header-archive[style]{background:0 0!important;border:0!important;
  border-bottom:2px solid var(--nv-800)!important;padding:0 0 8px!important;margin:0 0 22px!important}
/* Template long 2 the .header-archive vao nhau -> se ra 2 duong ke. Bo duong cua the trong. */
.header-archive .header-archive{border:0!important;border-bottom:0!important;
  padding:0!important;margin:0!important;background:0 0!important}
h1.htitle{font-size:24px!important;line-height:1.3!important;color:var(--nv-800)!important;
  margin:0!important;font-weight:800!important;text-transform:uppercase;letter-spacing:-.01em}
li.itemtopic{border-bottom:1px solid var(--line)!important;padding:20px 0!important;background:0 0!important}
li.itemtopic:last-child{border-bottom:0!important}
li.itemtopic:hover{background:0 0!important}
li.itemtopic>.d-flex{gap:20px;align-items:flex-start}
li.itemtopic #image_post{height:auto!important;padding:0!important;flex:0 0 240px!important;
  max-width:240px!important;min-width:0!important}
li.itemtopic #image_post img{width:100%!important;height:145px!important;object-fit:cover!important;
  border-radius:3px!important;background:var(--nv-050);margin:0!important;box-shadow:none!important}
li.itemtopic #post_title{flex:1 1 auto!important;max-width:none!important;padding:0!important;
  gap:7px;justify-content:flex-start!important}
li.itemtopic #post_title>a,li.itemtopic a.name{font-size:19px!important;line-height:1.35!important;
  font-weight:700!important;color:var(--ink)!important;display:block;letter-spacing:-.015em}
li.itemtopic #post_title>a:hover{color:var(--nv-600)!important}
li.itemtopic #post_title p,li.itemtopic .entry-excerpt{font-size:14.5px!important;line-height:1.65!important;
  color:var(--sapo)!important;margin:0!important}

/* ---------------------------------------------------- trang bai viet */
h1.entry-title{border:0!important;padding:0!important;font-size:32px!important;line-height:1.25!important;
  color:var(--ink)!important;margin:0 0 14px!important;font-weight:700!important;letter-spacing:-.025em}
.entry-content,.detail-content,.post-content{font-size:17px;line-height:1.75;color:var(--ink-2)}
.entry-content h2,.entry-content h3{color:var(--ink);margin:32px 0 12px;font-weight:700;line-height:1.35}
.entry-content h2{font-size:22px} .entry-content h3{font-size:19px}
.entry-content a{color:var(--nv-600);text-decoration:underline;text-underline-offset:2px}
.entry-content img{border-radius:3px;box-shadow:none;margin:8px 0}
.entry-content table{width:100%;border-collapse:collapse;margin:18px 0;font-size:15px}
.entry-content th,.entry-content td{border:1px solid var(--line);padding:9px 12px;text-align:left}
.entry-content th{background:var(--nv-050);font-weight:700;color:var(--nv-800)}
blockquote{border-left:3px solid var(--ac);background:var(--nv-050);padding:14px 18px;
  border-radius:0;color:var(--ink-2);margin:20px 0}

/* ---------------------------------------------------- cot ben phai */
.hsidebar{border-left:1px solid var(--line);padding-left:24px}
.hsidebar .title-theme{border-bottom:2px solid var(--nv-800)!important;padding-bottom:8px!important}
.hsidebar a{color:var(--ink)!important;font-weight:600;font-size:15px;line-height:1.45}
.hsidebar a:hover{color:var(--nv-600)!important}
.hsidebar img{border-radius:3px!important;box-shadow:none!important;margin-bottom:8px;
  width:100%!important;aspect-ratio:16/10;object-fit:cover;height:auto!important}
.kh-item{padding:0 0 16px;margin-bottom:16px;border-bottom:1px solid var(--line)}
.kh-item:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
.kh-nhan{display:inline-block;background:var(--ac);color:#fff!important;font-size:11px;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;padding:3px 8px;border-radius:2px;margin-bottom:8px}
.kh-item a.kh-ten{display:block;font-size:15px!important;font-weight:700!important;line-height:1.4!important}
.kh-item .kh-mo{font-size:13.5px;color:var(--sapo);line-height:1.55;margin-top:4px}

/* ---------------------------------------------------- chan trang */
footer.site-footer{background:var(--nv-900)!important;color:rgba(255,255,255,.7)!important;
  margin-top:48px;padding:36px 0 24px!important;border:0!important}
footer.site-footer a{color:rgba(255,255,255,.85)!important}
footer.site-footer a:hover{color:#fff!important}
footer.site-footer .footer-copy{border-top:1px solid rgba(255,255,255,.12);margin-top:20px;
  padding-top:16px;font-size:13.5px;color:rgba(255,255,255,.55)!important}

/* ---------------------------------------------------- phan trang */
.pagination a,.pagination span,.paging a,.paging span{border-radius:2px!important;
  border:1px solid var(--line-2)!important;color:var(--ink-2)!important;padding:8px 13px!important;
  margin:0 3px;font-weight:600;font-size:14px}
.pagination .current,.pagination a:hover,.paging .current,.paging a:hover{
  background:var(--nv-800)!important;color:#fff!important;border-color:var(--nv-800)!important}

/* ---------------------------------------------------- H1 trang chu */
h1.home-h1{font-size:15px!important;line-height:1.5;font-weight:600;color:var(--sapo)!important;
  margin:0 0 22px;padding:0 0 16px;border:0;border-bottom:1px solid var(--line)}

img.img-mac-dinh{object-fit:contain!important;background:var(--nv-050)!important}
[style*="#E64D4F"],[style*="#e64d4f"],[style*="#ed1c22"]{border-color:var(--nv-800)!important}

/* ---------------------------------------------------- may tinh bang */
@media (max-width:1199px){
  .arti-left h2 a{font-size:21px!important}
  .arti-right{padding-left:20px!important}
  li.itemtopic #image_post{flex:0 0 200px!important;max-width:200px!important}
  li.itemtopic #image_post img{height:122px!important}
  li.itemtopic #post_title>a{font-size:17.5px!important}
}
@media (max-width:991px){
  .navbar .container{flex-wrap:wrap!important;align-items:center;padding-left:16px;padding-right:16px}
  .navbar .site-brand{margin-right:auto;font-size:18px!important;padding:12px 0!important}
  .navbar-toggler{order:2;margin-left:auto}
  .navbar .navbar-collapse{order:3;flex:0 0 100%!important;width:100%!important;max-width:100%!important;
    margin-top:4px;border-top:1px solid rgba(255,255,255,.14)}
  .navbar .list-menu{width:100%;margin:0!important;padding:4px 0 8px!important;list-style:none}
  .navbar .list-menu>li,.navbar .list-menu>li.item-menu{width:100%;margin:0!important}
  .navbar .list-menu>li>a,.navbar .nav-link{display:block;width:100%;padding:13px 0!important;
    font-size:15px!important;border-bottom:1px solid rgba(255,255,255,.08);text-align:left}
  .navbar .list-menu>li:last-child .nav-link{border-bottom:0}
  .navbar .nav-link::after{display:none}
  .arti-left{margin-bottom:24px}
  .arti-right{padding-left:0!important}
  .hsidebar{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:24px;margin-top:32px}
}
/* ---------------------------------------------------- dien thoai */
@media (max-width:640px){
  body{font-size:15.5px}
  .title-arti .left-title,.title-theme strong,.title-theme #featured_topic{font-size:16.5px!important}
  .arti-left h2 a{font-size:20px!important}
  h1.entry-title{font-size:24px!important}
  h1.htitle{font-size:19px!important}
  .entry-content,.detail-content,.post-content{font-size:16px}
  .category-item,section.block-arti{margin-bottom:30px!important}
  .arti-right li.itemtopic .me-3{flex:0 0 96px;max-width:96px}
  .arti-right li.itemtopic img{width:96px!important;height:62px!important}
  .arti-right li.itemtopic .col-9 a{font-size:15px!important}
  li.itemtopic{padding:15px 0!important}
  li.itemtopic>.d-flex{gap:13px}
  li.itemtopic #image_post{flex:0 0 118px!important;max-width:118px!important}
  li.itemtopic #image_post img{height:76px!important}
  li.itemtopic #post_title>a{font-size:15.5px!important}
  li.itemtopic #post_title p{display:none}
  .entry-content table{display:block;overflow-x:auto;white-space:nowrap}
  .xem-them{font-size:12.5px!important;padding-top:3px}
}

/* ============================================================
   VA MOBILE DANH MUC — 19/08/2026
   ============================================================ */

/* 1. Go thut le 20px do bo chon 'li' tran trong all.css ap len moi the bai */
li.itemtopic{margin-left:0!important;margin-right:0!important;list-style:none!important}
ul.list-topic{margin-left:0!important;padding-left:0!important;list-style:none!important}

@media (max-width:991px){
  /* Giu hang ngang cho danh sach bai (all.css chuyen .d-flex sang cot o day) */
  li.itemtopic>.d-flex{flex-direction:row!important;align-items:flex-start!important;gap:14px!important}

  li.itemtopic #image_post{
    flex:0 0 132px!important;max-width:132px!important;width:132px!important;
    height:auto!important;min-width:0!important}
  li.itemtopic #image_post img{
    width:100%!important;height:99px!important;object-fit:cover!important;
    border-radius:3px!important;margin:0!important}

  li.itemtopic #post_title{
    flex:1 1 auto!important;min-width:0!important;max-width:none!important;
    justify-content:flex-start!important;gap:5px!important}
  li.itemtopic #post_title>a{
    font-size:16px!important;line-height:1.35!important;font-weight:700!important;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

  /* Mo ta la DIV.entry-excerpt chu khong phai <p> — quy tac cu bat hut */
  li.itemtopic .entry-excerpt{
    font-size:13.5px!important;line-height:1.55!important;margin:0!important;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

  /* Khoang tho giua cac the */
  .arti-right li.itemtopic,.box-list-post li.itemtopic{
    padding:14px 0!important;margin-bottom:0!important;
    border-bottom:1px solid var(--line)!important}
}

@media (max-width:640px){
  li.itemtopic #image_post{flex:0 0 116px!important;max-width:116px!important;width:116px!important}
  li.itemtopic #image_post img{height:87px!important}
  li.itemtopic #post_title>a{font-size:15px!important}
  li.itemtopic .entry-excerpt{display:none!important}
}

/* ============================================================
   PHAN TRANG — 19/08/2026
   ============================================================ */
/* all.css dat .d-flex{flex-direction:column} o <=991px nen hang nut bi xep doc.
   Bam theo .content-left (chi co dung mot khoi nay trong do) de khong dung
   cac .d-flex.justify-content-center khac; kem :has() cho chac. */
.content-left>.d-flex.justify-content-center,
.d-flex.justify-content-center:has(> span.number){
  flex-direction:row!important;flex-wrap:wrap!important;
  align-items:center!important;justify-content:center!important;
  gap:8px!important;margin:34px 0 6px!important;
}
/* du phong cho trinh duyet khong ho tro :has() */
.justify-content-center>span.number,
.justify-content-center>span.current{margin:0 3px}

.justify-content-center>span.number>a,
.justify-content-center>span.current.number,
.justify-content-center>span>a[rel="last"],
.justify-content-center>span>a[rel="first"],
.justify-content-center>span>a[rel="next"],
.justify-content-center>span>a[rel="prev"]{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:38px;height:38px;padding:0 11px;
  border:1px solid var(--line);border-radius:3px;background:#fff;
  font-size:15px;font-weight:600;line-height:1;letter-spacing:0;
  color:var(--ink);text-decoration:none;
  transition:background .15s,border-color .15s,color .15s;
}
.justify-content-center>span.number>a:hover,
.justify-content-center>span>a[rel]:hover{
  border-color:var(--nv-800);color:var(--nv-800);background:var(--nv-050);
}
.justify-content-center>span.number>a:focus-visible,
.justify-content-center>span>a[rel]:focus-visible{
  outline:2px solid #0d9488;outline-offset:2px;
}
/* trang hien tai */
.justify-content-center>span.current.number{
  background:var(--nv-800)!important;border-color:var(--nv-800)!important;
  color:#fff!important;cursor:default;
}
/* bo dem "1/281" */
.justify-content-center>span.pagination{
  display:inline-flex;align-items:center;
  margin:0 12px 0 0!important;padding:0!important;
  font-size:13.5px;font-weight:500;color:var(--sapo);
  background:0 0!important;border:0!important;
}

@media (max-width:640px){
  .content-left>.d-flex.justify-content-center,
  .d-flex.justify-content-center:has(> span.number){gap:6px!important;margin:26px 0 4px!important}
  .justify-content-center>span.number>a,
  .justify-content-center>span.current.number,
  .justify-content-center>span>a[rel]{min-width:34px;height:34px;padding:0 8px;font-size:14px}
  .justify-content-center>span.pagination{flex:0 0 100%;justify-content:center;margin:0 0 10px 0!important}
}

/* ============================================================
   SUA DOT 7 — 19/08/2026
   ============================================================ */

/* 1. Icon menu: SVG trang san -> phai TAT filter:invert cua dong 41,
   khong thi trang bi lat thanh den (do duoc 2,06:1). */
.navbar-toggler .navbar-toggler-icon,
.block-nav .navbar-toggler-icon,
nav.navbar .navbar-toggler-icon{
  filter:none !important;
  background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23ffffff' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.8' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
  background-size:100% 100% !important;
  width:1.45em !important;height:1.45em !important;
}

/* 2. Tieu de bai noi bat tren mobile: 24px qua to cho cot 318px (3 dong) */
@media (max-width:991px){
  .category-item .arti-left h2 a,
  .category-item .arti-left h2,
  .arti-left h2 a{font-size:20px !important;line-height:1.35 !important}
}
@media (max-width:640px){
  .category-item .arti-left h2 a,
  .category-item .arti-left h2,
  .arti-left h2 a{font-size:18.5px !important;line-height:1.35 !important}
}

/* Siet kich thuoc nut tren dien thoai de hang phan trang du mot dong:
   trang 3 chu so ('147') rong hon trang 1 chu so nen de tran xuong dong 2. */
@media (max-width:640px){
  /* SIET NUT PHAN TRANG */
  .content-left>.d-flex.justify-content-center,
  .d-flex.justify-content-center:has(> span.number){gap:5px!important}
  .justify-content-center>span.number,
  .justify-content-center>span.current{margin:0!important}
  .justify-content-center>span.number>a,
  .justify-content-center>span.current.number,
  .justify-content-center>span>a[rel]{
    min-width:32px!important;height:32px!important;padding:0 6px!important;font-size:13.5px!important}
}