@import '../../stylesheets/_variables.scss';

.woocommerce-marketplace {
	&__tabs {
		box-sizing: content-box;
		display: flex;
		gap: 24px;
	}

	&__tab-button {
		border-bottom: 1.5px solid transparent;
		border-radius: 0;
		color: $mauve-light-12;
		font-size: 13px;
		font-style: normal;
		font-weight: 600;
		height: 48px;
		line-height: 16px;
		margin: 0 1.5rem 0 0;
		padding: 0;

		&:focus:not(:disabled) {
			box-shadow: none;
		}

		&.is-active {
			border-color: var(--wp-admin-theme-color);
		}
	}
}

@media (width <= $breakpoint-medium) {
	.woocommerce-marketplace__tabs {
		border-bottom: 1px solid $gutenberg-gray-300;
	}
}

@media screen and (min-width: $breakpoint-medium) {
	.woocommerce-marketplace__tabs {
		padding: 0 $content-spacing-large;
	}
}