/* Herbawell - kursor v2 (dekoracja frontu, tylko desktop z myszka): precyzyjna strzalka
   w hotspocie + puszka koktajlu doganiajaca ruch. Makieta: handoff 16, "Ikona - puszka koktajlu".
   Ladowany razem z assets/js/cursor.js; skrypt montuje obie czesci i DOPIERO potem doklada
   klase .hw-cursor-on (bez zamontowanego kursora nie chowamy natywnego).
   Grafiki trzymamy tutaj jako data URI - JS zostaje sama logika (limit rozmiaru skryptu). */

/* Natywny kursor znika dopiero po zamontowaniu strzalki i puszki. */
body.hw-cursor-on,
body.hw-cursor-on a,
body.hw-cursor-on button,
body.hw-cursor-on [role="button"],
body.hw-cursor-on label,
body.hw-cursor-on summary { cursor: none; }

/* Nad polami tekstowymi wraca natywny kursor, a obie czesci gasna (zaznaczanie tekstu). */
body.hw-cursor-on.hw-cursor-text,
body.hw-cursor-on.hw-cursor-text input,
body.hw-cursor-on.hw-cursor-text textarea,
body.hw-cursor-on.hw-cursor-text select,
body.hw-cursor-on.hw-cursor-text [contenteditable] { cursor: auto; }
body.hw-cursor-text .hw-can,
body.hw-cursor-text .hw-arrow { opacity: 0; }

/* Puszka: wrapper trzyma translate (pozycja doganiana, zaczep +13/+16), <i> animuje rotate (wstrzas).
   z-index nad wszystkim na froncie - najwyzsza warstwa w projekcie to 100001 (popup zgodnosci). */
.hw-can {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 2147483000;
	width: 26px;
	height: 43px;
	pointer-events: none;
	will-change: transform;
	opacity: 1;
	transition: opacity .15s ease;
}
.hw-can.is-out { opacity: 0; }

.hw-can i {
	display: block;
	width: 26px;
	height: 43px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 40' fill='none'%3E%3Cpath d='M3.4 4.6h17.2c.5 0 .9.4.9.9v3.1H2.5V5.5c0-.5.4-.9.9-.9Z' fill='%231E6B45'/%3E%3Cpath d='M3.4 4.6h17.2c.5 0 .9.4.9.9v.9H2.5v-.9c0-.5.4-.9.9-.9Z' fill='%232A7F55'/%3E%3Crect x='2.9' y='8.6' width='18.2' height='1.3' fill='%23EEF0EE'/%3E%3Cpath d='M3 9.9h18v26.5c0 .9-.7 1.6-1.6 1.6H4.6c-.9 0-1.6-.7-1.6-1.6V9.9Z' fill='%23FFFFFF' stroke='%23C9CFCB' stroke-width='.5'/%3E%3Cpath d='M16.6 9.9H21v26.5c0 .9-.7 1.6-1.6 1.6h-2.8c.9 0 1.6-.7 1.6-1.6V9.9Z' fill='%23E9ECEA'/%3E%3Cpath d='M6.2 15.6c.8-1.6 2.4-2.2 3.6-1.9-.2 1.5-1.4 2.4-3.6 1.9Z' fill='%237BB661'/%3E%3Cg stroke-linecap='round'%3E%3Cpath d='M5.2 17.4h5.9' stroke='%231E6B45' stroke-width='1.9'/%3E%3Cpath d='M5.2 19.9h4.2M5.2 21.3h4.8' stroke='%2310261C' stroke-width='.8'/%3E%3C/g%3E%3Crect x='5.2' y='26.6' width='5.1' height='1.9' rx='.3' fill='%23F3E4B6'/%3E%3Ccircle cx='15.3' cy='23.6' r='4.9' fill='%23F4F4F2'/%3E%3Ccircle cx='15.3' cy='23.6' r='4.1' fill='%23F2E7C9'/%3E%3Cg stroke-linecap='round'%3E%3Cpath d='M18.6 20.6l-2.7 3.4' stroke='%23E7D8A9' stroke-width='1.2'/%3E%3Cpath d='M5.2 35.6h8.8' stroke='%2310261C' stroke-width='.8'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
	transform-origin: 50% 92%;
	filter: drop-shadow(0 5px 8px rgba(16, 38, 28, .3));
}

/* Wstrzas po kliknieciu - restart przez zdjecie klasy + reflow po stronie JS. Strzalka stoi. */
.hw-can i.is-shake { animation: hw-can-shake .5s ease-out; }
@keyframes hw-can-shake {
	0%   { transform: rotate(0); }
	18%  { transform: rotate(-14deg) translateY(-2px); }
	36%  { transform: rotate(11deg); }
	54%  { transform: rotate(-7deg); }
	72%  { transform: rotate(4deg); }
	100% { transform: rotate(0); }
}

/* Strzalka: hotspot = czubek (0,0), pozycja ustawiana wprost przy mousemove, bez opoznienia.
   Warstwa o 1 wyzej niz puszka - strzalka ma byc nad nia. */
.hw-arrow {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 2147483001;
	width: 18px;
	height: 20px;
	pointer-events: none;
	opacity: 1;
	transition: opacity .15s ease;
}
.hw-arrow.is-out { opacity: 0; }

/* Nad elementami klikalnymi (a, button, przelaczniki) strzalka zmienia kolor na mosiadz (zyczenie Huberta). */
body.hw-cursor-link .hw-arrow i { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 20' fill='none'%3E%3Cpath d='M1 1l6.2 17.6 3.1-6.3 7 .2L1 1Z' fill='%23B08D57' stroke='%23F7F5F0' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E"); }


.hw-arrow i {
	display: block;
	width: 18px;
	height: 20px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 20' fill='none'%3E%3Cpath d='M1 1l6.2 17.6 3.1-6.3 7 .2L1 1Z' fill='%2310261C' stroke='%23F7F5F0' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
	filter: drop-shadow(0 1px 1.5px rgba(16, 38, 28, .35));
}

/* Krople - punkt klikniecia z JS przez left/top, wektor rozrzutu przez --dx/--dy. */
.hw-drop {
	position: fixed;
	z-index: 2147483000;
	width: 8px;
	height: 8px;
	border-radius: 50% 50% 50% 0;
	pointer-events: none;
	transform: rotate(-45deg);
	animation: hw-can-drop .6s cubic-bezier(.2, .7, .3, 1) forwards;
}
@keyframes hw-can-drop {
	0%   { transform: translate(0, 0) scale(1); opacity: 1; }
	100% { transform: translate(var(--dx), var(--dy)) scale(.4); opacity: 0; }
}

/* Pierscien rozchodzacy sie z punktu klikniecia. */
.hw-ring {
	position: fixed;
	z-index: 2147483000;
	width: 36px;
	height: 36px;
	border: 2px solid #B08D57;
	border-radius: 50%;
	pointer-events: none;
	animation: hw-can-ring .55s ease-out forwards;
}
@keyframes hw-can-ring {
	0%   { transform: scale(.5); opacity: .6; }
	100% { transform: scale(1.8); opacity: 0; }
}