:root {
  --tabs-item-horizontal-height: 44px;
  --tabs-item-vertical-height: 66px;
  --tabs-radius: 2px;
  --tabs-padding: 12px;
  --tabs-indicator-size: 2px;
  --tabs-indicator-background: var(--color-primary);
  --tabs-background: #fff;
}
.ppsv-tabs {
  border-radius: var(--tabs-radius);
  background: var(--tabs-background);
  overflow: hidden;
}
.ppsv-tabs__tab-wrap {
  position: relative;
  display: flex;
  height: 100%;
}
.ppsv-tabs__indicator {
  position: absolute;
  z-index: 10;
  transition-property: width, transform;
  transition-duration: 0.3s;
}
.ppsv-tabs--layout-horizontal {
  flex-direction: row;
}
.ppsv-tabs--layout-horizontal-scrollable {
  overflow-x: auto;
  overflow-y: hidden;
}
.ppsv-tabs--layout-horizontal-padding {
  padding: 0 var(--tabs-padding);
}
.ppsv-tabs--layout-horizontal-indicator {
  left: 0;
  bottom: 0;
  height: var(--tabs-indicator-size);
  background: var(--tabs-indicator-background);
}
.ppsv-tabs--layout-vertical {
  flex-direction: column;
}
.ppsv-tabs--layout-vertical-scrollable {
  overflow-x: hidden;
  overflow-y: auto;
}
.ppsv-tabs--layout-vertical-padding {
  padding: 0;
}
.ppsv-tabs--layout-vertical-indicator {
  left: 0;
  top: 0;
  width: var(--tabs-indicator-size);
  background: var(--tabs-indicator-background);
}
.ppsv-tabs--item-horizontal {
  height: var(--tabs-item-horizontal-height);
}
.ppsv-tabs--item-vertical {
  height: var(--tabs-item-vertical-height);
}
.ppsv-tabs--fixed-bottom {
  position: fixed;
  width: 100%;
  left: 0;
  bottom: 0;
  z-index: 99;
}