@-webkit-keyframes skeleton-shimmer {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}
@keyframes skeleton-shimmer {
  0% {
    background-position: 200% 0;
  }
  100% {
    background-position: -200% 0;
  }
}
.tabs-panels[data-edit-mode=false] .tabs-panel {
  display: none;
}

.tabs-panels[data-edit-mode=false] .tabs-panel.active {
  display: block;
}

.tabs-component {
  /* Tabs: add-background visual treatment */
}
.tabs-component .tabs-nav-wrap {
  position: relative;
}
.tabs-component .tabs-nav-wrap .tabs-nav {
  list-style: none;
  padding-left: 0;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.tabs-component .tabs-nav-wrap .tabs-nav li {
  display: inline-block;
  margin-right: 1rem;
  cursor: pointer;
}
.tabs-component .tabs-nav-wrap .tabs-nav li a {
  font-weight: 700;
  font-size: 1.5rem;
  color: var(--color-moonlit-ocean-400) !important;
}
.tabs-component .tabs-nav-wrap .tabs-nav li a:hover {
  color: var(--color-moonlit-ocean-900) !important;
  text-decoration: none;
}
.tabs-component .tabs-nav-wrap .tabs-nav li.active {
  pointer-events: none;
}
.tabs-component .tabs-nav-wrap .tabs-nav li.active a {
  color: var(--color-moonlit-ocean-900) !important;
}
@media (min-width: 769px) {
  .tabs-component .tabs-nav-wrap .tabs-nav li a {
    font-size: 1.8rem;
  }
}
.tabs-component.add-background {
  /* Individual tabs */
  /* Panels (content area) */
}
.tabs-component.add-background .tabs-nav {
  margin: 0;
}
.tabs-component.add-background .tabs-nav li {
  margin-right: 0.25rem;
  border-radius: 16px 16px 0 0;
}
.tabs-component.add-background .tabs-nav li a {
  display: block;
  font-weight: 400;
  font-size: 0.75rem;
  color: var(--color-moonlit-ocean-400) !important;
  padding: 1.25rem;
  background: transparent;
  border-radius: 16px 16px 0 0;
  -webkit-transition: color 0.2s ease, background-color 0.2s ease;
  transition: color 0.2s ease, background-color 0.2s ease;
}
.tabs-component.add-background .tabs-nav li a:hover {
  color: var(--color-moonlit-ocean-900) !important;
  background: transparent; /* background handled on li for visible rounded corners */
  text-decoration: none;
}
.tabs-component.add-background .tabs-nav li a.active {
  pointer-events: none;
}
.tabs-component.add-background .tabs-nav li a.active a {
  color: var(--color-moonlit-ocean-900) !important;
}
.tabs-component.add-background .tabs-nav li.active {
  pointer-events: none;
  background: var(--color-white);
}
.tabs-component.add-background .tabs-nav li.active a {
  color: var(--color-moonlit-ocean-900) !important;
}
.tabs-component.add-background .tabs-nav li:hover {
  background: var(--color-white);
}
.tabs-component.add-background .tabs-nav li:hover a {
  color: var(--color-moonlit-ocean-900) !important;
  text-decoration: none;
}
.tabs-component.add-background .tabs-panels {
  background: var(--color-white);
  border-radius: 0 16px 0 16px;
  padding: 1.5rem;
  font-size: 0.9rem;
  font-weight: 400;
  color: var(--color-moonlit-ocean-900) !important;
  /* Lists inside tab content: bold title, normal subtext */
  /* Bullet/number color */
}
.tabs-component.add-background .tabs-panels ul, .tabs-component.add-background .tabs-panels ol {
  margin: 0 0 1rem 1.25rem;
}
.tabs-component.add-background .tabs-panels li::marker {
  color: var(--color-moonlit-ocean-200);
}
.tabs-component.add-background .tabs-panels li {
  margin: 0 0 0.75rem 0;
  font-weight: 400;
  font-size: 0.85rem;
}
.tabs-component.add-background .tabs-panels li > strong,
.tabs-component.add-background .tabs-panels li > b {
  display: block;
  font-weight: 700;
  margin: 0 0 0.25rem 0;
}
.tabs-component.add-background .tabs-panels li > p {
  margin: 0;
  font-weight: 400;
}
@media (min-width: 769px) {
  .tabs-component.add-background .tabs-nav li a {
    font-size: 1rem;
  }
}
.tabs-component .tabs-hover-zone {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 36px;
  -webkit-transition: opacity 0.15s ease;
  transition: opacity 0.15s ease;
  pointer-events: none;
  z-index: 1;
}
.tabs-component .tabs-hover-zone.left {
  left: 0;
  background: -webkit-gradient(linear, left top, right top, color-stop(15%, rgba(0, 0, 0, 0.15)), to(rgba(255, 255, 255, 0.25)));
  background: linear-gradient(90deg, rgba(0, 0, 0, 0.15) 15%, rgba(255, 255, 255, 0.25) 100%);
}
.tabs-component .tabs-nav-wrap.at-start .tabs-hover-zone.left {
  display: none;
}
.tabs-component .tabs-hover-zone.right {
  right: 0;
  background: -webkit-gradient(linear, right top, left top, color-stop(15%, rgba(0, 0, 0, 0.15)), to(rgba(255, 255, 255, 0.25)));
  background: linear-gradient(270deg, rgba(0, 0, 0, 0.15) 15%, rgba(255, 255, 255, 0.25) 100%);
}
.tabs-component .tabs-nav-wrap.has-overflow .tabs-hover-zone {
  opacity: 0.6;
  pointer-events: auto;
}
.tabs-component .tabs-nav-wrap.has-overflow:hover .tabs-hover-zone {
  opacity: 1;
}
.tabs-component .tabs-nav-wrap.at-end .tabs-hover-zone.right {
  display: none;
}
.tabs-component .tabs-nav::-webkit-scrollbar {
  display: none;
}
