/* Općina Sveti Petar u Šumi — GDPR (ponuda 24/2026): YouTube na naslovnici, prozor za video, obavijest uz obrazac. */

.svp-sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Sličica videa umjesto iframea (bio: width 100 %, visina 200 px) */
.svp-yt {
	position: relative;
	display: block;
	width: 100%;
	height: 200px;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 0;
	background: #111;
	overflow: hidden;
	cursor: pointer;
	line-height: 0;
}
.svp-yt img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .3s ease, opacity .3s ease;
}
.svp-yt__play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}
.svp-yt__play svg {
	filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .45));
	transition: transform .2s ease;
}
.svp-yt:hover img,
.svp-yt:focus-visible img { opacity: .85; transform: scale(1.03); }
.svp-yt:hover .svp-yt__play svg,
.svp-yt:focus-visible .svp-yt__play svg { transform: scale(1.12); }
.svp-yt:focus-visible { outline: 3px solid #f2b705; outline-offset: 3px; }

/* Prozor za video */
.svp-yt-dialog {
	width: min(960px, calc(100vw - 32px));
	max-width: none;
	padding: 0;
	border: 0;
	background: #000;
	color: #fff;
	box-shadow: 0 20px 60px rgba(0, 0, 0, .5);
}
.svp-yt-dialog::backdrop { background: rgba(0, 0, 0, .8); }
.svp-yt-dialog__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 12px 10px 16px;
	background: #243c7b;
}
.svp-yt-dialog__title {
	margin: 0;
	color: #fff;
	font-size: 17px;
	line-height: 1.3;
}
.svp-yt-dialog__close {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: #fff;
	cursor: pointer;
}
.svp-yt-dialog__close:hover,
.svp-yt-dialog__close:focus-visible { background: rgba(255, 255, 255, .15); }
.svp-yt-dialog__close:focus-visible { outline: 3px solid #f2b705; outline-offset: 1px; }
.svp-yt-dialog__frame { position: relative; aspect-ratio: 16 / 9; }
.svp-yt-dialog__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* Pločica privole u prozoru (mun-consent) preko sličice */
.svp-yt-dialog__frame .svp-yt-consent {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	border: 0;
	border-radius: 0;
	background-color: #111;
	background-position: center;
	background-size: cover;
	aspect-ratio: auto;
}
.svp-yt-dialog__frame .svp-yt-consent::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, .75);
}
.svp-yt-dialog__frame .svp-yt-consent.is-loaded::before { display: none; }
.svp-yt-dialog__frame .svp-yt-consent .mc-embed__ph {
	position: relative;
	z-index: 1;
	max-width: 560px;
	padding: 24px;
	background: transparent;
	text-align: center;
}
.svp-yt-dialog__frame .svp-yt-consent .mc-embed__text { color: #f0f0f0; font-size: 15px; line-height: 1.5; }
.svp-yt-dialog__frame .svp-yt-consent .mc-embed__open { color: #fff; font-size: 14px; text-decoration: underline; }
.svp-yt-dialog__frame .svp-yt-consent .mc-btn--ghost { background: transparent; border-color: #fff; color: #fff; }
@media (max-width: 600px) {
	.svp-yt-dialog__frame .svp-yt-consent .mc-embed__ph { padding: 12px; }
	.svp-yt-dialog__frame .svp-yt-consent .mc-embed__text { font-size: 13px; }
	.svp-yt-dialog__frame { aspect-ratio: 4 / 5; }
}

/* Obavijest uz kontakt obrazac */
.svp-form-note { margin: 4px 0 14px; color: #4a5263; font-size: 14px; line-height: 1.5; }
.svp-form-note a { text-decoration: underline; }

/* Povećanje teksta (mun-a11y) za temu u px (egovt + Elementor): mun-a11y skalira font-size tijela,
   a tema sve piše u px — zato se tekstualni blokovi povećavaju svojstvom zoom (unutar svog stupca). */
html.mun-a11y-text-up .ova-wrapp :is(p, h1, h2, h3, h4, h5, h6, label, blockquote, dt, dd, figcaption, .elementor-heading-title, .elementor-text-editor, .widget, .text_link, .ova-content):not(:is(p, h1, h2, h3, h4, h5, h6, label, blockquote, dt, dd, figcaption, .elementor-heading-title, .elementor-text-editor, .widget, .text_link, .ova-content) *),
html.mun-a11y-text-up .ova-wrapp :is(li, td, th):not(:is(li, td, th, p, .elementor-text-editor, .widget, .ova-content) *):not(:has(p)) {
	zoom: var(--mun-a11y-scale, 1);
}
