.elementor-widget-tooto-archive-tabs {
	min-width: 0;
	max-width: 100%;
}

.tooto-archive-tabs {
	--tooto-tabs-gutter-left: 0px;
	--tooto-tabs-gutter-right: 0px;
	--tooto-tabs-align: flex-start;
	--tooto-tabs-gap: 16px;
	--tooto-tabs-padding: 8px 16px;
	--tooto-tabs-border-width: 1px;
	--tooto-tabs-border-radius: 4px;
	--tooto-tabs-text-normal: #5c5c5c;
	--tooto-tabs-background-normal: transparent;
	--tooto-tabs-border-normal: #dadadd;
	--tooto-tabs-text-hover: #f33030;
	--tooto-tabs-background-hover: #f3303012;
	--tooto-tabs-border-hover: #f33030;
	--tooto-tabs-text-active: #f33030;
	--tooto-tabs-background-active: #f3303012;
	--tooto-tabs-border-active: #f33030;
	min-width: 0;
	width: 100%;
}

.tooto-archive-tabs__viewport {
	width: calc(100% + var(--tooto-tabs-gutter-left) + var(--tooto-tabs-gutter-right));
	min-width: 0;
	margin-left: calc(-1 * var(--tooto-tabs-gutter-left));
	margin-right: calc(-1 * var(--tooto-tabs-gutter-right));
	overflow-x: auto;
	overflow-y: hidden;
	overscroll-behavior-x: contain;
	scrollbar-width: none;
	scroll-behavior: auto;
}

.tooto-archive-tabs__viewport::-webkit-scrollbar {
	display: none;
}

.tooto-archive-tabs .tooto-archive-tabs__list {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: var(--tooto-tabs-align);
	gap: var(--tooto-tabs-gap);
	width: max-content;
	min-width: 100%;
	box-sizing: border-box;
	margin: 0;
	/* Gutters scroll with the links; the viewport itself reaches the screen edges. */
	padding: 0 var(--tooto-tabs-gutter-right) 0 var(--tooto-tabs-gutter-left);
	list-style: none;
}

.tooto-archive-tabs__list > li {
	display: flex;
	flex: 0 0 auto;
	margin: 0;
	padding: 0;
}

.tooto-archive-tabs__list > li > a {
	display: block;
	box-sizing: border-box;
	padding: var(--tooto-tabs-padding);
	border-style: solid;
	border-width: var(--tooto-tabs-border-width);
	border-radius: var(--tooto-tabs-border-radius);
	border-color: var(--tooto-tabs-border-normal);
	color: var(--tooto-tabs-text-normal);
	background-color: var(--tooto-tabs-background-normal);
	font-family: Poppins, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.4;
	white-space: nowrap;
	text-decoration: none;
	transition: color 150ms ease, background-color 150ms ease, border-color 150ms ease;
}

@media (hover: hover) {
	.tooto-archive-tabs__list > li > a:hover {
		color: var(--tooto-tabs-text-hover);
		background-color: var(--tooto-tabs-background-hover);
		border-color: var(--tooto-tabs-border-hover);
	}
}

.tooto-archive-tabs__list > .current-menu-item > a,
.tooto-archive-tabs__list > li > a[aria-current="page"] {
	color: var(--tooto-tabs-text-active);
	background-color: var(--tooto-tabs-background-active);
	border-color: var(--tooto-tabs-border-active);
}

.tooto-archive-tabs__list > li > a:focus-visible {
	/* Inset so the native scrolling viewport never clips the keyboard indicator. */
	outline: 2px solid var(--theme-palette-color-1, #f33030);
	outline-offset: -3px;
}

.tooto-archive-tabs__empty {
	padding: 16px;
	border: 1px dashed #a3a3a3;
	color: #767676;
	font-size: 14px;
}

@media (prefers-reduced-motion: reduce) {
	.tooto-archive-tabs__list > li > a {
		transition: none;
	}
}