.solidae-cat-nav__grid {
  display: grid;
  align-items: stretch;
  grid-template-columns: repeat(auto-fill, minmax(var(--solidae-min-col-width, 180px), 1fr));
}

.solidae-cat-nav--fixed-cols .solidae-cat-nav__grid {
  grid-template-columns: repeat(var(--solidae-cols, 4), minmax(0, 1fr));
}

.solidae-cat-nav__slider {
  position: relative;
}

.solidae-embla__viewport {
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.solidae-embla__viewport::-webkit-scrollbar {
  display: none;
}

.solidae-embla__container {
  display: flex;
  align-items: stretch;
  gap: var(--solidae-slider-gap);
}

.solidae-cat-nav__slider--marquee .solidae-embla__container {
  will-change: transform;
}

.solidae-embla__slide {
  flex: 0 0 calc((100% - (var(--solidae-slider-spv) - 1) * var(--solidae-slider-gap)) / var(--solidae-slider-spv));
  min-width: 0;
  scroll-snap-align: start;
}

.solidae-embla__slide .solidae-cat-card {
  height: 100%;
}

.solidae-cat-nav__nav {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  appearance: none;
  transform: translateY(-50%);
  z-index: 2;
  cursor: pointer;
}

.solidae-cat-nav__nav::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--solidae-nav-icon-size);
  height: var(--solidae-nav-icon-size);
  border-top: var(--solidae-nav-icon-stroke) solid currentColor;
  border-right: var(--solidae-nav-icon-stroke) solid currentColor;
  box-sizing: border-box;
  display: block;
}

.solidae-cat-nav__nav--prev::before {
  transform: translate(-50%, -50%) rotate(-135deg);
}

.solidae-cat-nav__nav--next::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.solidae-cat-nav__nav:disabled {
  cursor: default;
}

.solidae-cat-nav__pagination {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

.solidae-cat-nav__dot {
  border: 0;
  padding: 0;
  cursor: pointer;
}

.solidae-cat-card {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  box-sizing: border-box;
  text-decoration: none;
  overflow: hidden;
}

.solidae-cat-card--branch .solidae-cat-card__name {
  position: relative;
  padding-right: var(--solidae-branch-indicator-spacing);
}

.solidae-cat-card--branch .solidae-cat-card__name::after {
  content: "";
  display: var(--solidae-branch-indicator-display);
  position: absolute;
  top: 50%;
  right: 0;
  width: var(--solidae-branch-indicator-size);
  height: var(--solidae-branch-indicator-size);
  border-top: var(--solidae-branch-indicator-stroke) solid var(--solidae-branch-indicator-color);
  border-right: var(--solidae-branch-indicator-stroke) solid var(--solidae-branch-indicator-color);
  transform: translateY(-50%) rotate(45deg);
  opacity: var(--solidae-branch-indicator-opacity);
}

.solidae-cat-card__thumb {
  display: block;
  flex: 0 0 auto;
  box-sizing: border-box;
  width: 100%;
  padding-top: 0;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  overflow: hidden;
}

.solidae-cat-card__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
}

.solidae-cat-card__name {
  flex: 1 1 auto;
  min-width: 0;
}

.solidae-cat-nav--count-beside .solidae-cat-card__name {
  flex: 0 1 auto;
}

.solidae-cat-nav.solidae-cat-nav--count-beside .solidae-cat-card__meta .solidae-cat-card__name,
.solidae-cat-nav.solidae-cat-nav--count-beside .solidae-cat-card__meta .solidae-cat-card__count {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.solidae-cat-card__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  max-width: 100%;
  padding: var(--solidae-count-padding);
}

.solidae-cat-card__count-before,
.solidae-cat-card__count-after,
.solidae-cat-card__count-number {
  display: inline-block;
}

.solidae-cat-card__count-before,
.solidae-cat-card__count-after {
  white-space: pre-wrap;
}

.solidae-cat-card__count-before {
  margin-inline-end: 0.25em;
}

.solidae-cat-card__count-after {
  margin-inline-start: 0.25em;
}
