.container-tabs {
	background-color: var(--green);
	padding: 0;
	padding-top: var(--space-8);
	padding-left: var(--space-5);
	padding-bottom: 28px;
	margin: 0 auto var(--space-16);

	--color: var(--white);
	--text-color: var(--white);
	--button-color: var(--green);
}

.container-tabs :is(input, button, select, textarea):focus {
	outline-color: white;
	outline-offset: -1px;
}

/* Tab Active/Inactive Functionality */
.container-tabs .tab-outer {
	opacity: 1;
	transition: opacity 150ms ease;
	overflow: hidden;
}

.container-tabs .tab-outer.animating { opacity: 0; }

.inner-tab-cont:not(.active),
.inner-tab-cont:not(.active) .contentRender,
.container-tabs .tab-outer > div.contentRender:not(.active):not(.contentRender_name_plugins_common_custom_tab_inner) {
	opacity: 0;
	height: 0;
	pointer-events:none;
}

.container-tabs .tabs-header {
	display: flex;
	overflow-x: auto;
	overflow-y: hidden;
	white-space: nowrap;
	padding-bottom: var(--space-3);
	margin: 0;
	margin-bottom: var(--space-12);
}

/*Tabs*/
.container-tabs .tabs {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	gap: var(--space-1);
}

.container-tabs .tabs button {
	width: max-content;
	font-family: var(--font-display);
	font-size: var(--text-xl);
	font-weight: 600;
	color: var(--beige);
	line-height: var(--leading-none);
	background-color: transparent;
	padding: var(--space-3) var(--space-3) 10px;
}

.container-tabs .tabs li.active button {
	color: var(--green);
	background-color: var(--yellow);
}

@media (min-width: 64em) {
	.container-tabs {
		padding-top: var(--space-12);
		padding-bottom: var(--space-10);
	}

	.container-tabs .tabs-header { margin-bottom: 86px; }

	.container-tabs .tabs button {
		font-size: 1.5625rem;
		padding: var(--space-4) var(--space-3) 10px;
	}
}

@media (min-width: 90em) {
	.container-tabs { padding-left: 140px; }
}