mediawiki-skins-Citizen/resources/skins.citizen.styles/components/UserMenu.less

.citizen-userMenu {
	&__card {
		.citizen-header-card( end );
		min-width: 16rem;
		transform-origin: var( --transform-origin-offset-end ) var( --transform-origin-offset-end );

		@media ( min-width: @min-width-breakpoint-desktop ) {
			transform-origin: var( --transform-origin-offset-start ) var( --transform-origin-offset-end );
		}

		.citizen-menu__heading {
			.mixin-screen-reader-text;
		}
	}
}

#pt-createaccount,
#pt-login,
#pt-login-private,
#pt-logout {
	a {
		margin: var( --space-xs );
		border: 1px solid var( --border-color-base );
		border-radius: var( --border-radius--medium );
	}
}

#pt-login {
	a {
		.button-blue;

		&:hover {
			.button-blue-hover;
		}

		&:active {
			.button-blue-active;
		}
	}
}

#pt-logout {
	a {
		.button-red;

		&:hover {
			.button-red-hover;
		}

		&:active {
			.button-red-active;
		}
	}
}

// Checkbox hack
#citizen-userMenu__checkbox:checked {
	~ .citizen-userMenu__card {
		.citizen-card-show();
	}
}