/* =========================================================
   MODUŁ: Media (obraz / video)
   ========================================================= */

.sp-media {
	--spm-radius:          16px;
	--spm-custom-width:    auto;
	--spm-caption-color:   #5A5A5A;
	--spm-caption-size:    14px;
	--spm-caption-weight:  500;
	--spm-caption-style:   italic;
	--spm-glow-color:      #D4A017;

	margin: 1.25rem 0;
	font-family: var(--sp-font, 'Inter', sans-serif);
	max-width: 100%;
}

.sp-media__wrap {
	overflow: hidden;
	border-radius: var(--spm-radius);
	display: block;
	line-height: 0; /* usuwa biały odstęp pod img */
}

.sp-media__img {
	display: block;
	width: 100%;
	height: auto;
	max-width: 100%;
}

.sp-media__link {
	display: block;
	border-bottom: none;
	text-decoration: none;
	color: inherit;
}

/* ===== Wideo wrap z proporcjami ===== */
.sp-media__video {
	position: relative;
	width: 100%;
	background: #000;
	height: 0;
	/* padding-bottom z PHP inline */
}
.sp-media__video iframe,
.sp-media__video video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: none;
	display: block;
}

/* ===== ROZMIARY ===== */
.sp-media--size-small  { max-width: 320px; }
.sp-media--size-medium { max-width: 600px; }
.sp-media--size-large  { max-width: 900px; }
.sp-media--size-full   { max-width: 100%; }
.sp-media--size-custom { max-width: var(--spm-custom-width, 100%); }

/* ===== WYRÓWNANIE ===== */
.sp-media--align-center { margin-left: auto; margin-right: auto; }
.sp-media--align-left   { margin-right: auto; margin-left: 0; }
.sp-media--align-right  { margin-left: auto; margin-right: 0; }

/* ===== CIENIE ===== */
.sp-media--shadow-none .sp-media__wrap { box-shadow: none; }
.sp-media--shadow-soft .sp-media__wrap {
	box-shadow: 0 10px 30px rgba(0,0,0,.08);
}
.sp-media--shadow-medium .sp-media__wrap {
	box-shadow: 0 16px 40px rgba(0,0,0,.15);
}
.sp-media--shadow-strong .sp-media__wrap {
	box-shadow: 0 24px 60px rgba(0,0,0,.25);
}
.sp-media--shadow-glow .sp-media__wrap {
	box-shadow: 0 0 30px var(--spm-glow-color),
				0 0 60px rgba(0,0,0,.15);
}

/* ===== HOVER EFEKTY ===== */
.sp-media--hover-none .sp-media__wrap { transition: none; }

.sp-media--hover-zoom .sp-media__img,
.sp-media--hover-zoom .sp-media__video iframe,
.sp-media--hover-zoom .sp-media__video video {
	transition: transform .55s cubic-bezier(.2,.6,.2,1);
}
.sp-media--hover-zoom:hover .sp-media__img,
.sp-media--hover-zoom:hover .sp-media__video iframe,
.sp-media--hover-zoom:hover .sp-media__video video {
	transform: scale(1.06);
}

.sp-media--hover-lift .sp-media__wrap {
	transition: transform .35s cubic-bezier(.2,.6,.2,1), box-shadow .35s ease;
}
.sp-media--hover-lift:hover .sp-media__wrap {
	transform: translateY(-8px);
	box-shadow: 0 28px 60px rgba(0,0,0,.20);
}

.sp-media--hover-grow .sp-media__wrap {
	transition: transform .35s cubic-bezier(.2,.6,.2,1);
}
.sp-media--hover-grow:hover .sp-media__wrap {
	transform: scale(1.02);
}

.sp-media--hover-tilt .sp-media__wrap {
	transition: transform .45s cubic-bezier(.2,.6,.2,1);
	perspective: 1000px;
}
.sp-media--hover-tilt:hover .sp-media__wrap {
	transform: rotateY(-3deg) rotateX(2deg) scale(1.02);
}

/* ===== CAPTION ===== */
.sp-media__caption {
	margin: .75rem 0 0;
	font-size: var(--spm-caption-size);
	font-weight: var(--spm-caption-weight);
	font-style: var(--spm-caption-style);
	color: var(--spm-caption-color);
	text-align: center;
	line-height: 1.5;
}
.sp-media--align-left .sp-media__caption { text-align: left; }
.sp-media--align-right .sp-media__caption { text-align: right; }

/* =========================================================
   OCHRONA przed pobieraniem — protect="1"
   ========================================================= */

/* Wrap z protect — relatywne pozycjonowanie dla overlay */
.sp-media--protected .sp-media__wrap {
	position: relative;
}

/* Wyłącz user-select i drag na całym elemencie */
.sp-media--protected,
.sp-media--protected * {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-touch-callout: none; /* iOS — wyłącza long-press menu */
	-webkit-user-drag: none;
	user-drag: none;
}

/* Obraz — dodatkowa ochrona: pointer-events przepuszcza klik, ale drag/contextmenu już zablokowane */
.sp-media--protected .sp-media__img {
	-webkit-user-drag: none;
	user-drag: none;
	pointer-events: none; /* blokuje right-click bezpośrednio na img */
}

/* Overlay przezroczystego diva NAD obrazem — łapie wszystkie kliki na obrazie */
.sp-media__protect-overlay {
	position: absolute;
	inset: 0;
	z-index: 5;
	background: transparent;
	cursor: default;
	/* Brak pointer-events: none — overlay MA łapać kliki */
}

/* Jeśli media jest linkiem klikalnym — pozwól przekliknąć przez overlay */
.sp-media--protected .sp-media__link {
	display: block;
	position: relative;
	z-index: 6; /* nad overlay */
}
.sp-media--protected .sp-media__link .sp-media__img {
	pointer-events: auto; /* pozwól klik */
}

/* Video iframe — overlay nie blokuje całkowicie playera, ale blokuje prawy klik */
.sp-media--protected .sp-media__video {
	position: relative;
}
.sp-media--protected .sp-media__video::after {
	content: '';
	position: absolute;
	top: 0; right: 0;
	width: 56px; height: 56px;
	/* Maska na obszar przycisku „pobierz" w prawym górnym rogu YouTube */
	background: transparent;
	z-index: 4;
	pointer-events: auto;
}

/* Mała ikona kłódki w rogu (subtelna) */
.sp-media--protected .sp-media__wrap::before {
	content: '🔒';
	position: absolute;
	top: 8px;
	right: 8px;
	font-size: 12px;
	opacity: 0;
	z-index: 7;
	pointer-events: none;
	transition: opacity .3s ease;
}
.sp-media--protected:hover .sp-media__wrap::before {
	opacity: 0.5;
}

/* ===== Responsive ===== */
@media (max-width: 600px) {
	.sp-media { margin: 1rem 0; }
	.sp-media--hover-tilt:hover .sp-media__wrap { transform: none; }
}