/* Optional mobile-only horizontal tab navigation. */
@media (max-width: 767px) {
	.pixel-tabs-mobile-scroll > .pixel-tabs-nav-wrap {
		display: block;
		width: 100%;
		max-width: 100%;
		overflow-x: auto;
		overflow-y: hidden;
		overscroll-behavior-x: contain;
		-webkit-overflow-scrolling: touch;
		-ms-overflow-style: none;
		scrollbar-width: none;
		scroll-snap-type: none;
		touch-action: pan-x pan-y;
	}

	.pixel-tabs-mobile-scroll > .pixel-tabs-nav-wrap::-webkit-scrollbar {
		display: none;
	}

	.pixel-tabs-mobile-scroll > .pixel-tabs-nav-wrap > .pixel-tabs-nav {
		display: flex !important;
		flex-flow: row nowrap !important;
		align-items: stretch !important;
		justify-content: flex-start !important;
		width: max-content !important;
		min-width: max-content !important;
		max-width: none !important;
		padding-bottom: 2px;
		overflow: visible;
	}

	.pixel-tabs-mobile-scroll > .pixel-tabs-nav-wrap > .pixel-tabs-nav > li {
		flex: 0 0 auto !important;
		width: auto !important;
		max-width: none !important;
		margin-bottom: 0 !important;
		scroll-snap-align: none;
	}

	.pixel-tabs-mobile-scroll > .pixel-tabs-nav-wrap > .pixel-tabs-nav > li > a,
	.pixel-tabs-mobile-scroll .pixel-tabs-nav-txt,
	.pixel-tabs-mobile-scroll .pixel-tabs-nav-content .h3 {
		white-space: nowrap;
	}
}

/* The legacy trailing negative margin collapses max-content navigation. */
@media (max-width: 768px) {
 .pixel-tabs.pixel-tabs-style-6 .pixel-tabs-nav li:last-of-type {
  margin-inline-end: 0 !important;
 }
}
/* Horizontal scrolling owns navigation on mobile, including carousel style 8. */
@media (max-width: 767px) {
 .pixel-tabs-style-8.pixel-tabs-mobile-scroll > .pixel-tabs-nav-wrap {
  padding-left: 0;
  mask-image: none;
  -webkit-mask-image: none;
  overflow-x: auto;
 }
 .pixel-tabs-style-8.pixel-tabs-mobile-scroll > .pixel-tabs-nav-wrap > .pixel-tabs-nav {
  transform: none;
  margin-bottom: 0 !important;
 }
 .pixel-tabs-style-8.pixel-tabs-mobile-scroll .pixel-tabs-nav::before {
  display: none;
 }
 .pixel-tabs-style-8.pixel-tabs-mobile-scroll .pixel-tabs-nav > li.active > a {
  background-color: #fff;
  box-shadow: 0 8px 20px rgba(52, 49, 139, .07);
 }
 .pixel-tabs-style-8.pixel-tabs-mobile-scroll .pixel-tabs-nav > li .pixel-tabs-nav-ext {
  position: static !important;
  transform: none !important;
 }
}

@media (max-width: 767px) {
 .pixel-tabs-style-6.pixel-tabs-mobile-scroll .pixel-tabs-nav li + li {
  margin-inline-start: 1em !important;
 }
}

/* Keep style 8 navigation accessible in full-width containers as well. */
.pixel-tabs-style-8 .pixel-tabs-nav-arrows {
 display: flex;
 justify-content: flex-end;
 gap: 10px;
 margin-top: 1em;
}
.pixel-tabs-style-8 .pixel-tabs-nav-arrow {
 position: relative !important;
 inset: auto !important;
 flex: 0 0 52px;
}

/* Persistent custom track: mobile OS overlay scrollbars cannot be forced visible. */
.pixel-tabs-scroll-track { display: none; }
@media (max-width: 767px) {
 .pixel-tabs-mobile-scroll > .pixel-tabs-nav-wrap { min-width: 0; max-width: 100%; }
 .pixel-tabs-mobile-scroll > .pixel-tabs-nav-wrap > .pixel-tabs-nav > li > a {
  touch-action: pan-x pan-y; -webkit-user-drag: none;
 }
 .pixel-tabs-mobile-scrollbar > .pixel-tabs-scroll-track {
  display: block; position: relative; width: 100%; flex: 0 0 auto;
  height: var(--pixel-tab-scroll-height, 4px); min-height: var(--pixel-tab-scroll-height, 4px); margin: 10px 0;
  background: var(--pixel-tab-scroll-track, #e5e7eb); border-radius: 999px;
  touch-action: none; cursor: pointer;
 }
 .pixel-tabs-scroll-thumb {
  display: block; height: 100%; background: var(--pixel-tab-scroll-thumb, #6b7280);
  border-radius: inherit; pointer-events: none;
 }
 .pixel-tabs-scroll-track:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
}