/* Proweb Video Player – typografi, kantlinje og skygge, hover-effekter og verktøytips (se includes/class-look.php) */

/* --- Skrift --- */
.pwvp.pwvp--font-theme, .pwvp-playlist.pwvp--font-theme, .pwvp-gallery.pwvp--font-theme { font-family: inherit; }
.pwvp .pwvp__time, .pwvp .pwvp__btn--text { font-size: var(--pwvp-time-size, 13px); }
.pwvp .pwvp__info-title { font-size: var(--pwvp-title-size, 17px); }
.pwvp-gallery .pwvp-gallery__title { font-size: var(--pwvp-title-size, 1em); font-weight: var(--pwvp-tw, 600); }
.pwvp-playlist .pwvp-playlist__title { font-weight: var(--pwvp-tw, 600); }

/* --- Kantlinje og skygge (to variabler, så de ikke endrer størrelsen) --- */
.pwvp, .pwvp-playlist__side, .pwvp-playlist--flush .pwvp-playlist__layout { box-shadow: var(--pwvp-ring, 0 0 #0000), var(--pwvp-drop, 0 0 #0000); }
.pwvp:focus-visible { box-shadow: 0 0 0 3px var(--pwvp-accent); }
.pwvp-playlist--flush .pwvp-playlist__side, .pwvp-playlist--flush .pwvp-playlist__stage .pwvp { box-shadow: none; }
.pwvp-gallery .pwvp-gallery__thumb::after { box-shadow: inset var(--pwvp-ring, 0 0 #0000); }
.pwvp-lightbox { --pwvp-ring: 0 0 #0000; --pwvp-drop: 0 0 #0000; }

/* --- Bakgrunn bak videoen og plakaten (synlig når videoen ikke fyller flaten) --- */
.pwvp .pwvp__stage, .pwvp .pwvp__media, .pwvp .pwvp__poster { background-color: var(--pwvp-poster, #000); }

/* --- Hover: knapper (egne egenskaper for å ikke forstyrre knappestilene) --- */
.pwvp[class*="pwvp-h-hb-"] .pwvp__btn, .pwvp-playlist[class*="pwvp-h-hb-"] .pwvp-playlist__btn { transition: scale var(--pwvp-speed, 160ms) ease, translate var(--pwvp-speed, 160ms) ease, filter var(--pwvp-speed, 160ms) ease; }
.pwvp.pwvp-h-hb-grow .pwvp__btn:hover, .pwvp-playlist.pwvp-h-hb-grow .pwvp-playlist__btn:hover { scale: 1.14; }
.pwvp.pwvp-h-hb-lift .pwvp__btn:hover, .pwvp-playlist.pwvp-h-hb-lift .pwvp-playlist__btn:hover { translate: 0 -2px; }
.pwvp.pwvp-h-hb-glow .pwvp__btn:hover, .pwvp-playlist.pwvp-h-hb-glow .pwvp-playlist__btn:hover { filter: drop-shadow(0 0 7px color-mix(in srgb, var(--pwvp-accent) 80%, transparent)); }

/* --- Hover: videoer i spillelisten --- */
.pwvp-playlist[class*="pwvp-h-hl-"] .pwvp-playlist__item { transition: translate var(--pwvp-speed, 160ms) ease, background 0.15s; }
.pwvp-playlist[class*="pwvp-h-hl-"] .pwvp-playlist__thumb { transition: scale var(--pwvp-speed, 160ms) ease; }
.pwvp-playlist.pwvp-h-hl-slide .pwvp-playlist__item:hover { translate: 4px 0; }
.pwvp-playlist.pwvp-h-hl-zoom .pwvp-playlist__item:hover .pwvp-playlist__thumb { scale: 1.1; }

/* --- Hover og puls: stor avspillingsknapp --- */
.pwvp[class*="pwvp-h-hp-"] .pwvp__bigplay-icon, .pwvp-gallery[class*="pwvp-h-hp-"] .pwvp__bigplay-icon { transition: scale var(--pwvp-speed, 160ms) ease; }
.pwvp.pwvp-h-hp-grow:hover .pwvp__bigplay-icon, .pwvp-gallery.pwvp-h-hp-grow .pwvp-gallery__item:hover .pwvp__bigplay-icon { scale: 1.15; }
.pwvp.pwvp-h-hp-pulse .pwvp__bigplay-icon, .pwvp-gallery.pwvp-h-hp-pulse .pwvp__bigplay-icon { animation: pwvp-pulse 2.2s ease-out infinite; }
@keyframes pwvp-pulse {
	0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--pwvp-accent) 55%, transparent); }
	70%, 100% { box-shadow: 0 0 0 18px transparent; }
}

/* --- Animasjoner av (hastighet 0) og for de som ber om mindre bevegelse --- */
.pwvp--still, .pwvp--still *, .pwvp--still *::before, .pwvp--still *::after { transition-duration: 0s !important; animation: none !important; }
@media (prefers-reduced-motion: reduce) {
	.pwvp[class*="pwvp-h-"] *, .pwvp-playlist[class*="pwvp-h-"] *, .pwvp-gallery[class*="pwvp-h-"] * { transition-duration: 0s !important; animation: none !important; }
}

/* --- Verktøytips (eget; lages av pwvp-tooltips.js og ligger utenfor spilleren, så de aldri klippes) --- */
.pwvp-tip {
	position: fixed;
	z-index: 2147483000;
	max-width: 260px;
	padding: 5px 9px;
	border-radius: 6px;
	background: var(--pwvp-tip-bg, rgba(17, 24, 39, 0.94));
	color: var(--pwvp-tip-fg, #fff);
	font: 600 12px/1.3 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3);
	pointer-events: none;
	opacity: 0;
	transition: opacity var(--pwvp-speed, 120ms) ease;
}
.pwvp-tip.is-on { opacity: 1; }

/* --- Rullefelt i spillelisten: type, størrelse og farger (klassen pwvp-sb-<type> kommer fra Look::classes) --- */
.pwvp-playlist[class*="pwvp-sb-"] {
	--sb-w: var(--pwvp-sb-w, 10px);
	--sb-t: var(--pwvp-sb-thumb, color-mix(in srgb, var(--pwvp-text) 34%, transparent));
	--sb-h: var(--pwvp-sb-hover, var(--pwvp-accent));
	--sb-k: var(--pwvp-sb-track, color-mix(in srgb, var(--pwvp-text) 8%, transparent));
}
.pwvp-playlist[class*="pwvp-sb-"] :is(.pwvp-playlist__list, .pwvp-playlist__choices)::-webkit-scrollbar { width: var(--sb-w); height: var(--sb-w); }
.pwvp-playlist[class*="pwvp-sb-"] :is(.pwvp-playlist__list, .pwvp-playlist__choices)::-webkit-scrollbar-track { background: var(--sb-k); }
.pwvp-playlist[class*="pwvp-sb-"] :is(.pwvp-playlist__list, .pwvp-playlist__choices)::-webkit-scrollbar-thumb { background: var(--sb-t); background-clip: padding-box; }
.pwvp-playlist[class*="pwvp-sb-"] :is(.pwvp-playlist__list, .pwvp-playlist__choices)::-webkit-scrollbar-thumb:hover { background: var(--sb-h); background-clip: padding-box; }
.pwvp-playlist.pwvp-sb-rounded :is(.pwvp-playlist__list, .pwvp-playlist__choices)::-webkit-scrollbar-track { border-radius: 999px; }
.pwvp-playlist.pwvp-sb-rounded :is(.pwvp-playlist__list, .pwvp-playlist__choices)::-webkit-scrollbar-thumb { border: 2px solid transparent; border-radius: 999px; }
.pwvp-playlist.pwvp-sb-slim :is(.pwvp-playlist__list, .pwvp-playlist__choices)::-webkit-scrollbar-track { background: transparent; }
.pwvp-playlist.pwvp-sb-slim :is(.pwvp-playlist__list, .pwvp-playlist__choices)::-webkit-scrollbar-thumb { border: calc(var(--sb-w) * 0.32) solid transparent; border-radius: 999px; }
.pwvp-playlist.pwvp-sb-square :is(.pwvp-playlist__list, .pwvp-playlist__choices)::-webkit-scrollbar-thumb { border-radius: 0; }
.pwvp-playlist.pwvp-sb-hover :is(.pwvp-playlist__list, .pwvp-playlist__choices)::-webkit-scrollbar-track, .pwvp-playlist.pwvp-sb-hover :is(.pwvp-playlist__list, .pwvp-playlist__choices)::-webkit-scrollbar-thumb { background: transparent; }
.pwvp-playlist.pwvp-sb-hover :is(.pwvp-playlist__list, .pwvp-playlist__choices)::-webkit-scrollbar-thumb { border: 2px solid transparent; border-radius: 999px; }
.pwvp-playlist.pwvp-sb-hover :is(.pwvp-playlist__list, .pwvp-playlist__choices):hover::-webkit-scrollbar-track { background: var(--sb-k); border-radius: 999px; }
.pwvp-playlist.pwvp-sb-hover :is(.pwvp-playlist__list, .pwvp-playlist__choices):hover::-webkit-scrollbar-thumb { background: var(--sb-t); background-clip: padding-box; }
.pwvp-playlist.pwvp-sb-hover :is(.pwvp-playlist__list, .pwvp-playlist__choices):hover::-webkit-scrollbar-thumb:hover { background: var(--sb-h); background-clip: padding-box; }
.pwvp-playlist.pwvp-sb-hidden :is(.pwvp-playlist__list, .pwvp-playlist__choices) { scrollbar-width: none; }
.pwvp-playlist.pwvp-sb-hidden :is(.pwvp-playlist__list, .pwvp-playlist__choices)::-webkit-scrollbar { display: none; }
/* Firefox kjenner ikke ::-webkit-scrollbar: der brukes standardegenskapene (tykkelse: tynn eller vanlig, og farger). */
@supports not selector(::-webkit-scrollbar) {
	.pwvp-playlist[class*="pwvp-sb-"] :is(.pwvp-playlist__list, .pwvp-playlist__choices) { scrollbar-width: auto; scrollbar-color: var(--sb-t) var(--sb-k); }
	.pwvp-playlist:is(.pwvp-sb-slim, .pwvp-sb-hover) :is(.pwvp-playlist__list, .pwvp-playlist__choices) { scrollbar-width: thin; }
	.pwvp-playlist.pwvp-sb-slim :is(.pwvp-playlist__list, .pwvp-playlist__choices) { scrollbar-color: var(--sb-t) transparent; }
	.pwvp-playlist.pwvp-sb-hover :is(.pwvp-playlist__list, .pwvp-playlist__choices) { scrollbar-color: transparent transparent; }
	.pwvp-playlist.pwvp-sb-hover :is(.pwvp-playlist__list, .pwvp-playlist__choices):hover { scrollbar-color: var(--sb-t) var(--sb-k); }
	.pwvp-playlist.pwvp-sb-hidden :is(.pwvp-playlist__list, .pwvp-playlist__choices) { scrollbar-width: none; }
}

/* --- Skillelinjen mellom videoene i spillelisten (tykkelse og farge kommer fra variablene; klassen pwvp-sep-<type> fra Look::classes) --- */
.pwvp-playlist.pwvp-sep-none .pwvp-playlist__cell { border-bottom: 0; }
.pwvp-playlist.pwvp-sep-dashed .pwvp-playlist__cell { border-bottom-style: dashed; }
.pwvp-playlist.pwvp-sep-dotted .pwvp-playlist__cell { border-bottom-style: dotted; }