.cat-toolbar {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 1rem;
  padding: 10px 20px;
  box-sizing: border-box;
  width: 100%;
  border-radius: 8px;
  background-color: var(--bg-toolbar);
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(13.5px);
  border: 1px solid var(--shadow-color);
  color: var(--c-toolbar);
}

.cat-toolbar.cat-toolbar-sm {
  padding: 0 24px 0 30px;
  min-height: 57px;
}

.cat-toolbar a {
  text-decoration: none;
  color: var(--c-toolbar) !important;
}

.dark .cat-toolbar a {
  font-weight: 100;
}

.cat-toolbar li a.active,
.cat-toolbar li a.noRoute {
  color: var(--font-color);
  opacity: 0.6;
  cursor: default;
}

.cat-toolbar .active a {
  font-weight: bold;
}

.cat-toolbar .info-content {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
}

.cat-toolbar .info-content h1 {
  margin: 0 0 5px;
  padding: 10px 0;
  font-size: 1.17rem;
}

.cat-toolbar .info-content h2 {
  margin: 0;
  padding: 0;
  font-size: 0.919rem;
}

.cat-toolbar .space {
  flex: 1 0 0;
}

.cat-toolbar .breadcrumb {
  font-size: 0.836rem;
  margin: 0;
}

.cat-toolbar .btn-group {
  width: auto;
}

.cat-toolbar .btn-group nav {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  width: 100%;
}

.breadcrumb {
  --bs-breadcrumb-divider: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='8'><path d='M2.5 0L1 1.5 3.5 4 1 6.5 2.5 8l4-4-4-4z' fill='#{$breadcrumb-divider-color-light}'/></svg>");
}

.dark .breadcrumb {
  --bs-breadcrumb-divider: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='8' height='8'><path d='M2.5 0L1 1.5 3.5 4 1 6.5 2.5 8l4-4-4-4z' fill='#{$breadcrumb-divider-color-dark}'/></svg>");
}

@media (max-width: 980px) {
  .cat-toolbar {
    flex-direction: column;
    align-items: flex-start;
    padding: 10px 20px 20px;
  }

  .cat-toolbar .btn-group {
    width: 100%;
  }
}