/* Кастомные стили для tiny-slider */
:root {
	--tns-control-size: 60px;
	--tns-controls-gap: 4px;
	--tns-controls-width: calc(var(--tns-control-size) * 2 + var(--tns-controls-gap));
}

.tns-control-custom,
.tns-controls [data-controls="prev"],
.tns-controls [data-controls="next"] {
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius:50%;
	pointer-events:auto;
	color:#ffffff;
	font-size: calc(var(--tns-control-size) / 2 - var(--tns-control-size) / 10);
	cursor: pointer;
}

.tns-control-custom:not(:hover),
.tns-controls [data-controls="prev"]:not(:hover),
.tns-controls [data-controls="next"]:not(:hover) {
	background: hsl(var(--bg-dark-h), var(--bg-dark-s), var(--bg-dark-l), 20%);
}

.tns-control-custom:hover,
.tns-controls [data-controls="prev"]:hover,
.tns-controls [data-controls="next"]:hover {
	background: hsl(var(--bg-dark-h), var(--bg-dark-s), var(--bg-dark-l), 50%);
}

.tns-control-custom:disabled,
.tns-control-custom[aria-disabled="true"],
.tns-controls [data-controls="prev"]:disabled,
.tns-controls [data-controls="prev"][aria-disabled="true"],
.tns-controls [data-controls="next"]:disabled,
.tns-controls [data-controls="next"][aria-disabled="true"] {
	background:transparent;
	color:transparent;
	cursor:not-allowed;
	pointer-events: none;
}

.tns-control-custom[data-controls="prev"] i,
.tns-controls [data-controls="prev"] i {
	margin-right:2px;
}

.tns-control-custom[data-controls="next"] i,
.tns-controls [data-controls="next"] i {
	margin-left:2px;
}

.tns-liveregion,
.tns-controls,
.tns-controls [data-controls="prev"],
.tns-controls [data-controls="next"],
.tns-control-custom {
	height: var(--tns-control-size);
	line-height: var(--tns-control-size);
}

.tns-control-custom,
.tns-controls [data-controls="prev"],
.tns-controls [data-controls="next"] {
	width: var(--tns-control-size);
}

@media screen and (max-width: 1023px) {
	:root {
		--tns-control-size: 48px;
	}
}
