/* ==========================================================================
   Clean BEM/Class-Based Breadcrumb Layout Styling
   ========================================================================== */

  .menu-breadcrumbs-row {
    margin-left: 70px;
    padding-top: 15px;
    padding-bottom: 15px;
}

/* Outer wrapper block container */
.custom-breadcrumb-wrapper {
  margin: 15px 0 25px 0;
  padding: 0;
  width: 100%;
  background: none;
}

/* Force items onto a single line and strip default bullet points */
ul.custom-breadcrumb-list,
.custom-breadcrumb-wrapper ul.custom-breadcrumb-list {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  list-style: none !important;
  list-style-type: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Format each individual item segment safely */
ul.custom-breadcrumb-list li,
.custom-breadcrumb-wrapper ul.custom-breadcrumb-list li {
  display: flex !important;
  align-items: center !important;
  font-family: 'Metropolis', -apple-system, sans-serif;
  font-size: 14px;
  font-weight: 500;
  color: #64748b; /* Slate gray styling */
  line-height: 1.5;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
}

/* Remove standard native bullet layouts on modern browser rendering blocks */
ul.custom-breadcrumb-list li::marker,
.custom-breadcrumb-wrapper ul.custom-breadcrumb-list li::marker {
  content: "" !important;
  display: none !important;
}

/* Handle anchor link color formatting */
ul.custom-breadcrumb-list li a,
.custom-breadcrumb-wrapper ul.custom-breadcrumb-list li a {
  color: #0284c7; /* Clinical Blue */
  text-decoration: none;
  transition: color 0.2s ease-in-out;
}

ul.custom-breadcrumb-list li a:hover,
.custom-breadcrumb-wrapper ul.custom-breadcrumb-list li a:hover {
  color: #0369a1;
  text-decoration: underline;
}

/* Dynamically inject the crisp divider slash lines */
ul.custom-breadcrumb-list li:not(:last-child)::after,
.custom-breadcrumb-wrapper ul.custom-breadcrumb-list li:not(:last-child)::after {
  content: ">" !important;
  margin: 0 10px !important;
  color: #cbd5e1; /* Light gray divider line */
  font-weight: 400;
  pointer-events: none;
}

/* Format terminal active current text page element */
ul.custom-breadcrumb-list li .current-page,
.custom-breadcrumb-wrapper ul.custom-breadcrumb-list li .current-page {
  color: #1e293b; /* High contrast dark charcoal grey text */
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 350px; /* Prevents text overflow breaks on smaller devices */
}

/* If your layout allows layout manipulation, force the breadcrumb to sit below the header content */
#block-custompagebreadcrumbblock {
  clear: both;
  display: block;
  width: 100%;
  margin-top: 10px;
}

/* ==========================================================================
   Force Breadcrumbs Wrapper out of the Navigation Flex Container
   ========================================================================== */

/* Target the wrapper block dynamically via its unique Felix ID */
#block-felix-custompagebreadcrumbsblock {
  flex-basis: 100% !important; /* Forces layout wrapper to occupy full width */
  width: 100% !important;       /* Breaks the inline horizontal flex alignment */
  clear: both !important;       /* Prevents floats from jamming text on the right */
  display: block !important;    /* Converts layout block behavior away from flex items */
  margin-top: 15px !important;  /* Adjust this value to push it down from the menu bar */
  padding-left: 15px;           /* Aligns text left to match your main menu alignment spacing */
}

/* Ensure the layout list flows inline cleanly inside its new line space */
#block-felix-custompagebreadcrumbsblock .custom-breadcrumb-wrapper ul.custom-breadcrumb-list {
  display: flex !important;
  justify-content: flex-start !important; /* Aligns breadcrumbs nicely to the left edge */
}

/* Responsive mobile scaling constraints */
/* @media (max-width: 640px) {
  ul.custom-breadcrumb-list li,
  .custom-breadcrumb-wrapper ul.custom-breadcrumb-list li {
    font-size: 13px;
  }
  ul.custom-breadcrumb-list li:not(:last-child)::after,
  .custom-breadcrumb-wrapper ul.custom-breadcrumb-list li:not(:last-child)::after {
    margin: 0 6px !important;
  }
  .menu-breadcrumbs-row {
    margin-left: 15px;
    padding-bottom: 15px;
  }

} */

@media (max-width: 767px) {
  .custom-breadcrumb-list .current-page[data-mobile-title] {
    font-size: 0;
  }

  .custom-breadcrumb-list .current-page[data-mobile-title]:after {
    content: attr(data-mobile-title);
    font-size: 14px;
  }
    ul.custom-breadcrumb-list li,
  .custom-breadcrumb-wrapper ul.custom-breadcrumb-list li {
    font-size: 13px;
  }
  ul.custom-breadcrumb-list li:not(:last-child)::after,
  .custom-breadcrumb-wrapper ul.custom-breadcrumb-list li:not(:last-child)::after {
    margin: 0 6px !important;
  }
  .menu-breadcrumbs-row {
    margin-left: 15px;
    padding-bottom: 15px;
  }
}