/* Atlantis UI pilot: project tokens and geometry for catalog navigation only.
   Vendor CSS is copied from the pinned build; all storefront adaptation stays here. */
.at-shop .atl-theme-categories[data-atl-theme] {
	--atl-font-sans: var(--at-font);
	--atl-txt-s: var(--at-size-xs);
	--atl-lh-normal: var(--at-lh-body);
	--atl-r-s: 0;
	--atl-color-bg: transparent;
	--atl-color-text: var(--at-ink);
	--atl-color-text-secondary: var(--at-ink);
	--atl-color-surface: transparent;
	--atl-color-surface-hover: var(--at-accent-dark);
	--atl-color-border: var(--at-border);
	--atl-color-border-strong: var(--at-border);
	--atl-color-primary: var(--at-accent-dark);
	--atl-color-primary-hover: var(--at-accent-dark);
	--atl-color-primary-active: var(--at-accent-dark);
	--atl-color-primary-glow: transparent;
	--atl-color-primary-contrast-text: var(--at-surface);
	--atl-transition-fast: var(--at-ease);
	--atl-transition-normal: var(--at-ease);
	display: flex;
	clear: both;
	justify-content: flex-start;
	flex-wrap: nowrap;
	gap: 0;
	margin-bottom: var(--at-space-lg);
	overflow-x: auto;
	border-block: 1px solid var(--at-border);
	scrollbar-width: none;
}

.at-shop .atl-theme-categories[data-atl-theme]::-webkit-scrollbar { display: none; }

.at-shop .atl-theme-categories[data-atl-theme] .atl-theme-category {
	flex: none;
	height: auto;
	padding: 13px 18px;
	border: 0;
	border-right: 1px solid var(--at-border);
	color: var(--atl-color-text-secondary);
	line-height: var(--at-lh-body);
	text-decoration: none;
}

.at-shop .atl-theme-categories[data-atl-theme] .atl-theme-category.atl-btn--primary,
.at-shop .atl-theme-categories[data-atl-theme] .atl-theme-category:hover {
	color: var(--atl-color-primary-contrast-text);
	text-decoration: none;
}

/* Keep the keyboard indicator inside the scrolling strip so it cannot be clipped. */
.at-shop .atl-theme-categories[data-atl-theme] .atl-theme-category:focus-visible {
	outline: 2px solid var(--at-accent);
	outline-offset: -3px;
}

@media (max-width: 767px) {
	.at-shop .atl-theme-categories[data-atl-theme] {
		margin-inline: calc(var(--at-gutter) * -1);
		padding-left: var(--at-gutter);
		padding-bottom: 4px;
	}
	.at-shop .atl-theme-categories[data-atl-theme] .atl-theme-category { padding: 11px 14px; }
}