.tabList {
	display: flex;
	flex-direction: row;
	border-bottom: 2px solid var(--border);
}

.tabList svg {
	--icon-size: 16px;
	min-width: var(--icon-size);
	min-height: var(--icon-size);
	max-width: var(--icon-size);
	max-height: var(--icon-size);
	margin-inline-end: var(--s-1-5);
}

.tabButton img {
	min-width: 16px;
	min-height: 16px;
	margin-inline-end: var(--s-1-5);
}

.padded .tabPanel {
	padding-block-start: var(--s-4);
}

.disappearing:has(.tabList .tabButton:only-child).padded .tabPanel {
	padding-top: 0;
}

.disappearing .tabList:has(.tabButton:only-child) {
	display: none;
}

.tabButton {
	background-color: transparent;
	border: none;
	font-size: var(--fonts-xs);
	border-radius: 0;
	border-bottom: 2px solid transparent;
	color: var(--text-lighter);
	white-space: nowrap;
	flex: 1;
	transform: none !important;
}

.tabButton[data-selected] {
	border-color: var(--theme);
	color: var(--text);
}

.tabButton[data-focus-visible] {
	color: var(--theme) !important;
	outline: none;
}

.tabNumber {
	color: var(--theme);
	margin-inline-start: var(--s-2);
}

.sticky {
	position: sticky;
	top: 47px;
	z-index: 1;
	background-color: var(--bg);
}