/* [PROGRESS_WRAP_MINIMAL_CONTRACT 2026-09-22] Botó "tornar amunt" (anell de progrés de scroll).
   Contracte mínim extret de themes/gaia/css/style.css (v1 legacy, 257KB, NO es carrega — vegeu
   themes/irtheme/principal.html) — només les 8 regles reals que .progress-wrap necessita, cap
   altra cosa d'aquell fitxer. Substitueix les dues dependències mortes de l'original:
     - variables --primary/--gray-dark/--dark-blue (vivien al :root del style.css esborrat) ->
       tokens --ia-color-* canònics, ja carregats per qualsevol pàgina (system.css).
     - glif de la fletxa via @font-family 'unicons' (45KB, mai carregat al <head>) -> xebró
       CSS pur (border + rotate), zero peticions, zero font.
   El JS (themes/irtheme/js/custom.js:~1774-1799, injectat via files_js_tema) NO es toca: ja
   funciona i consumeix exactament aquestes classes (.progress-wrap, .active-progress,
   svg.progress-circle path). */

.progress-wrap {
	position: fixed;
	right: 40px;
	bottom: 60px;
	height: 46px;
	width: 46px;
	cursor: pointer;
	display: block;
	border-radius: 50px;
	box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.1);
	z-index: 10000;
	opacity: 0;
	visibility: hidden;
	transform: translateY(15px);
	transition: all 200ms linear;
}

.progress-wrap.active-progress {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* Xebró amunt (^) en repòs: dues vores rotades 45deg — substitueix el glif d'Unicons. */
.progress-wrap::after {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	width: 10px;
	height: 10px;
	margin: -7px 0 0 -5px;
	border-top: 2px solid var(--ia-color-text, #1a1a2e);
	border-left: 2px solid var(--ia-color-text, #1a1a2e);
	transform: rotate(45deg);
	z-index: 1;
	transition: all 200ms linear;
}

.progress-wrap:hover::after {
	opacity: 0;
}

/* Mateix xebró, color d'accent, ocult fins al hover (crossfade amb l'anterior). */
.progress-wrap::before {
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	width: 10px;
	height: 10px;
	margin: -7px 0 0 -5px;
	border-top: 2px solid var(--ia-color-primary, #4f46e5);
	border-left: 2px solid var(--ia-color-primary, #4f46e5);
	transform: rotate(45deg);
	opacity: 0;
	z-index: 2;
	transition: all 200ms linear;
}

.progress-wrap:hover::before {
	opacity: 1;
}

.progress-wrap svg path {
	fill: none;
}

.progress-wrap svg.progress-circle path {
	stroke: var(--ia-color-primary, #4f46e5);
	stroke-width: 4;
	box-sizing: border-box;
	transition: all 200ms linear;
}

/* Responsive: mòbil = botó ple més petit (com l'original), xebrons clars sobre fons d'accent. */
@media (max-width: 1199px) {
	.progress-wrap {
		right: 20px;
		bottom: 20px;
		height: 40px;
		width: 40px;
		background-color: var(--ia-color-primary, #4f46e5);
		box-shadow: none;
	}

	.progress-wrap::after,
	.progress-wrap::before {
		border-top-color: var(--ia-color-surface, #ffffff);
		border-left-color: var(--ia-color-surface, #ffffff);
	}
}
