/*
 * Gemeinsame Scrollmechanik fuer die verbleibenden Haupt-Untertab-Leisten.
 * Farben und Tab-Geometrie verbleiben in den jeweiligen Bereichsregeln.
 */

#skaoTabs.is-subtab-pinned,
.experiment-tab-sticky.is-subtab-pinned,
#aboutTabs.is-subtab-pinned,
.thanks-tabs.is-subtab-pinned {
  position: fixed;
  top: calc(var(--main-nav-top) + var(--main-nav-height) + var(--sticky-gap));
  left: 50%;
  z-index: 905;
  width: min(1240px, calc(100% - clamp(24px, 3vw, 44px)));
  margin: 0;
  transform: translateX(-50%);
}

#skaoTabs.is-subtab-pinned {
  gap: 6px;
  padding: 4px;
  border-radius: 18px;
}

#aboutTabs.is-subtab-pinned,
.thanks-tabs.is-subtab-pinned {
  gap: 6px;
  padding: 4px;
  border-radius: 18px;
}

.experiment-tab-sticky.is-subtab-pinned {
  padding: 0;
  border-radius: 18px;
  background: transparent;
}

.experiment-tab-sticky.is-subtab-pinned :is(#experimentTabs, #curiosityTabs, #mediaTabs) {
  gap: 6px;
  padding: 4px;
  border-radius: 18px;
}

#skaoTabs.is-subtab-pinned .mini-tab,
.experiment-tab-sticky.is-subtab-pinned .mini-tab,
#aboutTabs.is-subtab-pinned .mini-tab,
.thanks-tabs.is-subtab-pinned .thanks-tab {
  min-height: 38px;
  padding: 7px 11px;
  font-size: 0.84rem;
}

.shared-subtab-placeholder {
  width: 100%;
  margin: 0;
  pointer-events: none;
}

@media (max-width: 600px) {
  #skaoTabs.is-subtab-pinned,
  .experiment-tab-sticky.is-subtab-pinned,
  #aboutTabs.is-subtab-pinned,
  .thanks-tabs.is-subtab-pinned {
    position: static;
    width: auto;
    transform: none;
  }

  .shared-subtab-placeholder {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  #skaoTabs,
  .experiment-tab-sticky,
  #experimentTabs,
  #aboutTabs,
  .thanks-tabs {
    transition: none;
  }
}