:root {
	--tcgs-tab-color-item-text: var(--wp--preset--color--raft-accent);
	--tcgs-tab-color-selected-text: var(--wp--preset--color--raft-accent-secondary);
	--tcgs-tab-color-bar-border: var(--wp--preset--color--raft-accent);
	--tcgs-tab-color-item-border: var(--wp--preset--color--raft-accent);
	--tcgs-tab-color-selected-border: var(--wp--preset--color--raft-accent-secondary);
	--tcgs-tab-color-bar-back: transparent;
	--tcgs-tab-color-item-back: transparent;
	--tcgs-tab-color-selected-back: var(--wp--preset--color--custom-bloc-orange);
	--tcgs-tab-item-font-family: var(--wp--preset--font-family--figtree);
	/* --tcgs-tab-item-font-family: var(--wp--preset--font-family--fjalla-one); */
}

.tcgs-tab-bar {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	box-sizing: border-box;
	background-color: var(--tcgs-tab-color-bar-back);
	border-bottom: 3px solid var(--tcgs-tab-color-bar-border);
}

.tcgs-tab-item {
	cursor: pointer;
	box-sizing: border-box;
	margin-top: 3px;
	margin-bottom: -3px;
	padding: 10px 20px;
	background-color: var(--tcgs-tab-color-item-back);
	border-bottom: 3px solid var(--tcgs-tab-color-item-border);
	color: var(--tcgs-tab-color-item-text);
	font-family: var(--tcgs-tab-item-font-family);
}

.tcgs-tab-item.tcgs-selected {
	background-color: var(--tcgs-tab-color-selected-back);
	border-bottom: 3px solid var(--tcgs-tab-color-selected-border);
	color: var(--tcgs-tab-color-selected-text);
}