.wcct-tiles {
	display: grid;

	grid-template-columns: repeat(
		var(--wcct-columns, 4),
		minmax(0, 1fr)
	);

	gap: 10px;

	width: 100%;

	margin: 30px 0 25px;
	padding: 0;

	box-sizing: border-box;
}

.wcct-tile {
	display: flex;

	align-items: center;
	justify-content: center;

	min-height: 52px;

	padding: 12px 16px;

	box-sizing: border-box;

	border: 1px solid #ddd;
	border-radius: 4px;

	background: #fff;
	color: inherit;

	text-align: center;
	text-decoration: none;

	line-height: 1.25;

	transition:
		background-color .15s ease,
		border-color .15s ease,
		transform .15s ease;
}

.wcct-tile:hover {
	border-color: #999;

	background: #f7f7f7;

	color: inherit;

	text-decoration: none;

	transform: translateY(-1px);
}

.wcct-tile--current {
	font-weight: 600;
}

/*
 * Планшет.
 */
@media (max-width: 900px) {

	.wcct-tiles {
		grid-template-columns: repeat(
			2,
			minmax(0, 1fr)
		);
	}

}

/*
 * Телефон.
 */
@media (max-width: 520px) {

	.wcct-tiles {
		grid-template-columns: 1fr;
	}

	.wcct-tile {
		min-height: 48px;
	}

}