header {
  grid-row: 1; /* Đặt header vào hàng đầu tiên */
  background-color: #007bff;
  color: white;
  padding: 15px;
  text-align: center;
  width: 100%;
}

.site-header {
  background: linear-gradient(to bottom, #ffffff, #f4f4f4);
  /* Fallback color cho các trình duyệt cũ không hỗ trợ gradient */
  background-color: #ffffff;
  z-index: 3;
  position: static;
  height: 160px;
  top: 0;
  left: 0;
  right: 0;
  padding-top: 30px;
  padding-left: 30px;
  padding-right: 30px;
  padding-bottom: 10px;
}
.right-header {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
}

.main-logo a img {
  float: left;
  width: auto;
  height: 70px;
}
.furuno-logo {
  width: auto;
  margin-bottom: 10px;
  margin-left: 12px;
  margin-right: 12px;
  height: 15px;
}
.phanphoi-title {
  color: #333333;
  font-size: 13pt;
  margin-bottom: 6px;
  width: auto;
  font-style: italic;
}

.seach-bar {
  position: static;
  width: auto;
  height: auto;
  float: left;
}
.site-header__menu {
  padding-top: 15px;
  margin-bottom: 10px;
}
.main-navigation {
  width: 100%;
  padding: 0; /* Xóa padding mặc định của thẻ ul */
  margin: 0; /* Xóa margin mặc định của thẻ ul */
}
.main-navigation ul {
  display: flex; /* Kích hoạt Flexbox cho thẻ <ul> */
  justify-content: space-between;
  list-style: none; /* Xóa dấu chấm mặc định của <li> */
  padding: 0; /* Xóa padding mặc định của thẻ ul */
  margin: 0; /* Xóa margin mặc định của thẻ ul */
  width: 100%; /* Đảm bảo ul chiếm hết chiều ngang của .main-menu */
}
.main-navigation li {
  text-align: center; /* Căn giữa nội dung văn bản trong mỗi <li> */
}
.main-navigation li a {
  color: black;
  display: block; /* Làm cho toàn bộ khu vực <li> có thể nhấp được */
  padding: 5px 0px; /* Padding cho nội dung bên trong */
  text-decoration: none; /* Xóa gạch chân link */
  white-space: nowrap; /* Ngăn không cho chữ xuống dòng nếu nội dung quá dài */
}

.current-menu-item {
  /* Đảm bảo thẻ a là inline-block để có thể đặt chiều rộng và sử dụng pseudo-element */
  display: inline-block;
  position: relative; /* Quan trọng: Dùng để định vị ::after */
  text-decoration: none; /* Xóa gạch chân mặc định của link nếu có */
  color: #333; /* Màu chữ mặc định */
  padding-bottom: 9px; /* Khoảng cách tổng cộng: 30px trống + 5px của đường kẻ */
  font-weight: 600;
  /* Hoặc chỉ padding-bottom 5px nếu muốn đường kẻ sát chữ hơn
       và dùng margin-top trên ::after */
}

.current-menu-item::after {
  content: ""; /* Bắt buộc phải có content cho pseudo-element */
  display: block; /* Để đường kẻ có chiều rộng và chiều cao */
  position: absolute; /* Định vị tuyệt đối để có thể căn giữa và đặt khoảng cách */
  bottom: 0; /* Đặt đường kẻ ở phía dưới cùng của thẻ a */
  left: 50%; /* Dịch sang trái 50% của thẻ a */
  transform: translateX(-50%); /* Dịch ngược lại 50% của chính nó để căn giữa */

  width: 110%; /* Độ dài đường kẻ bằng 120% của thẻ a (cũng là 120% của nội dung chữ Tin tức) */
  height: 3px; /* Độ dày của đường kẻ */
  background-color: #0aaf50; /* Màu xanh lá cây */
}

.search-field {
  border: none;
  outline: none;
  box-shadow: none;
}
.search-min-form {
  border: 1.5px solid;
  border-color: rgb(199, 198, 198);
  line-height: 0%;
  margin-bottom: 5px;
  height: 30px;
}
.submit-btn {
  border: none;
  outline: none;
  box-shadow: none;
  height: 100%;
  padding: 0px 12px;
  background-color: #005498;
  color: #ffffff;
}
.search-field {
  padding-left: 10px;
}
.language-btn {
  border: none;
  outline: none;
  box-shadow: none;
  background-image: url("../images/lagIcon-Eng.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  height: 31px;
  width: 38px;
  margin-left: 15px;
}

/* CSS cho nút chuyển đổi ngôn ngữ mới */
.language-switcher-link {
  display: inline-block;
  margin-left: 15px;
  transition: opacity 0.2s ease;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  height: 31px;
  width: 38px;
  margin-left: 15px;
  border: none;
  outline: none;
  box-shadow: none;
}

.language-switcher-link:hover {
  opacity: 0.75; /* Hiệu ứng mờ nhẹ khi di chuột */
}

.language-switcher-link img {
  height: 31px; /* Giữ nguyên kích thước của bạn */
  width: 38px;
  display: block; /* Loại bỏ khoảng trắng thừa bên dưới ảnh */
}

.language_icon {
  display: none;
}

/* --- 3. (Tùy chọn) Hiệu ứng nút Hamburger thành dấu "X" khi mở 
.menu-toggle.is-active .hamburger-bar:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}
.menu-toggle.is-active .hamburger-bar:nth-child(2) {
  opacity: 0;
}
.menu-toggle.is-active .hamburger-bar:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}--- */

/* Ẩn văn bản "Mở menu" khỏi màn hình nhưng vẫn giữ cho trình đọc màn hình */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

/* --- 1. Style cho Nút Hamburger --- */
.menu-toggle {
  display: none; /* Mặc định ẩn nút này trên desktop */
  background: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 8px 10px;
  cursor: pointer;
  position: absolute; /* Định vị nút so với header */
  top: 10px; /* Điều chỉnh vị trí theo thiết kế của bạn */
  right: 10px;
  z-index: 1001; /* Đảm bảo nút luôn nằm trên */
}

.hamburger-bar {
  display: block;
  width: 22px;
  height: 2px;
  background-color: #333;
  margin: 4px 0;
  transition: all 0.3s ease-in-out;
}

@media (min-width: 1025px) {
}