/* ================================================
   SIQ Breadcrumbs - Custom Styles
   ================================================ */

/* General Breadcrumbs Container */
.breadcrumbs {
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
}

/* List & Items */
.breadcrumbs__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 10px;
  min-width: 0;
  font-family: 'Raleway', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 1;
  letter-spacing: 0;
  text-transform: uppercase;
  color: #FFFFFF;
}

.breadcrumbs__item {
  display: inline-flex;
  align-items: center;
  position: relative;
  flex: 0 0 auto;
  min-width: 0;
  cursor: pointer;
}

/* Links & Hover States */
.breadcrumbs .breadcrumbs__item a,
.breadcrumbs .breadcrumbs__item span {
  text-decoration: none;
  color: #FFFFFF;
  font-weight: 400;
  font-family: 'Raleway', sans-serif;
  padding: 0;
  white-space: nowrap;
}

/* Ensure no underline on breadcrumb links in any state, even if the
   theme or another plugin tries to add one. The underline was coming from
   a text-decoration set on the <li>/<ol> (parent), which propagates onto
   descendant <a>/<span>; that propagated line can ONLY be removed by
   resetting text-decoration on the ancestor itself. */
.breadcrumbs,
.breadcrumbs__list,
.breadcrumbs__list li,
.breadcrumbs__item,
.breadcrumbs .breadcrumbs__item a,
.breadcrumbs .breadcrumbs__item a:link,
.breadcrumbs .breadcrumbs__item a:visited,
.breadcrumbs .breadcrumbs__item a:hover,
.breadcrumbs .breadcrumbs__item a:focus,
.breadcrumbs .breadcrumbs__item a:active,
.breadcrumbs .breadcrumbs__item span {
  text-decoration: none !important;
}

/* High-specificity guard against theme hover/focus underline. The repeated
   classes raise specificity so this wins over aggressive theme rules. */
nav.breadcrumbs ol.breadcrumbs__list li.breadcrumbs__item.breadcrumbs__item a,
nav.breadcrumbs ol.breadcrumbs__list li.breadcrumbs__item.breadcrumbs__item a:link,
nav.breadcrumbs ol.breadcrumbs__list li.breadcrumbs__item.breadcrumbs__item a:visited,
nav.breadcrumbs ol.breadcrumbs__list li.breadcrumbs__item.breadcrumbs__item a:hover,
nav.breadcrumbs ol.breadcrumbs__list li.breadcrumbs__item.breadcrumbs__item a:focus,
nav.breadcrumbs ol.breadcrumbs__list li.breadcrumbs__item.breadcrumbs__item a:active,
nav.breadcrumbs ol.breadcrumbs__list li.breadcrumbs__item.breadcrumbs__item a span {
  text-decoration: none !important;
  -webkit-text-decoration: none !important;
  text-decoration-line: none !important;
}

.breadcrumbs .breadcrumbs__item a:hover,
.breadcrumbs .breadcrumbs__item a:active {
  opacity: 0.8;
}

/* Home icon item */
.breadcrumbs__item--home {
  flex: 0 0 auto;
}

.breadcrumbs__item--home a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}

.breadcrumbs__item--home img {
  display: block;
  width: 17px;
  height: 14px;
}

/* Current (last) item - truncate with ellipsis when it does not fit */
.breadcrumbs__item--current {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
}

.breadcrumbs__item--current {
  cursor: default;
}

.breadcrumbs .breadcrumbs__item--current > span,
.breadcrumbs .breadcrumbs__item--current > a,
.breadcrumbs .breadcrumbs__item--current > span > a {
  font-weight: 700;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
}

/* Separator (chevron right) - desktop */
.breadcrumbs__sep {
  flex: 0 0 auto;
  width: 6px;
  height: 15px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='6' height='15' viewBox='0 0 6 15' fill='none'%3E%3Cpath d='M0 14.448L4.48 7.456L0 0.464L1.008 0L5.76 7.456L1.008 14.912L0 14.448Z' fill='white'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  border: none;
}

/* Tablet (<= 1024px) */
@media (max-width: 1024px) {
  .breadcrumbs__list {
    gap: 8px;
    font-size: 12px;
  }

  .breadcrumbs__item--home img {
    width: 15px;
    height: 12px;
  }

  .breadcrumbs__sep {
    width: 5px;
    height: 14px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='14' viewBox='0 0 5 14' fill='none'%3E%3Cpath d='M0 13.5644L3.88889 7L0 0.435622L0.875 0L5 7L0.875 14L0 13.5644Z' fill='white'/%3E%3C/svg%3E");
  }

  .breadcrumbs__item--home img {
    width: 15px;
    height: 12px;
  }

  .breadcrumbs__sep {
    width: 5px;
    height: 14px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='14' viewBox='0 0 5 14' fill='none'%3E%3Cpath d='M0 13.5644L3.88889 7L0 0.435622L0.875 0L5 7L0.875 14L0 13.5644Z' fill='white'/%3E%3C/svg%3E");
  }
}

/* Mobile (<= 767px) */
@media (max-width: 767px) {
  .breadcrumbs__list {
    gap: 6px;
    font-size: 10px;
  }

  .breadcrumbs__item--home img {
    width: 14px;
    height: 11px;
  }

  .breadcrumbs__sep {
    width: 5px;
    height: 11px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='5' height='11' viewBox='0 0 5 11' fill='none'%3E%3Cpath d='M0 10.6577L3.88889 5.5L0 0.342274L0.875 0L5 5.5L0.875 11L0 10.6577Z' fill='white'/%3E%3C/svg%3E");
  }
}