/* =========================================================
   UKÁZKY – společné proměnné
========================================================= */
:root {
	--uk-gap: 14px;
	--uk-rail-h: 220px;
}

/* =========================================================
   Sekce galerie
========================================================= */

.uk-title {
	font-size: 1.8rem;
	margin-bottom: 20px;
	font-weight: 700;
	color: var(--barva-text);
}

/* =========================================================
   Slider – kontejner se šipkami
========================================================= */
.uk-rail-wrap {
	position: relative;
	padding: 0 60px;
	overflow: visible; /* šipky mohou lehce přetékat */
}

/* =========================================================
   Vnitřní řada obrázků
========================================================= */
.uk-rail {
	display: flex;
	gap: var(--uk-gap);
	overflow-x: auto;
	scroll-behavior: smooth;
	padding-bottom: 10px;
	scroll-snap-type: x mandatory;
}

/* Scrollbar skryt */
.uk-rail::-webkit-scrollbar {
	display: none;
}
.uk-rail {
	-ms-overflow-style: none;
	scrollbar-width: none;
}

/* =========================================================
   Jednotlivé položky slideru
========================================================= */
.uk-item {
	display: block;
	flex-shrink: 0;
	min-width: 240px;
	max-height: 180px;
	border-radius: 14px;
	background: var(--barva-povrch, #fff);
	box-shadow: var(--stin, 0 2px 8px rgba(0, 0, 0, 0.08));
	border: 1px solid #e7e0d6;
	overflow: hidden;
	scroll-snap-align: start;
	transition: transform 0.15s ease;
}

.uk-item:hover {
	transform: translateY(-2px);
}

/* =========================================================
   Obrázky
========================================================= */
.uk-img {
	display: block;
	width: 100%;
	height: 180px;
	object-fit: cover;
	transition: filter 0.2s ease;
}

.uk-item:hover .uk-img {
	filter: brightness(0.9);
}

/* =========================================================
   Šipky slideru
========================================================= */
.uk-nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: rgba(255, 255, 255, 0.85);
	border: 1px solid #d2c7bd;
	border-radius: 12px;
	padding: 10px 14px;
	font-size: 18px;
	font-weight: bold;
	color: #4a3b31;
	cursor: pointer;
	backdrop-filter: blur(4px);
	z-index: 20;
	transition: 0.2s ease;
}

.uk-nav:hover {
	transform: translateY(-50%) scale(1.1);
}

.uk-nav--prev {
	left: 16px;
}

.uk-nav--next {
	right: 16px;
}

/* =========================================================
   Mobile úpravy
========================================================= */
@media (max-width: 600px) {
	.ukazky-sekce {
		margin: 0;
		padding-top: 10px;
	}

	.uk-img {
		height: 180px;
		width: 100%;
	}
}
@media (max-width: 900px) {
	.uk-nav--next {
		top: 210px;
	}
	.uk-nav--prev {
		top: 210px;
	}
	.uk-rail-wrap {
		padding: 0px;
		margin: 0px;
	}
	.ukazky-sekce {
		padding: 0px;
		margin: 10px 0;
	}
	.section-container {
		padding-bottom: 40px;
	}
}
@media (max-width: 900px) {
	.uk-nav {
		display: none !important;
	}
}