/**
 * Regional-essay HID tree: breadcrumb (on the light page) + child list and
 * buildings link, inside the light .regional-essay__sidebar card
 * (bg #f5f9fc / navy text — see overrides.css).
 */

/* ---- Breadcrumb (light page background) ---- */
.regional-essay__breadcrumb {
  font-family: 'Montserrat', sans-serif;
  font-size: 0.8rem;
  line-height: 1.9;
  margin: 0 0 1rem;
  color: #5a7480;
}

.regional-essay__breadcrumb-link {
  color: #238fb5;
  text-decoration: none;
}

.regional-essay__breadcrumb-link:hover,
.regional-essay__breadcrumb-link:focus {
  color: #014360;
  text-decoration: underline;
}

.regional-essay__breadcrumb-sep {
  margin: 0 0.5em;
  color: #a7bcc6;
}

.regional-essay__breadcrumb-current {
  color: #5a7480;
}

/* ---- Child list ("In This Section"), on the light card ---- */
.regional-tree__children {
  list-style: none;
  margin: 0;
  padding: 0;
}

.regional-tree__child {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.6rem;
  padding: 0.35rem 0;
  border-bottom: 1px solid #e2edf2;
}

.regional-tree__child:last-child {
  border-bottom: none;
}

.regional-tree__child-link {
  color: #014360;
  text-decoration: none;
  font-size: 0.9rem;
  line-height: 1.35;
}

.regional-tree__child-link:hover,
.regional-tree__child-link:focus {
  color: #238fb5;
  text-decoration: underline;
}

/* Plain word, not a pill — a quiet marker of what a child links to. */
.regional-tree__badge {
  flex: none;
  font-size: 0.72rem;
  font-style: italic;
  color: #5a7480;
}

/* Building-only leaf (link goes straight to the buildings list). */
.regional-tree__badge--buildings {
  color: #238fb5;
}

/* ---- Buildings link, under the child list in the card ---- */
.regional-tree__buildings {
  margin: 0.85rem 0 0;
  padding-top: 0.85rem;
  border-top: 1px solid #d7e6ee;
}

.regional-tree__buildings-link {
  color: #238fb5;
  font-size: 0.9rem;
  font-weight: 600;
  text-decoration: none;
  hyphens: none;
}

.regional-tree__buildings-link:hover,
.regional-tree__buildings-link:focus {
  color: #014360;
  text-decoration: underline;
}

.regional-tree__arrow {
  display: inline-block;
  white-space: nowrap;
  transition: transform 0.12s;
}

.regional-tree__buildings-link:hover .regional-tree__arrow {
  transform: translateX(3px);
}