/* ============================================================
   KRIS DESIGN — przycisk „do góry”

   Kolory liczone z palety motywu (kd-primary, kd-base, kd-contrast),
   tak jak w kd-kafle. Deklaracje parami: rgba() awaryjnie,
   color-mix() właściwie.
   ============================================================ */

.kd-do-gory {
	position: fixed;
	right: clamp(16px, 2.5vw, 28px);
	bottom: clamp(16px, 2.5vw, 28px);

	/* Wyżej niż treść, niżej niż pływające menu w nagłówku (9999)
	   i niżej niż okna wtyczek. */
	z-index: 900;

	/* 46 px to minimum dotykowe z WCAG (44 px) z zapasem. */
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;

	border: 1px solid rgba(0, 136, 176, 0.45);
	border-color: color-mix(in srgb, var(--wp--preset--color--kd-primary) 45%, transparent);

	/* Półprzezroczyste tło, żeby przycisk nie wycinał dziury w sekcji,
	   nad którą akurat stoi. */
	background-color: rgba(0, 0, 0, 0.72);
	background-color: color-mix(in srgb, var(--wp--preset--color--kd-base) 72%, transparent);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);

	color: #f3f2f2;
	color: var(--wp--preset--color--kd-contrast);
	text-decoration: none;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
}

.kd-do-gory__strzalka {
	display: block;
}


/* ---------- stan ukryty ---------- */
/* Klasę zdejmuje i nakłada skrypt. Bez skryptu przycisk jest widoczny
   od pierwszego piksela — mniej elegancko, ale zawsze działa. */

.kd-do-gory.kd-do-gory--ukryty {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}


/* ---------- reakcja ---------- */

@media (hover: hover) {

	.kd-do-gory:hover {
		border-color: var(--wp--preset--color--kd-primary);
		background-color: rgba(0, 113, 143, 0.9);
		background-color: color-mix(in srgb, var(--wp--preset--color--kd-primary) 80%, var(--wp--preset--color--kd-base));
	}
}

.kd-do-gory:focus-visible {
	outline: 2px solid var(--wp--preset--color--kd-primary);
	outline-offset: 3px;
	border-color: var(--wp--preset--color--kd-primary);
}

@media (prefers-reduced-motion: no-preference) {

	.kd-do-gory {
		transition: opacity 0.25s ease, visibility 0.25s ease,
			transform 0.25s ease, border-color 0.25s ease, background-color 0.25s ease;
	}

	.kd-do-gory.kd-do-gory--ukryty {
		transform: translateY(10px);
	}

	@media (hover: hover) {

		.kd-do-gory:hover {
			transform: translateY(-2px);
		}
	}
}


/* ---------- drukowanie ---------- */

@media print {

	.kd-do-gory {
		display: none;
	}
}