.cmp-tabs__tablist {
  display: flex;
  flex-wrap: wrap;
  padding-left: 0;
  list-style: none;
}

.cmp-tabs__tab {
  box-sizing: border-box;
  border-bottom: 1px solid transparent;
  padding: 0.5rem 1rem;
  cursor: pointer;
}
.cmp-tabs__tab--active {
  border-color: inherit;
}

.cmp-tabs__tabpanel {
  display: none;
}
.cmp-tabs__tabpanel--active {
  display: block;
}

.cmp-tabs {
  margin-block-start: var(--space-32);
}
.cmp-tabs__tablist-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
}
.cmp-tabs__tablist {
  font-family: var(--ff-microtext);
  font-size: 14px;
  line-height: 20px;
  font-weight: var(--fw-regular);
  background-color: var(--color-background-soft);
  color: var(--color-text-default);
  border-radius: var(--border-radius-350);
  padding: var(--space-6);
  flex-wrap: nowrap;
  overflow-x: hidden;
}
.cmp-tabs__tab {
  display: flex;
  flex: 0 0 auto;
  white-space: nowrap;
  scroll-margin-inline: var(--space-6);
}
.cmp-tabs__tab--active {
  font-weight: var(--fw-bold);
  background-color: var(--color-background-brand);
  color: var(--color-text-inverted);
  border-radius: var(--border-radius-350);
}
.cmp-tabs__tabpanel {
  margin-top: var(--space-16);
  border-radius: var(--border-radius-350);
  overflow: hidden;
}
.cmp-tabs__tabpanel .cmp-tabs {
  margin-block-start: 0;
}
.cmp-tabs__tab-icon {
  margin-inline-end: var(--space-8);
}
.cmp-tabs__button-prev, .cmp-tabs__button-next {
  cursor: pointer;
  background-color: var(--color-background-soft);
  border-radius: 50%;
}
.cmp-tabs__button-prev:hover:not(:disabled), .cmp-tabs__button-next:hover:not(:disabled) {
  background-color: var(--color-primary-white);
}
.cmp-tabs__button-prev:disabled, .cmp-tabs__button-next:disabled {
  opacity: 0.3;
  cursor: not-allowed;
  color: var(--color-primary-dark-grey);
}
.cmp-tabs__button-prev:disabled::before, .cmp-tabs__button-next:disabled::before {
  color: var(--color-primary-dark-grey);
}
.cmp-tabs__button-prev:focus-visible, .cmp-tabs__button-next:focus-visible {
  background-color: var(--color-background-brand);
}
.cmp-tabs__button-prev:focus-visible::before, .cmp-tabs__button-next:focus-visible::before {
  color: var(--color-primary-white);
}
.cmp-tabs__button-prev:focus-visible:hover::before, .cmp-tabs__button-next:focus-visible:hover::before {
  color: var(--color-primary-santander);
}
.cmp-tabs__button-prev--hidden, .cmp-tabs__button-next--hidden {
  display: none;
}
.cmp-tabs__button-prev::before {
  font-family: "SantanderIcons";
  font-style: normal;
  font-weight: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-size: var(--icon-size-24);
  color: var(--color-primary-santander);
  content: var(--icon-chevron-left);
  vertical-align: middle;
}
.cmp-tabs__button-prev {
  margin-inline-end: var(--space-12);
}
.cmp-tabs__button-next::before {
  font-family: "SantanderIcons";
  font-style: normal;
  font-weight: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-size: var(--icon-size-24);
  color: var(--color-primary-santander);
  content: var(--icon-chevron-right);
  vertical-align: middle;
}
.cmp-tabs__button-next {
  margin-inline-start: var(--space-12);
}

ol.cmp-tabs__tablist {
  margin-block-end: var(--space-0);
}
ol.cmp-tabs__tablist li {
  margin-block-end: var(--space-0);
}