/**
 * SharePoint Breadcrumb Converter Styles
 * Transforms SharePoint breadcrumb into Bootstrap breadcrumb style
 */

/* Hide SharePoint breadcrumb icons and unnecessary elements */
.container .las.la-home {
  display: none;
}

.container .RootBCnode.hidden {
  display: none !important;
}

/* Container for breadcrumb structure */
.container > span[sitemapproviders] {
  display: block;
  padding: 0;
  margin: 0 0 1rem 0;
}

/* Convert SharePoint breadcrumb to Bootstrap breadcrumb */
.container > span[sitemapproviders] {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  background-color: transparent;
  border-radius: 0.375rem;
}

/* Hide skip navigation link image */
.container > span[sitemapproviders] img[alt="Skip Navigation Links"] {
  display: none !important;
}

/* Style breadcrumb items */
.container > span[sitemapproviders] > span {
  display: inline-flex;
  align-items: center;
}

/* Style breadcrumb links */
.container > span[sitemapproviders] > span > a {
  color: #006341;
  text-decoration: none;
  transition: color 0.15s ease-in-out;
  font-size: 0.875rem;
}

.container > span[sitemapproviders] > span > a:hover {
  color: #004d31;
  text-decoration: underline;
}

/* Style breadcrumb separators */
.container > span[sitemapproviders] > span > i.las.la-angle-right {
  color: #6c757d;
  font-size: 0.875rem;
  margin: 0 0.5rem;
  display: inline-block;
}

/* Style current/active breadcrumb item */
.container > span[sitemapproviders] > span.CurrentBCnode {
  color: #6c757d;
  font-size: 0.875rem;
}

/* Alternative approach: Wrap in nav aria-label */
nav[aria-label="breadcrumb"] {
  --bs-breadcrumb-padding-x: 0;
  --bs-breadcrumb-padding-y: 0;
  --bs-breadcrumb-margin-bottom: 1rem;
  --bs-breadcrumb-bg: transparent;
  --bs-breadcrumb-border-radius: 0;
  --bs-breadcrumb-divider-color: #6c757d;
  --bs-breadcrumb-item-padding-x: 0.5rem;
  --bs-breadcrumb-item-active-color: #6c757d;
}

/* Bootstrap breadcrumb styles */
.breadcrumb {
  display: flex;
  flex-wrap: wrap;
  padding: var(--bs-breadcrumb-padding-y) var(--bs-breadcrumb-padding-x);
  margin-bottom: var(--bs-breadcrumb-margin-bottom);
  font-size: var(--bs-breadcrumb-font-size);
  list-style: none;
  background-color: var(--bs-breadcrumb-bg);
  border-radius: var(--bs-breadcrumb-border-radius);
}

.breadcrumb-item + .breadcrumb-item {
  padding-right: var(--bs-breadcrumb-item-padding-x);
}

.breadcrumb-item + .breadcrumb-item::before {
  float: right;
  padding-left: var(--bs-breadcrumb-item-padding-x);
  color: var(--bs-breadcrumb-divider-color);
  font-family: "Line Awesome Free";
  font-weight: 900;
  content: "\f105";
  font-size: 0.875rem;
}

.breadcrumb-item.active {
  
  color: var(--dga-breadcrumb-item-active-color);
}

.breadcrumb-item a {
  color: var(--dga-gray-700);
  text-decoration: none;
  transition: color 0.15s ease-in-out;
}

.breadcrumb-item a:hover {
  color: var(--dga-gray-500);
  text-decoration: underline;
}

/* RTL Support */
[dir="rtl"] .breadcrumb-item + .breadcrumb-item {
  padding-right: 0;
  padding-left: var(--bs-breadcrumb-item-padding-x);
}

[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before {
  float: left;
  padding-right: var(--bs-breadcrumb-item-padding-x);
  padding-left: 0;
  content: "\f104";
}

/* Responsive adjustments */
@media (max-width: 576px) {
  .breadcrumb {
    font-size: 0.8125rem;
  }
  
  .container > span[sitemapproviders] > span > a,
  .container > span[sitemapproviders] > span.CurrentBCnode {
    font-size: 0.8125rem;
  }
}
.breadcrumb .breadcrumb-item:nth-of-type(2) {
 
  display: none;
}