/*=========================================
  ----- PHẦN BREADCRUMB ----- 
=========================================*/
.breadcrumb-container {
  /* (1) Tô màu nền (màu của SPA) */
  background-color: #FBF3E3;

  /* (2) Quy tắc ẩn (để JS điều khiển) */
  display: block;
}

/* thanh màu vàng */
.breadcrumb-bar {
  background-color: #FFEDCB;
  border-bottom: 1px solid #E0DACA;
  display: block;
  width: 95%;
  max-width: 1400px;
  margin: 40px auto 40px auto;
  padding: 15px 25px;
  box-sizing: border-box;
  border-radius: 13px;
}

/* quy tắc ẩn (dành cho JavaScript) */
.breadcrumb-bar.hidden {
  display: none !important;
}

/* các mục category */
.breadcrumb ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  align-items: baseline;
  /* Căn chỉnh theo đường cơ sở của chữ */
  font-family: 'Overlock', cursive;
  font-size: 25px;
}

.breadcrumb li {
  display: inline;
}

/* các liên kết <a> */
.breadcrumb li a {
  text-decoration: none;
  color: #4C5332;
  transition: color 0.3s;
}

.breadcrumb li a:hover {
  color: #a0522d;
}

/* cái mũi tên > */
.breadcrumb li:not(:last-child)::after {
  content: ">";
  padding-left: 10px;
  padding-right: 10px;
  color: #4C5332;
  font-size: 25px;
  font-weight: bold;
}

/* mục cuối cùng in đậm */
.breadcrumb li:last-child {
  color: #333;
  font-weight: bold;
  font-size: 25px;
}