/* ================================================================
   INNER PAGES THEME SYNC 2026
   Applies the selected HomeLayout identity to /chuyen-muc/{id}
   and /bai-viet/{id}. Loaded last in _Layout.cshtml.
   ================================================================ */

/* ---------- shared structural polish ---------- */
body.home-layout-modern main.site-shell,
body.home-layout-transport main.site-shell{
  background:transparent !important;
}
body.home-layout-modern .page-hero,
body.home-layout-transport .page-hero,
body.home-layout-modern .article-content,
body.home-layout-transport .article-content,
body.home-layout-modern .list-item-modern,
body.home-layout-transport .list-item-modern,
body.home-layout-modern .doc-card-modern,
body.home-layout-transport .doc-card-modern,
body.home-layout-modern .empty-state,
body.home-layout-transport .empty-state{
  box-sizing:border-box !important;
}

/* ================================================================
   MODERN PORTAL — INNER PAGES
   ================================================================ */
body.home-layout-modern{
  --inner-primary:#123b66;
  --inner-blue:#1769aa;
  --inner-cyan:#16a6b6;
  --inner-teal:#16877f;
  --inner-gold:#e5b85c;
  --inner-ink:#173a5c;
  --inner-muted:#687d91;
  --inner-line:#d9e6ef;
  background:linear-gradient(180deg,#f2f7fb 0%,#f8fbfd 44%,#f2f8f6 100%) !important;
}

/* Top menu and its REAL children — prevents tblConfig child backgrounds covering it */
html body.home-layout-modern #mainNavigation.main-menu-wrap{
  background:#123b66 !important;
  background-image:linear-gradient(100deg,#123b66 0%,#1769aa 47%,#16a6b6 73%,#16877f 100%) !important;
  border:0 !important;
  border-bottom:2px solid rgba(229,184,92,.72) !important;
  box-shadow:0 7px 20px rgba(18,59,102,.17) !important;
}
html body.home-layout-modern #mainNavigation .main-menu-shell,
html body.home-layout-modern #mainNavigation .primary-menu-host,
html body.home-layout-modern #mainNavigation .menu,
html body.home-layout-modern #mainNavigation .menu-root,
html body.home-layout-modern #mainNavigation .sf-menu,
html body.home-layout-modern #mainNavigation .menu-root>li,
html body.home-layout-modern #mainNavigation .sf-menu>li,
html body.home-layout-modern #mainNavigation .menu-root>li>a,
html body.home-layout-modern #mainNavigation .sf-menu>li>a,
html body.home-layout-modern #mainNavigation .menu-home-link{
  background:transparent !important;
  background-image:none !important;
  border:0 !important;
  color:#fff !important;
  box-shadow:none !important;
}
html body.home-layout-modern #mainNavigation .menu-root>li:hover>a,
html body.home-layout-modern #mainNavigation .sf-menu>li:hover>a,
html body.home-layout-modern #mainNavigation .menu-root>li.active>a{
  background:rgba(255,255,255,.14) !important;
  box-shadow:inset 0 -2px 0 var(--inner-gold) !important;
}
html body.home-layout-modern #mainNavigation .menu-sub,
html body.home-layout-modern #mainNavigation li>ul,
html body.home-layout-modern #mainNavigation .sf-menu li ul{
  background:linear-gradient(145deg,#123b66,#1769aa 62%,#16877f) !important;
  border:1px solid rgba(255,255,255,.16) !important;
  border-radius:6px !important;
  padding:5px !important;
  box-shadow:0 12px 28px rgba(18,59,102,.22) !important;
}
html body.home-layout-modern #mainNavigation .menu-sub li,
html body.home-layout-modern #mainNavigation .sf-menu li ul li,
html body.home-layout-modern #mainNavigation .menu-sub li>a,
html body.home-layout-modern #mainNavigation .sf-menu li ul li>a{
  background:transparent !important;
  background-image:none !important;
  border:0 !important;
  color:#fff !important;
}
html body.home-layout-modern #mainNavigation .menu-sub li>a:hover,
html body.home-layout-modern #mainNavigation .sf-menu li ul li>a:hover{
  background:rgba(255,255,255,.13) !important;
  color:#fff5cf !important;
}

/* Category/Article hero */
body.home-layout-modern .page-hero{
  position:relative;
  overflow:hidden;
  margin:16px 0 14px !important;
  padding:20px 22px !important;
  border:1px solid #d6e5ed !important;
  border-radius:12px !important;
  background:
    radial-gradient(circle at 88% 10%,rgba(22,166,182,.17),transparent 28%),
    linear-gradient(110deg,#eef5fb 0%,#eef9f7 72%,#fff9eb 100%) !important;
  box-shadow:0 8px 24px rgba(18,59,102,.07) !important;
}
body.home-layout-modern .page-hero:before{
  content:"";
  position:absolute;left:0;top:0;bottom:0;width:5px;
  background:linear-gradient(180deg,var(--inner-blue),var(--inner-cyan),var(--inner-teal));
}
body.home-layout-modern .page-hero h1,
body.home-layout-modern .page-hero h2{
  color:var(--inner-primary) !important;
  margin-top:0 !important;
}
body.home-layout-modern .page-hero p,
body.home-layout-modern .page-hero-date{
  color:var(--inner-muted) !important;
}

/* Category list cards */
body.home-layout-modern .list-item-modern{
  background:linear-gradient(145deg,#fff,#f8fbfd) !important;
  border:1px solid var(--inner-line) !important;
  border-radius:12px !important;
  box-shadow:0 7px 22px rgba(18,59,102,.065) !important;
  overflow:hidden !important;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
body.home-layout-modern .list-item-modern:hover{
  transform:translateY(-2px);
  border-color:#b9d9e2 !important;
  box-shadow:0 13px 30px rgba(18,59,102,.11) !important;
}
body.home-layout-modern .list-item-modern h3 a{
  color:var(--inner-primary) !important;
  text-decoration:none !important;
}
body.home-layout-modern .list-item-modern h3 a:hover{color:var(--inner-blue) !important}
body.home-layout-modern .list-item-modern p,
body.home-layout-modern .content-date-meta{color:var(--inner-muted) !important}
body.home-layout-modern .list-item-modern .chip,
body.home-layout-modern .chip-doc-type{
  background:#e9f7f5 !important;
  color:#14766f !important;
  border-color:#c9e8e3 !important;
}
body.home-layout-modern .btn-modern{
  background:linear-gradient(105deg,var(--inner-blue),var(--inner-teal)) !important;
  border-color:transparent !important;
  color:#fff !important;
  box-shadow:0 6px 15px rgba(23,105,170,.14) !important;
}
body.home-layout-modern .btn-modern:hover{filter:brightness(1.04)}
body.home-layout-modern .btn-modern-outline{
  background:#fff !important;
  color:var(--inner-blue) !important;
  border:1px solid #bdd3e2 !important;
  box-shadow:none !important;
}

/* Article */
body.home-layout-modern .article-content{
  background:linear-gradient(145deg,#fff 0%,#fbfdfe 100%) !important;
  border:1px solid var(--inner-line) !important;
  border-radius:12px !important;
  box-shadow:0 8px 25px rgba(18,59,102,.065) !important;
  color:#263f55 !important;
}
body.home-layout-modern .article-content h1,
body.home-layout-modern .article-content h2,
body.home-layout-modern .article-content h3,
body.home-layout-modern .article-content h4{
  color:var(--inner-primary) !important;
}
body.home-layout-modern .article-content a{color:var(--inner-blue)}
body.home-layout-modern .article-content .meta{
  color:var(--inner-muted) !important;
  border-left:3px solid var(--inner-cyan);
  background:#f1f8fa;
  padding:10px 12px;
  border-radius:0 8px 8px 0;
}
body.home-layout-modern .article-content img,
body.home-layout-modern .article-content iframe{
  border-radius:10px !important;
  box-shadow:0 5px 18px rgba(18,59,102,.08);
}
body.home-layout-modern .article-content blockquote{
  border-left:4px solid var(--inner-teal);
  background:#eef8f6;
  color:#315d59;
  padding:12px 16px;
  border-radius:0 8px 8px 0;
}

/* Pagination / documents / side modules */
body.home-layout-modern .modern-pagination .page-number,
body.home-layout-modern .modern-pagination .page-nav{
  background:#fff !important;
  border:1px solid #d4e3ec !important;
  color:var(--inner-primary) !important;
}
body.home-layout-modern .modern-pagination .page-number.active,
body.home-layout-modern .modern-pagination a:hover{
  background:linear-gradient(105deg,var(--inner-blue),var(--inner-teal)) !important;
  border-color:transparent !important;
  color:#fff !important;
}
body.home-layout-modern .doc-card-modern,
body.home-layout-modern .side-latest-box,
body.home-layout-modern .menu-bottom-wrap{
  background:linear-gradient(145deg,#fff,#f6fafc) !important;
  border:1px solid var(--inner-line) !important;
  border-radius:11px !important;
  box-shadow:0 7px 20px rgba(18,59,102,.06) !important;
}
body.home-layout-modern .empty-state{
  background:#f5fafb !important;
  border:1px dashed #bcdce1 !important;
  color:var(--inner-muted) !important;
}

/* Footer keeps same family */
body.home-layout-modern .footer-main{
  background:linear-gradient(125deg,#102f52,#145b83 52%,#167b77 100%) !important;
  border-top:2px solid rgba(229,184,92,.75) !important;
}

/* ================================================================
   RAIL TRANSPORT — INNER PAGES
   ================================================================ */
body.home-layout-transport{
  --inner-primary:#103d78;
  --inner-blue:#1268b9;
  --inner-cyan:#10a2b6;
  --inner-teal:#16877f;
  --inner-orange:#ef7540;
  --inner-yellow:#efbf4f;
  --inner-ink:#173f68;
  --inner-muted:#6d8193;
  --inner-line:#d7e5f0;
  background:linear-gradient(180deg,#eef6fb 0%,#f8fbfd 45%,#f1f9f7 100%) !important;
}

html body.home-layout-transport #mainNavigation.main-menu-wrap{
  background:#103d78 !important;
  background-image:linear-gradient(100deg,#103d78 0%,#1268b9 47%,#10a2b6 75%,#16877f 100%) !important;
  border:0 !important;
  border-bottom:3px solid var(--inner-orange) !important;
  box-shadow:0 7px 20px rgba(16,61,120,.17) !important;
}
html body.home-layout-transport #mainNavigation .main-menu-shell,
html body.home-layout-transport #mainNavigation .primary-menu-host,
html body.home-layout-transport #mainNavigation .menu,
html body.home-layout-transport #mainNavigation .menu-root,
html body.home-layout-transport #mainNavigation .sf-menu,
html body.home-layout-transport #mainNavigation .menu-root>li,
html body.home-layout-transport #mainNavigation .sf-menu>li,
html body.home-layout-transport #mainNavigation .menu-root>li>a,
html body.home-layout-transport #mainNavigation .sf-menu>li>a,
html body.home-layout-transport #mainNavigation .menu-home-link{
  background:transparent !important;
  background-image:none !important;
  border:0 !important;
  color:#fff !important;
  box-shadow:none !important;
}
html body.home-layout-transport #mainNavigation .menu-root>li:hover>a,
html body.home-layout-transport #mainNavigation .sf-menu>li:hover>a,
html body.home-layout-transport #mainNavigation .menu-root>li.active>a{
  background:rgba(255,255,255,.14) !important;
  box-shadow:inset 0 -2px 0 var(--inner-yellow) !important;
}
html body.home-layout-transport #mainNavigation .menu-sub,
html body.home-layout-transport #mainNavigation li>ul,
html body.home-layout-transport #mainNavigation .sf-menu li ul{
  background:linear-gradient(145deg,#103d78,#1268b9 58%,#108d96) !important;
  border:1px solid rgba(255,255,255,.16) !important;
  border-radius:5px !important;
  padding:5px !important;
  box-shadow:0 12px 28px rgba(16,61,120,.22) !important;
}
html body.home-layout-transport #mainNavigation .menu-sub li,
html body.home-layout-transport #mainNavigation .sf-menu li ul li,
html body.home-layout-transport #mainNavigation .menu-sub li>a,
html body.home-layout-transport #mainNavigation .sf-menu li ul li>a{
  background:transparent !important;
  background-image:none !important;
  border:0 !important;
  color:#fff !important;
}
html body.home-layout-transport #mainNavigation .menu-sub li>a:hover,
html body.home-layout-transport #mainNavigation .sf-menu li ul li>a:hover{
  background:rgba(255,255,255,.13) !important;
  color:#fff2cb !important;
}

body.home-layout-transport .page-hero{
  position:relative;
  overflow:hidden;
  margin:16px 0 14px !important;
  padding:20px 22px !important;
  border:1px solid #d5e4ee !important;
  border-radius:9px !important;
  background:
    radial-gradient(circle at 90% 8%,rgba(16,162,182,.15),transparent 28%),
    linear-gradient(105deg,#eaf3fc 0%,#edf9fa 68%,#fff6e8 100%) !important;
  box-shadow:0 8px 22px rgba(16,61,120,.07) !important;
}
body.home-layout-transport .page-hero:before{
  content:"";
  position:absolute;left:0;top:0;bottom:0;width:5px;
  background:linear-gradient(180deg,var(--inner-blue),var(--inner-cyan),var(--inner-orange));
}
body.home-layout-transport .page-hero:after{
  content:"";
  position:absolute;left:22px;right:22px;bottom:0;height:2px;
  background:linear-gradient(90deg,var(--inner-orange),var(--inner-yellow),transparent 68%);
}
body.home-layout-transport .page-hero h1,
body.home-layout-transport .page-hero h2{
  color:var(--inner-primary) !important;
  margin-top:0 !important;
}
body.home-layout-transport .page-hero p,
body.home-layout-transport .page-hero-date{color:var(--inner-muted) !important}

body.home-layout-transport .list-item-modern{
  background:linear-gradient(145deg,#fff,#f6fafe) !important;
  border:1px solid var(--inner-line) !important;
  border-left:4px solid var(--inner-blue) !important;
  border-radius:9px !important;
  box-shadow:0 7px 20px rgba(16,61,120,.06) !important;
  overflow:hidden !important;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
body.home-layout-transport .list-item-modern:nth-of-type(even){border-left-color:var(--inner-cyan) !important}
body.home-layout-transport .list-item-modern:hover{
  transform:translateY(-2px);
  border-color:#b5d6e1 !important;
  border-left-color:var(--inner-orange) !important;
  box-shadow:0 13px 28px rgba(16,61,120,.105) !important;
}
body.home-layout-transport .list-item-modern h3 a{color:var(--inner-primary) !important;text-decoration:none !important}
body.home-layout-transport .list-item-modern h3 a:hover{color:var(--inner-blue) !important}
body.home-layout-transport .list-item-modern p,
body.home-layout-transport .content-date-meta{color:var(--inner-muted) !important}
body.home-layout-transport .list-item-modern .chip,
body.home-layout-transport .chip-doc-type{
  background:#e8f7f8 !important;
  color:#116f7b !important;
  border-color:#c7e8eb !important;
}
body.home-layout-transport .btn-modern{
  background:linear-gradient(105deg,var(--inner-blue),var(--inner-cyan)) !important;
  border-color:transparent !important;
  color:#fff !important;
  box-shadow:0 6px 15px rgba(18,104,185,.14) !important;
}
body.home-layout-transport .btn-modern-outline{
  background:#fff !important;
  color:var(--inner-blue) !important;
  border:1px solid #bad2e2 !important;
  box-shadow:none !important;
}

body.home-layout-transport .article-content{
  background:linear-gradient(145deg,#fff,#f9fcfe) !important;
  border:1px solid var(--inner-line) !important;
  border-top:3px solid var(--inner-blue) !important;
  border-radius:9px !important;
  box-shadow:0 8px 24px rgba(16,61,120,.065) !important;
  color:#27465f !important;
}
body.home-layout-transport .article-content h1,
body.home-layout-transport .article-content h2,
body.home-layout-transport .article-content h3,
body.home-layout-transport .article-content h4{color:var(--inner-primary) !important}
body.home-layout-transport .article-content a{color:var(--inner-blue)}
body.home-layout-transport .article-content .meta{
  color:var(--inner-muted) !important;
  border-left:3px solid var(--inner-orange);
  background:#fff7f1;
  padding:10px 12px;
  border-radius:0 7px 7px 0;
}
body.home-layout-transport .article-content img,
body.home-layout-transport .article-content iframe{
  border-radius:8px !important;
  box-shadow:0 5px 17px rgba(16,61,120,.08);
}
body.home-layout-transport .article-content blockquote{
  border-left:4px solid var(--inner-orange);
  background:#fff6ef;
  color:#6e4a35;
  padding:12px 16px;
  border-radius:0 7px 7px 0;
}

body.home-layout-transport .modern-pagination .page-number,
body.home-layout-transport .modern-pagination .page-nav{
  background:#fff !important;
  border:1px solid #d3e2ec !important;
  color:var(--inner-primary) !important;
}
body.home-layout-transport .modern-pagination .page-number.active,
body.home-layout-transport .modern-pagination a:hover{
  background:linear-gradient(105deg,var(--inner-blue),var(--inner-cyan)) !important;
  border-color:transparent !important;
  color:#fff !important;
}
body.home-layout-transport .doc-card-modern,
body.home-layout-transport .side-latest-box,
body.home-layout-transport .menu-bottom-wrap{
  background:linear-gradient(145deg,#fff,#f4f9fc) !important;
  border:1px solid var(--inner-line) !important;
  border-radius:9px !important;
  box-shadow:0 7px 20px rgba(16,61,120,.06) !important;
}
body.home-layout-transport .empty-state{
  background:#f3f9fb !important;
  border:1px dashed #b8dae2 !important;
  color:var(--inner-muted) !important;
}
body.home-layout-transport .footer-main{
  background:linear-gradient(125deg,#10366d,#125597 47%,#117a99 74%,#137d76 100%) !important;
  border-top:3px solid var(--inner-orange) !important;
}

/* responsive inner pages */
@media(max-width:767px){
  body.home-layout-modern .page-hero,
  body.home-layout-transport .page-hero{padding:15px 16px !important;border-radius:8px !important}
  body.home-layout-modern .article-content,
  body.home-layout-transport .article-content{border-radius:8px !important}
}


/* ================================================================
   MECHANICAL / FOUNDRY — INNER PAGES
   Đồng bộ nhận diện IndexMechanical -> /chuyen-muc/{id} -> /bai-viet/{id}
   ================================================================ */
body.home-layout-mechanical{
  --inner-primary:#263238;
  --inner-blue:#37474f;
  --inner-cyan:#607d8b;
  --inner-teal:#455a64;
  --inner-gold:#d79a35;
  --inner-ink:#202a30;
  --inner-muted:#66747c;
  --inner-line:#d8dee1;
  background:linear-gradient(180deg,#eef2f3 0%,#f7f8f8 38%,#f2f4f4 100%) !important;
}
body.home-layout-mechanical main.site-shell{background:transparent !important;}
html body.home-layout-mechanical #mainNavigation.main-menu-wrap{
  background:#263238 !important;
  background-image:linear-gradient(100deg,#20292e 0%,#35434a 52%,#6f5424 100%) !important;
  border:0 !important;border-bottom:3px solid #d79a35 !important;
  box-shadow:0 7px 20px rgba(25,34,39,.18) !important;
}
html body.home-layout-mechanical #mainNavigation .main-menu-shell,
html body.home-layout-mechanical #mainNavigation .primary-menu-host,
html body.home-layout-mechanical #mainNavigation .menu,
html body.home-layout-mechanical #mainNavigation .menu-root{background:transparent !important;}
html body.home-layout-mechanical #mainNavigation .menu > li > a{color:#fff !important;font-weight:700 !important;}
html body.home-layout-mechanical #mainNavigation .menu > li:hover > a,
html body.home-layout-mechanical #mainNavigation .menu > li.active > a{background:rgba(215,154,53,.2) !important;color:#ffd993 !important;}
html body.home-layout-mechanical #mainNavigation .menu ul{
  background:#fff !important;border:1px solid #d6dde0 !important;border-top:3px solid #d79a35 !important;
  box-shadow:0 14px 35px rgba(32,42,48,.18) !important;
}
html body.home-layout-mechanical #mainNavigation .menu ul a{color:#263238 !important;background:#fff !important;}
html body.home-layout-mechanical #mainNavigation .menu ul a:hover{color:#9a6416 !important;background:#f8f1e5 !important;}
body.home-layout-mechanical .page-hero{
  background:linear-gradient(120deg,#263238 0%,#40515a 68%,#8a6426 100%) !important;
  color:#fff !important;border:0 !important;border-left:5px solid #d79a35 !important;
  box-shadow:0 12px 28px rgba(38,50,56,.15) !important;
}
body.home-layout-mechanical .page-hero h1,
body.home-layout-mechanical .page-hero h2,
body.home-layout-mechanical .page-hero .page-title{color:#fff !important;}
body.home-layout-mechanical .breadcrumb a{color:#9a6416 !important;}
body.home-layout-mechanical .list-item-modern,
body.home-layout-mechanical .article-content,
body.home-layout-mechanical .doc-card-modern,
body.home-layout-mechanical .empty-state{
  background:#fff !important;border:1px solid #d8dee1 !important;border-radius:12px !important;
  box-shadow:0 5px 18px rgba(38,50,56,.07) !important;box-sizing:border-box !important;
}
body.home-layout-mechanical .list-item-modern:hover{border-color:#d79a35 !important;box-shadow:0 10px 26px rgba(38,50,56,.12) !important;}
body.home-layout-mechanical .list-item-modern h2 a,
body.home-layout-mechanical .list-item-modern h3 a,
body.home-layout-mechanical .article-content h1,
body.home-layout-mechanical .article-content h2,
body.home-layout-mechanical .article-content h3{color:#263238 !important;}
body.home-layout-mechanical .list-item-modern h2 a:hover,
body.home-layout-mechanical .list-item-modern h3 a:hover{color:#a86d16 !important;}
body.home-layout-mechanical .article-content{border-top:4px solid #d79a35 !important;}
body.home-layout-mechanical .article-content blockquote{border-left:4px solid #d79a35 !important;background:#faf5eb !important;}
body.home-layout-mechanical .pagination a.active,
body.home-layout-mechanical .pagination .active,
body.home-layout-mechanical .btn-primary{background:#37474f !important;border-color:#37474f !important;color:#fff !important;}
body.home-layout-mechanical footer.site-footer{
  background:linear-gradient(180deg,#263238 0%,#20292e 100%) !important;
  border-top:4px solid #d79a35 !important;
}
@media (max-width: 900px){
  body.home-layout-mechanical .page-hero{border-left-width:4px !important;border-radius:10px !important;}
}

/* =====================================================================
   10/08/2026 FINAL MECHANICAL THEME UNIFICATION
   Cùng một nhận diện cho Home -> /chuyen-muc/{id} -> /bai-viet/{id}
   Palette: Graphite + Steel + Brass
   ===================================================================== */
body.home-layout-mechanical,
body.mechanical-theme-active{
  --mc-charcoal:#202a30;
  --mc-steel:#37474f;
  --mc-slate:#607d8b;
  --mc-brass:#d79a35;
  --mc-brass-dark:#9a6416;
  --mc-brass-soft:#ffe3ad;
  --mc-bg:#f3f5f5;
  --mc-surface:#ffffff;
  --mc-line:#d7dee1;
  --mc-text:#202a30;
  --mc-muted:#66747c;
  background:linear-gradient(180deg,#edf1f2 0%,#f7f8f8 360px,#f3f5f5 100%) !important;
  color:var(--mc-text) !important;
}
html body.home-layout-mechanical #mainNavigation.main-menu-wrap,
html body.mechanical-theme-active #mainNavigation.main-menu-wrap{
  background:#202a30 !important;
  background-image:linear-gradient(100deg,#1f292e 0%,#34434a 55%,#5f4a26 100%) !important;
  border:0 !important;
  border-bottom:3px solid var(--mc-brass) !important;
  box-shadow:0 8px 22px rgba(31,41,46,.22) !important;
  overflow:visible !important;
}
html body.home-layout-mechanical #mainNavigation .main-menu-shell,
html body.home-layout-mechanical #mainNavigation .primary-menu-host,
html body.home-layout-mechanical #mainNavigation .menu-root,
html body.home-layout-mechanical #mainNavigation .menu-root > li,
html body.mechanical-theme-active #mainNavigation .main-menu-shell,
html body.mechanical-theme-active #mainNavigation .primary-menu-host,
html body.mechanical-theme-active #mainNavigation .menu-root,
html body.mechanical-theme-active #mainNavigation .menu-root > li{
  background:transparent !important;background-image:none !important;border:0 !important;box-shadow:none !important;
}
html body.home-layout-mechanical #mainNavigation .menu-root > li > a,
html body.home-layout-mechanical #mainNavigation .menu-home-link,
html body.mechanical-theme-active #mainNavigation .menu-root > li > a,
html body.mechanical-theme-active #mainNavigation .menu-home-link{
  background:transparent !important;color:#fff !important;border:0 !important;box-shadow:none !important;text-shadow:none !important;
}
html body.home-layout-mechanical #mainNavigation .menu-root > li:hover > a,
html body.home-layout-mechanical #mainNavigation .menu-root > li:focus-within > a,
html body.home-layout-mechanical #mainNavigation .menu-root > li.active > a,
html body.home-layout-mechanical #mainNavigation .menu-root > li.current > a,
html body.mechanical-theme-active #mainNavigation .menu-root > li:hover > a,
html body.mechanical-theme-active #mainNavigation .menu-root > li:focus-within > a,
html body.mechanical-theme-active #mainNavigation .menu-root > li.active > a,
html body.mechanical-theme-active #mainNavigation .menu-root > li.current > a{
  background:rgba(215,154,53,.18) !important;color:var(--mc-brass-soft) !important;box-shadow:inset 0 -3px 0 var(--mc-brass) !important;
}
html body.home-layout-mechanical #mainNavigation .menu-sub,
html body.home-layout-mechanical #mainNavigation .menu-root li > ul,
html body.mechanical-theme-active #mainNavigation .menu-sub,
html body.mechanical-theme-active #mainNavigation .menu-root li > ul{
  background:#2b383e !important;
  background-image:linear-gradient(145deg,#28343a 0%,#37474f 66%,#493d29 100%) !important;
  border:1px solid rgba(215,154,53,.42) !important;border-top:3px solid var(--mc-brass) !important;
  border-radius:7px !important;padding:5px !important;box-shadow:0 15px 34px rgba(24,32,36,.28) !important;
}
html body.home-layout-mechanical #mainNavigation .menu-sub li,
html body.home-layout-mechanical #mainNavigation .menu-root li > ul > li,
html body.mechanical-theme-active #mainNavigation .menu-sub li,
html body.mechanical-theme-active #mainNavigation .menu-root li > ul > li{
  background:transparent !important;border:0 !important;
}
html body.home-layout-mechanical #mainNavigation .menu-sub li > a,
html body.home-layout-mechanical #mainNavigation .menu-root li > ul li > a,
html body.mechanical-theme-active #mainNavigation .menu-sub li > a,
html body.mechanical-theme-active #mainNavigation .menu-root li > ul li > a{
  background:transparent !important;color:#f8fafc !important;border:0 !important;border-radius:4px !important;box-shadow:none !important;
}
html body.home-layout-mechanical #mainNavigation .menu-sub li > a:hover,
html body.home-layout-mechanical #mainNavigation .menu-sub li > a:focus,
html body.home-layout-mechanical #mainNavigation .menu-root li > ul li:hover > a,
html body.home-layout-mechanical #mainNavigation .menu-root li > ul li:focus-within > a,
html body.mechanical-theme-active #mainNavigation .menu-sub li > a:hover,
html body.mechanical-theme-active #mainNavigation .menu-sub li > a:focus,
html body.mechanical-theme-active #mainNavigation .menu-root li > ul li:hover > a,
html body.mechanical-theme-active #mainNavigation .menu-root li > ul li:focus-within > a{
  background:rgba(215,154,53,.16) !important;color:#ffe3ad !important;box-shadow:inset 3px 0 0 var(--mc-brass) !important;
}
body.home-layout-mechanical .page-hero,
body.mechanical-theme-active .page-hero{
  background:linear-gradient(118deg,#202a30 0%,#3a4a52 68%,#715529 100%) !important;
  color:#fff !important;border:0 !important;border-left:5px solid var(--mc-brass) !important;
  box-shadow:0 12px 28px rgba(31,41,46,.15) !important;
}
body.home-layout-mechanical .page-hero h1,
body.home-layout-mechanical .page-hero h2,
body.home-layout-mechanical .page-hero .page-title,
body.mechanical-theme-active .page-hero h1,
body.mechanical-theme-active .page-hero h2,
body.mechanical-theme-active .page-hero .page-title{color:#fff !important;}
body.home-layout-mechanical .page-hero-date,
body.mechanical-theme-active .page-hero-date{color:#e2e8ea !important;}
body.home-layout-mechanical .breadcrumb,
body.mechanical-theme-active .breadcrumb{color:#66747c !important;}
body.home-layout-mechanical .breadcrumb a,
body.mechanical-theme-active .breadcrumb a{color:var(--mc-brass-dark) !important;font-weight:700 !important;}
body.home-layout-mechanical .breadcrumb a:hover,
body.mechanical-theme-active .breadcrumb a:hover{color:#7b4f12 !important;}
body.home-layout-mechanical .list-item-modern,
body.home-layout-mechanical .article-content,
body.home-layout-mechanical .doc-card-modern,
body.home-layout-mechanical .empty-state,
body.mechanical-theme-active .list-item-modern,
body.mechanical-theme-active .article-content,
body.mechanical-theme-active .doc-card-modern,
body.mechanical-theme-active .empty-state{
  background:#fff !important;border:1px solid var(--mc-line) !important;border-radius:12px !important;
  box-shadow:0 5px 18px rgba(31,41,46,.07) !important;
}
body.home-layout-mechanical .list-item-modern:hover,
body.mechanical-theme-active .list-item-modern:hover{
  border-color:var(--mc-brass) !important;box-shadow:0 10px 26px rgba(31,41,46,.12) !important;
}
body.home-layout-mechanical .list-item-modern h2 a,
body.home-layout-mechanical .list-item-modern h3 a,
body.home-layout-mechanical .article-content h1,
body.home-layout-mechanical .article-content h2,
body.home-layout-mechanical .article-content h3,
body.mechanical-theme-active .list-item-modern h2 a,
body.mechanical-theme-active .list-item-modern h3 a,
body.mechanical-theme-active .article-content h1,
body.mechanical-theme-active .article-content h2,
body.mechanical-theme-active .article-content h3{color:var(--mc-charcoal) !important;}
body.home-layout-mechanical .list-item-modern h2 a:hover,
body.home-layout-mechanical .list-item-modern h3 a:hover,
body.mechanical-theme-active .list-item-modern h2 a:hover,
body.mechanical-theme-active .list-item-modern h3 a:hover{color:var(--mc-brass-dark) !important;}
body.home-layout-mechanical .article-content,
body.mechanical-theme-active .article-content{border-top:4px solid var(--mc-brass) !important;}
body.home-layout-mechanical .article-content a,
body.mechanical-theme-active .article-content a{color:#8b5a16 !important;}
body.home-layout-mechanical .article-content blockquote,
body.mechanical-theme-active .article-content blockquote{border-left:4px solid var(--mc-brass) !important;background:#faf5eb !important;}
body.home-layout-mechanical .pagination a.active,
body.home-layout-mechanical .pagination .active,
body.home-layout-mechanical .btn-primary,
body.mechanical-theme-active .pagination a.active,
body.mechanical-theme-active .pagination .active,
body.mechanical-theme-active .btn-primary{
  background:var(--mc-steel) !important;border-color:var(--mc-steel) !important;color:#fff !important;
}
body.home-layout-mechanical .pagination a:hover,
body.mechanical-theme-active .pagination a:hover{border-color:var(--mc-brass) !important;color:var(--mc-brass-dark) !important;}
body.home-layout-mechanical .footer-main,
body.mechanical-theme-active .footer-main{
  background:#202a30 !important;
  background-image:linear-gradient(180deg,#27343a 0%,#1d262b 100%) !important;
  border-top:4px solid var(--mc-brass) !important;
  color:#eef2f3 !important;
}
body.home-layout-mechanical .footer-main a,
body.mechanical-theme-active .footer-main a{color:#f6dfb2 !important;}
body.home-layout-mechanical .footer-main a:hover,
body.mechanical-theme-active .footer-main a:hover{color:#fff !important;}
@media(max-width:860px){
  html body.home-layout-mechanical #mainNavigation .primary-menu-host,
  html body.home-layout-mechanical #mainNavigation .menu-root,
  html body.mechanical-theme-active #mainNavigation .primary-menu-host,
  html body.mechanical-theme-active #mainNavigation .menu-root{background:#202a30 !important;}
  html body.home-layout-mechanical #mainNavigation .menu-root > li > a,
  html body.mechanical-theme-active #mainNavigation .menu-root > li > a{border-bottom:1px solid rgba(255,255,255,.09) !important;}
  html body.home-layout-mechanical #mainNavigation .menu-root li.open > a,
  html body.mechanical-theme-active #mainNavigation .menu-root li.open > a{background:rgba(215,154,53,.17) !important;color:#ffe3ad !important;}
  html body.home-layout-mechanical #mainNavigation .menu-root li > ul,
  html body.home-layout-mechanical #mainNavigation .menu-sub,
  html body.mechanical-theme-active #mainNavigation .menu-root li > ul,
  html body.mechanical-theme-active #mainNavigation .menu-sub{
    background:#2d3a40 !important;background-image:none !important;border:0 !important;border-left:3px solid var(--mc-brass) !important;
    border-radius:0 !important;box-shadow:none !important;margin:0 !important;
  }
  body.home-layout-mechanical .page-hero,
  body.mechanical-theme-active .page-hero{border-left-width:4px !important;border-radius:10px !important;}
}

/* =========================================================
   MECHANICAL FOOTER - SINGLE SOURCE OF TRUTH 2026-08-10
   Đồng bộ Trang chủ + /chuyen-muc/{id} + /bai-viet/{id}
   Palette: Graphite / Steel / Brass
   ========================================================= */
body.home-layout-mechanical .footer-main,
body.mechanical-theme-active .footer-main{
  background:#202a30 !important;
  background-image:linear-gradient(135deg,#1f292e 0%,#2f3d43 58%,#4b3d25 100%) !important;
  border-top:4px solid #d79a35 !important;
  color:#eef2f3 !important;
  box-shadow:0 -8px 24px rgba(31,41,46,.18) !important;
}
body.home-layout-mechanical .footer-main > .site-shell.footer-cols,
body.mechanical-theme-active .footer-main > .site-shell.footer-cols{
  background:transparent !important;
}
body.home-layout-mechanical .footer-box,
body.mechanical-theme-active .footer-box{
  background:rgba(255,255,255,.045) !important;
  border:1px solid rgba(215,154,53,.24) !important;
  border-radius:8px !important;
  color:#e7ecee !important;
  box-shadow:none !important;
}
body.home-layout-mechanical .footer-box h1,
body.home-layout-mechanical .footer-box h2,
body.home-layout-mechanical .footer-box h3,
body.home-layout-mechanical .footer-box h4,
body.home-layout-mechanical .footer-box strong,
body.mechanical-theme-active .footer-box h1,
body.mechanical-theme-active .footer-box h2,
body.mechanical-theme-active .footer-box h3,
body.mechanical-theme-active .footer-box h4,
body.mechanical-theme-active .footer-box strong{
  color:#ffe3ad !important;
}
body.home-layout-mechanical .footer-box,
body.home-layout-mechanical .footer-box p,
body.home-layout-mechanical .footer-box div,
body.home-layout-mechanical .footer-box span,
body.home-layout-mechanical .footer-box li,
body.mechanical-theme-active .footer-box,
body.mechanical-theme-active .footer-box p,
body.mechanical-theme-active .footer-box div,
body.mechanical-theme-active .footer-box span,
body.mechanical-theme-active .footer-box li{
  color:#e7ecee !important;
}
body.home-layout-mechanical .footer-main a,
body.mechanical-theme-active .footer-main a{
  color:#f6dfb2 !important;
  text-decoration:none !important;
}
body.home-layout-mechanical .footer-main a:hover,
body.home-layout-mechanical .footer-main a:focus,
body.mechanical-theme-active .footer-main a:hover,
body.mechanical-theme-active .footer-main a:focus{
  color:#ffffff !important;
  text-decoration:underline !important;
  text-decoration-color:#d79a35 !important;
  text-underline-offset:3px !important;
}
body.home-layout-mechanical .footer-logo-item,
body.mechanical-theme-active .footer-logo-item{
  background:rgba(255,255,255,.07) !important;
  border:1px solid rgba(215,154,53,.22) !important;
  border-radius:7px !important;
}
body.home-layout-mechanical .footer-logo-item:hover,
body.mechanical-theme-active .footer-logo-item:hover{
  background:rgba(215,154,53,.12) !important;
  border-color:rgba(215,154,53,.55) !important;
}



/* TRANSPORT FOOTER UNIFIED CONTRAST 2026
   One palette for Home + /chuyen-muc/{id} + /bai-viet/{id}.
   Matches the rail-blue / teal horizontal navigation. */
body.home-layout-transport .footer-main,
body.transport-theme-active .footer-main{
    background:linear-gradient(125deg,#0b2f5b 0%,#0e4779 48%,#0b5f70 76%,#0b625b 100%) !important;
    color:#f4f8fb !important;
    border-top:4px solid #f2a23a !important;
    box-shadow:0 -8px 24px rgba(8,35,66,.18) !important;
}
body.home-layout-transport .footer-main .footer-box,
body.transport-theme-active .footer-main .footer-box{
    background:rgba(4,25,48,.28) !important;
    border:1px solid rgba(255,255,255,.20) !important;
    border-radius:10px !important;
    color:#f4f8fb !important;
}
body.home-layout-transport .footer-main h1,
body.home-layout-transport .footer-main h2,
body.home-layout-transport .footer-main h3,
body.home-layout-transport .footer-main h4,
body.home-layout-transport .footer-main h5,
body.home-layout-transport .footer-main h6,
body.home-layout-transport .footer-main .footer-title,
body.transport-theme-active .footer-main h1,
body.transport-theme-active .footer-main h2,
body.transport-theme-active .footer-main h3,
body.transport-theme-active .footer-main h4,
body.transport-theme-active .footer-main h5,
body.transport-theme-active .footer-main h6,
body.transport-theme-active .footer-main .footer-title{
    color:#ffd38a !important;
    text-shadow:0 1px 1px rgba(0,0,0,.22) !important;
}
body.home-layout-transport .footer-main p,
body.home-layout-transport .footer-main span,
body.home-layout-transport .footer-main li,
body.home-layout-transport .footer-main address,
body.home-layout-transport .footer-main small,
body.transport-theme-active .footer-main p,
body.transport-theme-active .footer-main span,
body.transport-theme-active .footer-main li,
body.transport-theme-active .footer-main address,
body.transport-theme-active .footer-main small{
    color:#eef5f8 !important;
}
body.home-layout-transport .footer-main a,
body.home-layout-transport .footer-main a:visited,
body.transport-theme-active .footer-main a,
body.transport-theme-active .footer-main a:visited{
    color:#fff0c9 !important;
    text-decoration-color:rgba(255,211,138,.65) !important;
}
body.home-layout-transport .footer-main a:hover,
body.home-layout-transport .footer-main a:focus-visible,
body.transport-theme-active .footer-main a:hover,
body.transport-theme-active .footer-main a:focus-visible{
    color:#ffffff !important;
    text-decoration:underline !important;
    text-decoration-color:#f2a23a !important;
}
body.home-layout-transport .footer-main i,
body.home-layout-transport .footer-main .fa,
body.home-layout-transport .footer-main .fa-solid,
body.home-layout-transport .footer-main .fa-regular,
body.transport-theme-active .footer-main i,
body.transport-theme-active .footer-main .fa,
body.transport-theme-active .footer-main .fa-solid,
body.transport-theme-active .footer-main .fa-regular{
    color:#ffc766 !important;
}
body.home-layout-transport .footer-main hr,
body.transport-theme-active .footer-main hr{
    border-color:rgba(255,211,138,.35) !important;
}