/* TJ Sokol Slider – frontend
   Klubové barvy (červená + zelená), Barlow Condensed nadpisy, bez zaoblení rohů. */

.tjss-slider {
	--tjss-height: 640px;
	--tjss-speed: 800ms;
	--tjss-accent: #c8102e;
	--tjss-green: #0d2014;
	position: relative;
	width: 100%;
	height: var(--tjss-height);
	overflow: hidden;
	background: #0b0f0c;
	font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
	isolation: isolate;
}

.tjss-track {
	position: absolute;
	inset: 0;
}

/* ---- Slide ---- */
.tjss-slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity var(--tjss-speed) ease, visibility 0s linear var(--tjss-speed);
	z-index: 1;
}
.tjss-slide.is-active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transition: opacity var(--tjss-speed) ease, visibility 0s;
	z-index: 2;
}

.tjss-media {
	position: absolute;
	inset: -8% 0;               /* rezerva pro paralax */
	will-change: transform;
}
.tjss-img,
.tjss-video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* ---- Animace vstupu (aktivace přes .is-active + [data-anim]) ---- */
.tjss-slide[data-anim="slide"]        { transform: translateX(6%); transition: opacity var(--tjss-speed) ease, transform var(--tjss-speed) ease, visibility 0s linear var(--tjss-speed); }
.tjss-slide[data-anim="slide"].is-active { transform: translateX(0); }

.tjss-slide[data-anim="zoom"] .tjss-media        { transform: scale(1.12); transition: transform calc(var(--tjss-speed) * 1.4) ease; }
.tjss-slide[data-anim="zoom"].is-active .tjss-media { transform: scale(1); }

.tjss-slide[data-anim="flip"]        { transform: perspective(1400px) rotateY(8deg); transform-origin: left center; transition: opacity var(--tjss-speed) ease, transform var(--tjss-speed) ease, visibility 0s linear var(--tjss-speed); }
.tjss-slide[data-anim="flip"].is-active { transform: perspective(1400px) rotateY(0); }

/* Ken Burns – trvalý pomalý pohyb aktivního slidu */
.tjss-slide[data-anim="kenburns"].is-active .tjss-media {
	animation: tjss-kenburns 12s ease-out forwards;
}
@keyframes tjss-kenburns {
	from { transform: scale(1.02) translate(0, 0); }
	to   { transform: scale(1.16) translate(-2%, -2%); }
}

@media (prefers-reduced-motion: reduce) {
	.tjss-slide, .tjss-media { transition: opacity 200ms ease !important; animation: none !important; transform: none !important; }
}

/* ---- Overlay ---- */
.tjss-overlay {
	position: absolute;
	inset: 0;
	z-index: 3;
	pointer-events: none;
}
.tjss-overlay-club-bars {
	background-image: repeating-linear-gradient(
		90deg,
		var(--tjss-bar-color, rgba(13,32,20,.5)) 0 3px,
		transparent 3px 14px
	);
}

/* ---- Obsah ---- */
.tjss-content {
	position: absolute;
	inset: 0;
	z-index: 4;
	display: flex;
	padding: clamp(20px, 5vw, 72px);
	pointer-events: none;
}
/* pokud je uvnit\u0159 .tjss-stage (r\u00e1m str\u00e1nky), .tjss-content pouze centruje r\u00e1m */
.tjss-content:has(.tjss-stage) { justify-content: center; align-items: stretch; }
.tjss-stage {
	display: flex;
	width: 100%;
	max-width: var(--tjss-stage, none);
	height: 100%;
	pointer-events: none;
}
.tjss-content-inner {
	max-width: var(--tjss-maxw, 640px);
	pointer-events: auto;
	color: var(--tjss-text, #fff);
	font-family: var(--tjss-fb, "Inter", sans-serif);
	transform: translateY(14px);
	opacity: 0;
	transition: transform 700ms cubic-bezier(.2,.7,.2,1) 150ms, opacity 700ms ease 150ms;
}

/* zarovnání – ruční přepis podle pozice */
.tjss-align-left   { text-align: left; }
.tjss-align-center { text-align: center; }
.tjss-align-right  { text-align: right; }
.tjss-slide.is-active .tjss-content-inner { transform: translateY(0); opacity: 1; }

/* pozice textu */
.tjss-pos-top-left      { align-items: flex-start;   justify-content: flex-start; text-align: left; }
.tjss-pos-top-center    { align-items: flex-start;   justify-content: center;     text-align: center; }
.tjss-pos-top-right     { align-items: flex-start;   justify-content: flex-end;   text-align: right; }
.tjss-pos-center-left   { align-items: center;       justify-content: flex-start; text-align: left; }
.tjss-pos-center-center { align-items: center;       justify-content: center;     text-align: center; }
.tjss-pos-center-right  { align-items: center;       justify-content: flex-end;   text-align: right; }
.tjss-pos-bottom-left   { align-items: flex-end;     justify-content: flex-start; text-align: left; }
.tjss-pos-bottom-center { align-items: flex-end;     justify-content: center;     text-align: center; }
.tjss-pos-bottom-right  { align-items: flex-end;     justify-content: flex-end;   text-align: right; }
.tjss-pos-center-center .tjss-content-inner,
.tjss-pos-top-center .tjss-content-inner,
.tjss-pos-bottom-center .tjss-content-inner { margin-inline: auto; }

.tjss-kicker {
	display: inline-block;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: .16em;
	text-transform: uppercase;
	padding: 6px 12px;
	background: var(--tjss-accent);
	color: #fff;
	margin-bottom: 16px;
}
.tjss-heading {
	font-family: var(--tjss-fh, "Barlow Condensed", "Inter", sans-serif);
	font-weight: var(--tjss-hweight, 700);
	line-height: .98;
	text-transform: uppercase;
	font-size: calc(clamp(34px, 6vw, 76px) * var(--tjss-hscale, 1));
	margin: 0 0 14px;
	text-shadow: 0 2px 24px rgba(0,0,0,.4);
}
.tjss-sub {
	font-size: clamp(15px, 1.6vw, 20px);
	line-height: 1.5;
	margin: 0 0 24px;
	color: var(--tjss-text, rgba(255,255,255,.9));
	text-wrap: pretty;
}
/* skupina tlačítek */
.tjss-btns {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}
.tjss-pos-top-center .tjss-btns,
.tjss-pos-center-center .tjss-btns,
.tjss-pos-bottom-center .tjss-btns,
.tjss-align-center .tjss-btns { justify-content: center; }
.tjss-pos-top-right .tjss-btns,
.tjss-pos-center-right .tjss-btns,
.tjss-pos-bottom-right .tjss-btns,
.tjss-align-right .tjss-btns { justify-content: flex-end; }
.tjss-btn {
	display: inline-block;
	font-weight: 700;
	font-size: 15px;
	letter-spacing: .04em;
	text-transform: uppercase;
	padding: 15px 30px;
	text-decoration: none;
	transition: background .18s ease, color .18s ease, border-color .18s ease;
	cursor: pointer;
}
.tjss-btn-primary { background: var(--tjss-accent); color: #fff; border: 2px solid var(--tjss-accent); }
.tjss-btn-primary:hover { background: transparent; color: #fff; }
.tjss-btn-dark { background: var(--tjss-green); color: #fff; border: 2px solid var(--tjss-green); }
.tjss-btn-dark:hover { background: transparent; color: #fff; }
.tjss-btn-white { background: #fff; color: var(--tjss-green); border: 2px solid #fff; }
.tjss-btn-white:hover { background: transparent; color: #fff; }
.tjss-btn-ghost { background: transparent; color: #fff; border: 2px solid rgba(255,255,255,.8); }
.tjss-btn-ghost:hover { background: #fff; color: var(--tjss-green); border-color: #fff; }
.tjss-btn-custom { border: 2px solid transparent; }
.tjss-btn-custom:hover { filter: brightness(1.12); }

/* ---- Šipky ---- */
.tjss-arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 6;
	width: 54px;
	height: 54px;
	display: grid;
	place-items: center;
	color: #fff;
	background: rgba(13,32,20,.42);
	border: none;
	cursor: pointer;
	transition: background .18s ease;
}
.tjss-arrow:hover { background: var(--tjss-accent); }
.tjss-arrow:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.tjss-prev { left: 0; }
.tjss-next { right: 0; }
.tjss-arrows-minimal .tjss-arrow { background: transparent; }
.tjss-arrows-minimal .tjss-arrow:hover { background: rgba(0,0,0,.3); }

/* ---- Tečky ---- */
.tjss-dots {
	position: absolute;
	bottom: 22px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 6;
	display: flex;
	gap: 10px;
}
.tjss-dot {
	width: 30px;
	height: 4px;
	background: rgba(255,255,255,.4);
	border: none;
	cursor: pointer;
	padding: 0;
	transition: background .2s ease, width .2s ease;
}
.tjss-dot:hover { background: rgba(255,255,255,.7); }
.tjss-dot.is-active { background: var(--tjss-accent); width: 46px; }
.tjss-dot:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

/* ---- Ukazatel průběhu ---- */
.tjss-progress {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 4px;
	background: rgba(255,255,255,.15);
	z-index: 6;
}
.tjss-progress span {
	display: block;
	height: 100%;
	width: 0;
	background: var(--tjss-accent);
}

.tjss-notice {
	padding: 16px 20px;
	background: #fff4f5;
	border-left: 4px solid #c8102e;
	color: #7a1020;
	font-family: system-ui, sans-serif;
}

@media (max-width: 640px) {
	.tjss-arrow { width: 42px; height: 42px; }
	.tjss-content { padding: 20px; }

	/* menší nadpis dle nastavení slidu */
	.tjss-heading { font-size: calc(clamp(34px, 6vw, 76px) * var(--tjss-hscale, 1) * var(--tjss-mscale, .78)); }

	/* mobilní pozice textu */
	.tjss-mpos-top-left      { align-items: flex-start; justify-content: flex-start; }
	.tjss-mpos-top-center    { align-items: flex-start; justify-content: center; text-align: center; }
	.tjss-mpos-top-right     { align-items: flex-start; justify-content: flex-end; text-align: right; }
	.tjss-mpos-center-left   { align-items: center; justify-content: flex-start; }
	.tjss-mpos-center-center { align-items: center; justify-content: center; text-align: center; }
	.tjss-mpos-center-right  { align-items: center; justify-content: flex-end; text-align: right; }
	.tjss-mpos-bottom-left   { align-items: flex-end; justify-content: flex-start; }
	.tjss-mpos-bottom-center { align-items: flex-end; justify-content: center; text-align: center; }
	.tjss-mpos-bottom-right  { align-items: flex-end; justify-content: flex-end; text-align: right; }
	[class*="tjss-mpos-"].tjss-mpos-top-center .tjss-content-inner,
	[class*="tjss-mpos-"].tjss-mpos-center-center .tjss-content-inner,
	[class*="tjss-mpos-"].tjss-mpos-bottom-center .tjss-content-inner { margin-inline: auto; }

	/* mobilní zarovnání */
	.tjss-malign-left   { text-align: left; }
	.tjss-malign-center { text-align: center; }
	.tjss-malign-right  { text-align: right; }

	/* skrytí prvků na mobilu */
	.tjss-mhide-sub .tjss-sub { display: none; }
	.tjss-mhide-btn .tjss-btns { display: none; }
}