/* =========================================================
   CN16 FRONTEND SYNC + UI STABILITY
   - Trang chủ là chuẩn cho global chrome.
   - Khoá header/menu/hotline giống nhau giữa Home + inner pages.
   - Giữ Bootstrap Icons đúng font glyph, tránh bị font site ghi đè.
   - Không can thiệp nội dung / SEO copy / money-page body.
   ========================================================= */

/* 1) Bootstrap Icons guard: các page dùng .bi phải luôn render glyph đúng. */
.bi,
i.bi,
span.bi{
  display:inline-block;
  line-height:1;
  vertical-align:-.125em;
  font-style:normal!important;
}
.bi::before,
i.bi::before,
span.bi::before{
  font-family:"bootstrap-icons"!important;
  font-style:normal!important;
  font-weight:normal!important;
  font-variant:normal!important;
  text-transform:none!important;
  line-height:1!important;
  speak:never;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* Không cho các rule palette cũ biến icon Bootstrap thành ô nền rỗng. */
.taxi-service-site i.bi,
.txs-body i.bi,
.taxi-service-site .bi,
.txs-body .bi{
  background-image:none;
  text-indent:0;
  overflow:visible;
}

/* 2) Global header chrome: một chuẩn cho Home + inner pages. */
.taxi-service-site .cn-contact-header,
.txs-body .cn-contact-header{
  width:100%;
  background:#fff;
  border-bottom:1px solid #e6edf3;
  box-shadow:0 1px 0 rgba(15,34,54,.02);
}
.taxi-service-site .cn-contact-header .txs-vf-navbar,
.txs-body .cn-contact-header .txs-vf-navbar{
  background:#fff!important;
}
.taxi-service-site .cn-contact-header .txs-vf-shell,
.txs-body .cn-contact-header .txs-vf-shell{
  box-sizing:border-box;
}
.taxi-service-site .cn-contact-header .txs-vf-brand,
.taxi-service-site .cn-contact-header .txs-vf-desktop-menu a,
.taxi-service-site .cn-contact-header .txs-vf-hotline,
.txs-body .cn-contact-header .txs-vf-brand,
.txs-body .cn-contact-header .txs-vf-desktop-menu a,
.txs-body .cn-contact-header .txs-vf-hotline{
  text-decoration:none!important;
}

/* Active/hover menu thống nhất, không để Bootstrap/legacy page đổi màu. */
@media (min-width:992px){
  .taxi-service-site .cn-contact-header .txs-vf-desktop-menu>ul,
  .txs-body .cn-contact-header .txs-vf-desktop-menu>ul{
    margin:0!important;
    padding:0!important;
    align-items:center!important;
  }
  .taxi-service-site .cn-contact-header .txs-vf-desktop-menu>ul>li>a,
  .txs-body .cn-contact-header .txs-vf-desktop-menu>ul>li>a{
    min-height:72px!important;
    display:inline-flex!important;
    align-items:center!important;
    color:#14263a!important;
    font-weight:700!important;
  }
  .taxi-service-site .cn-contact-header .txs-vf-desktop-menu>ul>li>a:hover,
  .taxi-service-site .cn-contact-header .txs-vf-desktop-menu>ul>li>a:focus-visible,
  .txs-body .cn-contact-header .txs-vf-desktop-menu>ul>li>a:hover,
  .txs-body .cn-contact-header .txs-vf-desktop-menu>ul>li>a:focus-visible{
    color:#0f6aa8!important;
  }
}

/* 3) Content rail: tránh header/page body bị giật ngang giữa các template. */
.taxi-service-main{
  width:100%;
  min-width:0;
  overflow-x:clip;
}
.taxi-service-site *,
.txs-body *{
  box-sizing:border-box;
}

/* 4) Footer logistics dùng cùng rail với header/home. */
.txf-footer .txs-shell{
  width:min(var(--shell,1280px),calc(100% - 32px));
  max-width:1280px;
  margin-inline:auto;
}

/* 5) Mobile: giữ header/menu cố định, không bị CSS inner-page thay kích thước. */
@media (max-width:991px){
  .taxi-service-site .cn-contact-header .txs-vf-navbar,
  .txs-body .cn-contact-header .txs-vf-navbar{
    min-height:72px!important;
  }
  .taxi-service-site .cn-contact-header .txs-vf-mobile-panel,
  .txs-body .cn-contact-header .txs-vf-mobile-panel{
    background:#fff!important;
    border-top:1px solid #e6edf3!important;
    box-shadow:0 14px 30px rgba(15,34,54,.10)!important;
  }
  .taxi-service-site .cn-contact-header .txs-vf-mobile-panel a,
  .txs-body .cn-contact-header .txs-vf-mobile-panel a{
    color:#14263a!important;
    text-decoration:none!important;
  }
}

@media (max-width:600px){
  .txf-footer .txs-shell{width:calc(100% - 20px)}
}

/* =========================================================
   CN18 ICON ALIGNMENT HOTFIX
   CN16 đã khôi phục glyph Bootstrap Icons nhưng rule .bi {display:inline-block}
   nạp cuối làm ghi đè các icon-box dùng display:grid của Home/Money Page.
   Các selector dưới đây khóa glyph đúng giữa nền ở mọi khối chính.
   ========================================================= */
.cnm-process>div>i.bi,
.cnm-cost-grid>div>i.bi,
.cnm-support-grid>div>i.bi,
.cnm-secondary-grid>a>i.bi,
.mmp-trust-strip>div>i.bi,
.mmp-check-grid>div>i.bi,
.mmp-factor>i.bi,
.mmp-coverage>div:first-child>i.bi,
.mmp-support-card__fallback>i.bi,
.mmp-hero__placeholder>i.bi{
  display:grid!important;
  place-items:center!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  text-indent:0!important;
  line-height:1!important;
}
.cnm-process>div>i.bi::before,
.cnm-cost-grid>div>i.bi::before,
.cnm-support-grid>div>i.bi::before,
.cnm-secondary-grid>a>i.bi::before,
.mmp-trust-strip>div>i.bi::before,
.mmp-check-grid>div>i.bi::before,
.mmp-factor>i.bi::before,
.mmp-coverage>div:first-child>i.bi::before,
.mmp-support-card__fallback>i.bi::before,
.mmp-hero__placeholder>i.bi::before{
  display:block!important;
  margin:0!important;
  padding:0!important;
  line-height:1!important;
  transform:none!important;
}
/* Các icon có nền riêng phải giữ đúng kích thước hộp sau khi CN16 global guard chạy. */
.cnm-cost-grid>div>i.bi{width:38px!important;height:38px!important}
.cnm-support-grid>div>i.bi{width:36px!important;height:36px!important}
.cnm-secondary-grid>a>i.bi{width:42px!important;height:42px!important}
.mmp-check-grid>div>i.bi{width:42px!important;height:42px!important}
.mmp-trust-strip>div>i.bi{width:40px!important;height:40px!important}
.mmp-coverage>div:first-child>i.bi{width:auto!important;height:auto!important}

/* =========================================================
   CN19 - ICON BOX CENTERING FINAL GUARD
   Khóa tất cả icon-box của Home + Money Page sau palette/global .bi rules.
   ========================================================= */
.cnm-hero-points>span>i.bi,
.cnm-authority-grid>div>i.bi,
.cnm-cost-grid>div>i.bi,
.cnm-support-grid>div>i.bi,
.cnm-secondary-grid>a>i.bi,
.mmp-trust-strip>div>i.bi,
.mmp-check-grid>div>i.bi,
.mmp-authority-band__grid>div>i.bi,
.mmp-geo-card__icon>i.bi,
.mmp-geo-local-icon>i.bi,
.mmp-support-card__fallback>i.bi,
.mmp-coverage>div:first-child>i.bi{
  display:grid!important;
  place-items:center!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  padding:0!important;
  text-indent:0!important;
  line-height:1!important;
  box-sizing:border-box!important;
}
.cnm-hero-points>span>i.bi::before,
.cnm-authority-grid>div>i.bi::before,
.cnm-cost-grid>div>i.bi::before,
.cnm-support-grid>div>i.bi::before,
.cnm-secondary-grid>a>i.bi::before,
.mmp-trust-strip>div>i.bi::before,
.mmp-check-grid>div>i.bi::before,
.mmp-authority-band__grid>div>i.bi::before,
.mmp-geo-card__icon>i.bi::before,
.mmp-geo-local-icon>i.bi::before,
.mmp-support-card__fallback>i.bi::before,
.mmp-coverage>div:first-child>i.bi::before{
  display:block!important;
  width:auto!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  line-height:1!important;
  position:static!important;
  transform:none!important;
}
.cnm-hero-points>span>i.bi{width:30px!important;height:30px!important;min-width:30px!important;min-height:30px!important}
.cnm-authority-grid>div>i.bi{width:42px!important;height:42px!important}
