

nav.login-nav  {
	position: fixed!important;
	
	right: var(--spacing-2xl,60px);
	top:var(--spacing-2xl,60px);
	
	display: flex;
	flex-direction: row;
	gap:10px;
	justify-content: space-between;
}
nav.login-nav, nav.login-nav  ul {
	flex-direction: row;
	white-space: nowrap;

	border-radius:var(--spacing-lg,20px);
}


nav.login-nav ul li:first-child a,
nav.login-nav:has(.hover-item-highlighter[at-nav-item="first"]) .hover-item-highlighter-inner{
	border-top-left-radius: var(--spacing-lg,20px)!important;
	border-bottom-left-radius: var(--spacing-lg,20px)!important;
}
nav.login-nav ul li:last-child a,
nav.login-nav:has(.hover-item-highlighter[at-nav-item="end"]) .hover-item-highlighter-inner{
	border-top-right-radius: var(--spacing-lg,20px)!important;
	border-bottom-right-radius: var(--spacing-lg,20px)!important;
}
nav.login-nav ul li a { 
	padding-left: 15px;
	padding-right: 15px;
}
nav.login-nav ul li:first-child a {
	padding-left: 20px;
}
nav.login-nav ul li:last-child a {
	padding-right: 20px;
}
nav.login-nav ul li > *  {
	min-height: 30px;
	display: flex;
	flex-direction: row;
}
nav.login-nav ul li > * > * {
	margin: auto;
}


nav.login-nav ul {
	gap:0px;
}
nav.login-nav ul {
	box-shadow: inset 0px 0px 0px 2px #0799f4;
}
nav.login-nav ul li:not(:first-child) a {
	border-left:  1px solid #e5e2dc;
	border-left-color:  #0799f4;
}
nav.login-nav ul li a:hover {
	background-color: currentColor;
}
nav.login-nav ul li a:hover > * {
	color:#fff; 
}



nav ul img {
	position: absolute;
	top: 0px;
	left: 0px;
	right: auto!important;
	
	object-fit: cover;
	object-position: center;
	aspect-ratio:1;
	height: 30px;
	max-width: 30px;
	
	border-radius: 50%;
	
}
nav ul img + * {
	margin-left: 15px!important;
}

nav.login-nav .fa {
	transform: translateY(1px);
	vertical-align:bottom;
}