/* Scroll Nav Pill — structural styles.
   Colors, sizes, timing are injected inline from admin settings. */

#snp-nav-pill *{
	box-sizing:border-box;
}

/* Two colored glows orbit the pill clockwise when enabled in settings. */
@keyframes snp-orbit-shadow{
	0%{
		box-shadow:0 -8px 18px 2px rgba(142,68,173,.82), 0 8px 18px 2px rgba(0,71,255,.78), 0 4px 18px rgba(0,0,0,.35);
	}
	25%{
		box-shadow:8px 0 18px 2px rgba(142,68,173,.82), -8px 0 18px 2px rgba(0,71,255,.78), 0 4px 18px rgba(0,0,0,.35);
	}
	50%{
		box-shadow:0 8px 18px 2px rgba(142,68,173,.82), 0 -8px 18px 2px rgba(0,71,255,.78), 0 4px 18px rgba(0,0,0,.35);
	}
	75%{
		box-shadow:-8px 0 18px 2px rgba(142,68,173,.82), 8px 0 18px 2px rgba(0,71,255,.78), 0 4px 18px rgba(0,0,0,.35);
	}
	100%{
		box-shadow:0 -8px 18px 2px rgba(142,68,173,.82), 0 8px 18px 2px rgba(0,71,255,.78), 0 4px 18px rgba(0,0,0,.35);
	}
}

.snp-inner{
	position:relative;
	width:100%;
	height:100%;
	display:flex;
	align-items:center;
}

/* Collapsed icon */
.snp-collapsed-mark{
	position:absolute;
	inset:0;
	display:flex;
	align-items:center;
	justify-content:center;
	opacity:1;
	transform:scale(1) rotate(0deg);
	transition:opacity .45s ease, transform .55s cubic-bezier(.34,1.56,.64,1);
}
#snp-nav-pill.snp-expanded .snp-collapsed-mark{
	opacity:0;
	transform:scale(.3) rotate(-90deg);
	pointer-events:none;
}
.snp-icon-img{
	width:28px;
	height:28px;
	border-radius:50%;
	object-fit:cover;
	display:block;
}
.snp-dot{
	display:block;
	width:26px;
	height:26px;
	border-radius:50%;
	box-shadow:0 0 12px rgba(124,108,246,0.55);
}

/* Expanded content */
.snp-expanded-content{
	display:flex;
	align-items:center;
	width:100%;
	height:100%;
	padding:0 8px 0 14px;
	gap:12px;
	white-space:nowrap;
}

.snp-logo-wrap{
	flex:0 0 auto;
	display:flex;
	align-items:center;
	opacity:0;
	transform:translateX(-8px) scale(.6);
	transition:opacity .4s ease .05s, transform .5s cubic-bezier(.34,1.56,.64,1) .05s;
}
#snp-nav-pill.snp-expanded .snp-logo-wrap{
	opacity:1;
	transform:translateX(0) scale(1);
}
.snp-logo-img{
	max-height:26px;
	width:auto;
	display:block;
}
.snp-dot-sm{
	width:24px;
	height:24px;
}

.snp-wordmark{
	font-weight:600;
	font-size:15px;
	letter-spacing:0.2px;
	opacity:0;
	transform:translateY(6px);
	transition:opacity .4s ease .12s, transform .5s ease .12s;
}
#snp-nav-pill.snp-expanded .snp-wordmark{
	opacity:1;
	transform:translateY(0);
}

.snp-spacer{ flex:1 1 auto; }

#snp-nav-pill .snp-hamburger{
	-webkit-appearance:none;
	appearance:none;
	flex:0 0 auto;
	box-sizing:border-box;
	width:34px !important;
	min-width:34px !important;
	max-width:34px !important;
	height:34px !important;
	min-height:34px !important;
	padding:0 !important;
	margin:0 !important;
	border:0 !important;
	border-radius:50% !important;
	background:rgba(255,255,255,0.06) !important;
	box-shadow:none !important;
	color:inherit !important;
	font:inherit;
	line-height:1;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:5px;
	cursor:pointer;
	opacity:0;
	transform:translateX(8px) scale(.6);
	transition:opacity .4s ease .18s, transform .5s cubic-bezier(.34,1.56,.64,1) .18s, background .3s;
}
#snp-nav-pill .snp-hamburger:hover,
#snp-nav-pill .snp-hamburger:focus{
	border:0 !important;
	background:rgba(255,255,255,0.14) !important;
	color:inherit !important;
	box-shadow:none !important;
}
#snp-nav-pill .snp-hamburger:focus{ outline:none; }
#snp-nav-pill .snp-hamburger:focus-visible{
	outline:2px solid currentColor;
	outline-offset:2px;
}
#snp-nav-pill .snp-hamburger::before,
#snp-nav-pill .snp-hamburger::after{
	content:none !important;
	display:none !important;
}
#snp-nav-pill.snp-expanded .snp-hamburger{
	opacity:1;
	transform:translateX(0) scale(1);
}
#snp-nav-pill .snp-hamburger > span{
	position:static !important;
	display:block;
	box-sizing:border-box;
	width:15px !important;
	min-width:15px !important;
	height:2px !important;
	min-height:2px !important;
	padding:0 !important;
	margin:0 !important;
	border:0 !important;
	border-radius:2px !important;
	background:currentColor !important;
	box-shadow:none !important;
	transition:transform .35s cubic-bezier(.34,1.56,.64,1), opacity .25s ease;
}
#snp-nav-pill .snp-hamburger.snp-open > span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
#snp-nav-pill .snp-hamburger.snp-open > span:nth-child(2){ opacity:0; }
#snp-nav-pill .snp-hamburger.snp-open > span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* Dropdown */
#snp-dropdown{
	position:fixed;
	top:90px;
	left:50%;
	transform:translateX(-50%) translateY(-10px) scale(.96);
	width:220px;
	background:rgba(18,20,30,0.85);
	border:1px solid rgba(255,255,255,0.14);
	border-radius:18px;
	backdrop-filter:blur(16px) saturate(140%);
	-webkit-backdrop-filter:blur(16px) saturate(140%);
	box-shadow:0 20px 40px rgba(0,0,0,0.5);
	padding:10px;
	opacity:0;
	pointer-events:none;
	z-index:9998;
	transition:opacity .35s ease, transform .45s cubic-bezier(.34,1.56,.64,1);
}
#snp-dropdown.snp-open{
	opacity:1;
	pointer-events:auto;
	transform:translateX(-50%) translateY(0) scale(1);
}
#snp-dropdown a{
	display:block;
	padding:10px 12px;
	border-radius:10px;
	color:#eef0f6;
	text-decoration:none;
	font-size:14px;
	font-weight:500;
	transition:background .2s;
}
#snp-dropdown a:hover{ background:rgba(255,255,255,0.08); }
#snp-dropdown .snp-menu-list,
#snp-dropdown .snp-menu-list ul{
	list-style:none;
	margin:0;
	padding:0;
}
#snp-dropdown .snp-menu-list li{
	margin:0;
	padding:0;
}
#snp-dropdown .snp-menu-list .sub-menu{
	padding-left:10px;
}
#snp-dropdown .snp-menu-list .sub-menu a{
	font-size:13px;
	opacity:.82;
}
#snp-dropdown .snp-menu-list .current-menu-item > a,
#snp-dropdown .snp-menu-list .current-menu-ancestor > a{
	background:rgba(255,255,255,0.08);
}

@media (prefers-reduced-motion: reduce){
	#snp-nav-pill, #snp-nav-pill *, #snp-dropdown{
		transition-duration:.01ms !important;
	}
	#snp-nav-pill{
		animation:none !important;
	}
}
