/* Shell */
.inline-subnav {
  background: #fafafa;
  border-top: 1px solid #e5e7eb;
  position: relative;
}
.inline-subnav:after {
  content: "";
  display: block;
  height: 4px;
  background: #ffc20e;
} /* yellow line */

.tmsn-root-non-regulated-activities.inline-subnav:after {
  content: "";
  display: block;
  height: 4px;
  background: #ad1aac;
}

.tmsn-root-generation.inline-subnav:after {
  content: "";
  display: block;
  height: 4px;
  background: #adcb00;
}

.tmsn-root-transmission.inline-subnav:after {
  content: "";
  display: block;
  height: 4px;
  background: #ff7c00;
}

.tmsn-root-supply.inline-subnav:after {
  content: "";
  display: block;
  height: 4px;
  background: #0099d8;
}

/* Container */
.inline-subnav__container {
  margin: 0 auto;
  padding: 10px 16px;
}

/* Horizontal overflow */
.inline-subnav__scroller {
  overflow: auto hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.inline-subnav__scroller::-webkit-scrollbar {
  display: none;
}

/* List */
.inline-subnav__list {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.inline-subnav__list > li {
  display: flex;
  align-items: center;
}

/* Links updated*/
.inline-subnav__list > li > a {
  display: block;
  padding: 8px 0;
  text-decoration: none;
  color: #444748;
  white-space: nowrap;
  font-size: 14px;
}
.inline-subnav__list > li.active > a,
.inline-subnav__list > li > a:hover,
.inline-subnav__list > li > a:focus {
  color: #cc9b0b;
}

.tmsn-root-non-regulated-activities .inline-subnav__list > li.active > a,
.tmsn-root-non-regulated-activities .inline-subnav__list > li > a:hover,
.tmsn-root-non-regulated-activities .inline-subnav__list > li > a:focus {
  color: #ad1aac;
}

.tmsn-root-generation .inline-subnav__list > li.active > a,
.tmsn-root-generation .inline-subnav__list > li > a:hover,
.tmsn-root-generation .inline-subnav__list > li > a:focus {
  color: #8aa200;
}

.tmsn-root-transmission .inline-subnav__list > li.active > a,
.tmsn-root-transmission .inline-subnav__list > li > a:hover,
.tmsn-root-transmission .inline-subnav__list > li > a:focus {
  color: #ff7c00;
}

.tmsn-root-supply .inline-subnav__list > li.active > a,
.tmsn-root-supply .inline-subnav__list > li > a:hover,
.tmsn-root-supply .inline-subnav__list > li > a:focus {
  color: #0099d8;
}

/* Alignment */
.inline-subnav.align-center .inline-subnav__list {
  justify-content: center;
}
.inline-subnav.align-right .inline-subnav__list {
  justify-content: flex-end;
}
.inline-subnav.align-justify .inline-subnav__list {
  justify-content: space-between;
}

/* Breadcrumb prefix */
.inline-subnav__crumb {
  color: #181a1b;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 6px;
  margin-right: 12px;
  font-weight: 600;
}
.inline-subnav__crumb a {
  color: #181a1b;
  font-weight: 600;
}
.inline-subnav__crumb .sep {
  opacity: 0.45;
}
.inline-subnav__crumb .root {
  font-weight: 600;
  letter-spacing: 0.16px;
}
.inline-subnav__crumb .crumb {
  opacity: 0.85;
}
.inline-subnav__crumb .current {
  opacity: 1;
}

/* Small screens */
@media (max-width: 576px) {
  .inline-subnav__list {
    gap: 18px;
  }
}

/* Mobile subnav inside the collapsed navbar */
@media (max-width: 767.98px) {
  #navbarNav .inline-subnav {
    background: transparent;
    border: 0;
    position: static;
    margin-top: 20px !important;
    border-top: 2px solid #ffc20e !important;
    padding-top: 10px;
  }
  #navbarNav .inline-subnav:after {
    display: none; /* hide the plugin’s yellow underline on mobile */
  }

  #navbarNav .inline-subnav__container {
    padding: 0; /* align with mobile menu items */
  }
  #navbarNav .inline-subnav__scroller {
    overflow: visible; /* no horizontal scrolling in the drawer */
  }

  /* Turn the row into a vertical list */
  #navbarNav .inline-subnav__list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px; /* vertical spacing between items */
    margin: 0;
    padding: 0;
    list-style: none;
  }

  #navbarNav .inline-subnav__list > li {
    width: 100%;
  }

  /* Links */
  #navbarNav .inline-subnav__list > li > a {
    display: block;
    padding: 0; /* match screenshot – no extra padding */
    border: 0 !important; /* remove desktop underline hover/active */
    text-decoration: none;
    color: #2c2e2f;
    font-size: 16px;
    line-height: 1.35;
  }

  /* Active = slightly bolder (no underline) */
  #navbarNav .inline-subnav__list > li.active > a,
  #navbarNav .inline-subnav__list > li.is-current > a {
    color: #cc9b0b;
  }

  /* Breadcrumb prefix line (root → … → current) as bold heading */
  #navbarNav .inline-subnav__crumb {
    font-size: 16px;
    font-weight: 600; /* bold like in your design */
    margin: 6px 0 2px;
    gap: 4px;
    color: #111827;
  }
  #navbarNav .inline-subnav__crumb .sep {
    opacity: 0.5;
  }
  #navbarNav .inline-subnav__crumb .crumb {
    opacity: 0.85;
  }
  #navbarNav .inline-subnav__crumb .current {
    opacity: 1;
  }
}