/* TREJKA Media Folders – galeria */
.tmf-gallery { margin: 0 0 1.5em; --tmf-cols: 3; --tmf-gap: 20px; --tmf-h: 300px; }
.tmf-gallery > ul { list-style: none; margin: 0; padding: 0; }
.tmf-gallery > ul.crop { display: grid; grid-template-columns: repeat(var(--tmf-cols), minmax(0, 1fr)); gap: var(--tmf-gap); }
.tmf-gallery > ul.no-crop { column-count: var(--tmf-cols); column-gap: var(--tmf-gap); }
.tmf-gallery > ul > li { margin: 0; padding: 0; list-style: none; }
.tmf-gallery > ul.crop > li { height: var(--tmf-h); }
.tmf-gallery > ul.no-crop > li { break-inside: avoid; margin-bottom: var(--tmf-gap); }
.tmf-gallery li > figure { margin: 0; position: relative; height: 100%; overflow: hidden; }
.tmf-gallery li a { display: block; height: 100%; }
.tmf-gallery img { display: block; width: 100%; max-width: 100%; }
.tmf-gallery > ul.crop img { height: 100%; object-fit: cover; }
.tmf-gallery > ul.no-crop img { height: auto; }
.tmf-gallery figcaption {
	position: absolute; left: 0; right: 0; bottom: 0; margin: 0;
	padding: 6px 10px; font-size: 13px; line-height: 1.4;
	color: #fff; background: linear-gradient(transparent, rgba(0,0,0,.65));
}
.tmf-gallery.tmf-lightbox li { cursor: zoom-in; }

/* ---------- efekty po najechaniu ---------- */
.tmf-gallery { --tmf-ga: #2271b1; --tmf-radius: 0px; }
.tmf-gallery li > figure { border-radius: var(--tmf-radius); isolation: isolate; }
.tmf-gallery.tmf-hover img { transition: transform .5s cubic-bezier(.2,.7,.2,1), filter .4s ease, opacity .35s ease; }
.tmf-gallery.tmf-hover li > figure { transition: transform .3s ease, box-shadow .3s ease; }
.tmf-gallery.tmf-hover li:focus-visible { outline: 2px solid var(--tmf-ga); outline-offset: 3px; }

/* Delikatne powiększenie */
.tmf-hover-zoom li:focus-visible img,
.tmf-hover-zoom li:focus-within img { transform: scale(1.06); }

/* Uniesienie z cieniem */
.tmf-hover-lift li > figure { overflow: hidden; }
.tmf-hover-lift li:focus-visible > figure,
.tmf-hover-lift li:focus-within > figure { transform: translateY(-4px); box-shadow: 0 12px 26px rgba(0,0,0,.2); }

/* Przyciemnienie + ikona */
.tmf-hover-dim li > figure::after {
	content: ""; position: absolute; inset: 0; background: #000; opacity: 0; transition: opacity .3s ease; pointer-events: none; z-index: 1;
}
.tmf-hicon {
	position: absolute; top: 50%; left: 50%; z-index: 2; width: 46px; height: 46px; margin: -23px 0 0 -23px;
	border-radius: 50%; background: rgba(255,255,255,.95); color: var(--tmf-ga); padding: 11px; box-sizing: border-box;
	opacity: 0; transform: scale(.7); transition: opacity .3s ease, transform .3s ease; pointer-events: none; line-height: 0;
}
.tmf-hicon svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.tmf-hover-dim li:focus-visible > figure::after, .tmf-hover-dim li:focus-within > figure::after { opacity: .38; }
.tmf-hover-dim li:focus-visible .tmf-hicon, .tmf-hover-dim li:focus-within .tmf-hicon { opacity: 1; transform: scale(1); }

/* Podpis wysuwany z dołu (+ lekkie powiększenie) */
.tmf-gallery figcaption.tmf-hcap {
	z-index: 2; padding: 22px 12px 10px; font-size: 14px; font-weight: 500;
	background: linear-gradient(transparent, rgba(0,0,0,.78));
	transform: translateY(100%); opacity: 0; transition: transform .35s ease, opacity .35s ease;
}
.tmf-hover-caption li:focus-visible figcaption.tmf-hcap, .tmf-hover-caption li:focus-within figcaption.tmf-hcap { transform: none; opacity: 1; }
.tmf-hover-caption li:focus-visible img, .tmf-hover-caption li:focus-within img { transform: scale(1.04); }

/* Z czerni i bieli do koloru */
.tmf-hover-color img { filter: grayscale(1); }
.tmf-hover-color li:focus-visible img, .tmf-hover-color li:focus-within img { filter: none; }

/* Ramka w kolorze akcentu */
.tmf-hover-border li > figure::before {
	content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; pointer-events: none;
	box-shadow: inset 0 0 0 0 var(--tmf-ga); transition: box-shadow .25s ease;
}
.tmf-hover-border li:focus-visible > figure::before, .tmf-hover-border li:focus-within > figure::before { box-shadow: inset 0 0 0 4px var(--tmf-ga); }

/* Myszka – te same efekty po najechaniu */
@media (hover: hover) {
	.tmf-hover-zoom li:hover img { transform: scale(1.06); }
	.tmf-hover-lift li:hover > figure { transform: translateY(-4px); box-shadow: 0 12px 26px rgba(0,0,0,.2); }
	.tmf-hover-dim li:hover > figure::after { opacity: .38; }
	.tmf-hover-dim li:hover .tmf-hicon { opacity: 1; transform: scale(1); }
	.tmf-hover-caption li:hover figcaption.tmf-hcap { transform: none; opacity: 1; }
	.tmf-hover-caption li:hover img { transform: scale(1.04); }
	.tmf-hover-color li:hover img { filter: none; }
	.tmf-hover-focus ul:has(> li:hover) > li:not(:hover) img { opacity: .4; filter: saturate(.5); }
	.tmf-hover-border li:hover > figure::before { box-shadow: inset 0 0 0 4px var(--tmf-ga); }
}
/* Ekrany dotykowe: podpisy widoczne od razu, zdjęcia w kolorze */
@media (hover: none) {
	.tmf-gallery figcaption.tmf-hcap { transform: none; opacity: 1; }
	.tmf-hover-color img { filter: none; }
}
/* Ograniczony ruch: bez powiększania i przesuwania, zostają zmiany koloru i przezroczystości */
@media (prefers-reduced-motion: reduce) {
	.tmf-gallery.tmf-hover img, .tmf-gallery.tmf-hover li > figure, .tmf-hicon, .tmf-gallery figcaption.tmf-hcap { transition: opacity .2s ease, filter .2s ease; }
	.tmf-gallery.tmf-hover li img { transform: none !important; }
	.tmf-gallery.tmf-hover li > figure { transform: none !important; }
	.tmf-hicon { transform: none !important; }
	.tmf-gallery figcaption.tmf-hcap { transform: none !important; }
}

/* ---------- lightbox ---------- */
html.tmf-lb-open { overflow: hidden; }
.tmf-lb {
	position: fixed; inset: 0; z-index: 999999; background: #0b0b0d; color: #eee;
	display: grid; grid-template-rows: 48px 1fr auto auto; font-family: inherit;
	--tmf-lb-thumb: 64px;
}
.tmf-lb-bar { display: flex; align-items: center; justify-content: space-between; padding: 0 8px 0 16px; }
.tmf-lb-count { font-size: 13px; color: #aaa; font-variant-numeric: tabular-nums; }
.tmf-lb-tools { display: flex; gap: 6px; }
.tmf-lb-btn {
	width: 40px; height: 40px; border-radius: 50%; border: 0; padding: 9px; cursor: pointer;
	background: rgba(255,255,255,.1); color: #fff; line-height: 0;
}
.tmf-lb-btn svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.tmf-lb-btn:hover, .tmf-lb-btn:focus-visible { background: rgba(255,255,255,.24); outline: none; }
.tmf-lb-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 48px; height: 48px; z-index: 2; }
.tmf-lb.has-thumbs .tmf-lb-nav { top: calc(50% - 40px); }
.tmf-lb-prev { left: 14px; }
.tmf-lb-next { right: 14px; }
.tmf-lb-stage { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; min-height: 0; padding: 0 72px; }
.tmf-lb-img { max-width: 100%; max-height: 100%; object-fit: contain; cursor: zoom-in; user-select: none; box-shadow: 0 10px 40px rgba(0,0,0,.5); transition: opacity .15s; }
.tmf-lb.is-loading .tmf-lb-img { opacity: .35; }
.tmf-lb-spin { position: absolute; width: 34px; height: 34px; border: 3px solid rgba(255,255,255,.2); border-top-color: #fff; border-radius: 50%; animation: tmf-spin .8s linear infinite; display: none; }
.tmf-lb.is-loading .tmf-lb-spin { display: block; }
@keyframes tmf-spin { to { transform: rotate(360deg); } }
.tmf-lb.is-zoomed .tmf-lb-stage { overflow: auto; display: block; padding: 0; cursor: grab; }
.tmf-lb.is-zoomed .tmf-lb-stage:active { cursor: grabbing; }
.tmf-lb.is-zoomed .tmf-lb-img { max-width: none; max-height: none; cursor: zoom-out; box-shadow: none; }
.tmf-lb.is-zoomed .tmf-lb-nav { display: none; }
.tmf-lb-cap { text-align: center; font-size: 14px; padding: 10px 16px 0; max-width: 900px; margin: 0 auto; }
.tmf-lb-cap[hidden] { display: none; }
.tmf-lb-thumbs {
	display: flex; gap: 6px; overflow-x: auto; padding: 12px 16px 14px; justify-content: safe center;
	scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.25) transparent;
}
.tmf-lb-thumb {
	flex: none; width: var(--tmf-lb-thumb); height: calc(var(--tmf-lb-thumb) * .75); padding: 0; border: 2px solid transparent;
	border-radius: 4px; overflow: hidden; background: #222; cursor: pointer; opacity: .55; transition: opacity .15s, border-color .15s;
}
.tmf-lb-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tmf-lb-thumb:hover, .tmf-lb-thumb:focus-visible { opacity: .9; outline: none; }
.tmf-lb-thumb.is-current { opacity: 1; border-color: #fff; }
@media (max-width: 700px) {
	.tmf-lb { --tmf-lb-thumb: 48px; }
	.tmf-lb-stage { padding: 0 8px; }
	.tmf-lb-nav { width: 40px; height: 40px; background: rgba(0,0,0,.35); }
	.tmf-lb-prev { left: 6px; }
	.tmf-lb-next { right: 6px; }
}
.tmf-gallery.tmf-lightbox li:focus-visible { outline: 3px solid #2271b1; outline-offset: 2px; }

/* Proporcje kafelków (3:2, 1:1, 16:9 …) */
.tmf-gallery.tmf-ratio > ul.crop > li { height: auto; aspect-ratio: var(--tmf-ratio, 3 / 2); }
.tmf-gallery > ul.crop img { object-fit: var(--tmf-fit, cover); }
.tmf-gallery.tmf-contain > ul.crop > li > figure { background: #f3f3f3; }
.tmf-gallery.tmf-contain > ul.crop figcaption { background: rgba(0,0,0,.55); }
