/* =========================================================
   TÂY KINH LOGISTICS (TKLOGS) – Bộ nhận diện v1
   Dán vào CUỐI file CSS chính của giao diện (hoặc file custom.css)
   để ghi đè giao diện cũ. Không xóa file cũ.
   Theme nhận diện: CargoPress (class header__*, main-navigation, widget-*)
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@600;700&family=Roboto:wght@400;500;700&display=swap&subset=vietnamese');

:root {
  --tk-green:  #0B8A3E; /* chủ đạo */
  --tk-navy:   #12324A; /* phụ, nền tối */
  --tk-amber:  #F2A900; /* điểm nhấn: nút, hotline */
  --tk-ivory:  #F6F7F4; /* nền */
  --tk-charcoal: #2B2F33; /* chữ */
  --tk-green-dark: #076B2F; /* hover */
  --tk-amber-dark: #D89500; /* hover nút vàng */
}

/* ---------- Font: chỉ dùng 2 font ---------- */
body, p, li, input, textarea, select, button, a, span, div {
  font-family: 'Roboto', sans-serif;
}
h1, h2, h3, h4, h5, h6,
.widget-title, .icon-box__title, .main-navigation > li > a, .btn {
  font-family: 'Be Vietnam Pro', 'Roboto', sans-serif !important;
  font-weight: 700;
}

/* ---------- Nền & chữ ---------- */
body { background: var(--tk-ivory); color: var(--tk-charcoal); }
a { color: var(--tk-green); }
a:hover, a:focus { color: var(--tk-green-dark); }

/* ---------- Header ---------- */
.header { background: #fff; }
.header__widgets .icon-box__title,
.header__widgets .icon-box__subtitle { color: var(--tk-charcoal); }
/* Hotline màu vàng hổ phách ở thanh đầu trang */
.header__widgets a[href^="tel:"],
.header__widgets .icon-box__subtitle a { color: var(--tk-amber-dark); font-weight: 700; }
.social-icons__link { color: var(--tk-green); }
.social-icons__link:hover { color: var(--tk-amber); }

/* ---------- Thanh menu: nền xanh lá, chữ trắng ---------- */
.header__navigation,
.main-navigation,
.header__navigation .navbar-collapse { background: var(--tk-green) !important; }
.main-navigation > li > a { color: #fff !important; text-transform: none; }
.main-navigation > li > a:hover,
.main-navigation > li.current-menu-item > a,
.main-navigation > li.current_page_item > a { color: var(--tk-amber) !important; background: transparent; }
.main-navigation .sub-menu { background: var(--tk-navy); }
.main-navigation .sub-menu a { color: #fff !important; }
.main-navigation .sub-menu a:hover { background: var(--tk-green); color: #fff !important; }
.navbar-toggle { background: var(--tk-green); }

/* ---------- Banner đầu trang: nền navy ---------- */
.jumbotron, .carousel.js-jumbotron-slider { background: var(--tk-navy); }
.jumbotron h1, .jumbotron h2, .jumbotron h3,
.carousel-caption h1, .carousel-caption h2, .carousel-caption h3 { color: #fff; }

/* ---------- Nút CTA (VD: "Yêu cầu báo giá") màu vàng ---------- */
.btn, .btn-primary, .btn-default, button[type="submit"], input[type="submit"] {
  background: var(--tk-amber) !important;
  border-color: var(--tk-amber) !important;
  color: var(--tk-navy) !important;
  border-radius: 4px;
}
.btn:hover, .btn-primary:hover, button[type="submit"]:hover, input[type="submit"]:hover {
  background: var(--tk-amber-dark) !important;
  border-color: var(--tk-amber-dark) !important;
}

/* ---------- Tiêu đề khối ---------- */
.widget-title, .widget-title__inline { color: var(--tk-navy); }
.widget-title__line { background: var(--tk-green) !important; }
.icon-box__title { color: var(--tk-navy); }

/* ---------- Chân trang: nền navy ---------- */
footer, .footer, .footer-top, .footer-bottom { background: var(--tk-navy) !important; color: #dfe6ea; }
footer a, .footer a { color: #fff; }
footer a:hover, .footer a:hover { color: var(--tk-amber); }
footer .widget-title, .footer .widget-title { color: #fff; }
