Shared element renders on top of absolute other views

First of all, amazing library! It is helping me a lot with my project.

Regarding this I have the following error which I put a gif of the behavior and I will explain:

I have the image which I want to share and it is being shared perfectly, the problem is that I have two capable of degrading absolutely, one above and one below, these cause an error of a couple of seconds when I return from the animation, could you help me with any advice on how to solve this ?, both buttons and gradients are absolutely


```js

const Outstanding = ({ item, onPlay, onWatchlist, onDiscoverMore }: Props) => {
const [loaded, setLoaded] = useState(false);
const { t } = useTranslation('layout');
return (






setLoaded(!loaded)}
/>


(onWatchlist ? onWatchlist() : {})}>


(onPlay ? onPlay() : {})}>


(onDiscoverMore ? onDiscoverMore() : {})}>



{t('playnow')}


);
};

export default Outstanding;

const Detail = () => {
const { goBack, getParam, dangerouslyGetParent } = useNavigation();
const { item } = getParam('item');
const parent = dangerouslyGetParent();
console.tron.log({ item });
const back = () => {
if (parent) {
toggleTabs(parent, true);
}
goBack();
};

return (

{/*
*/}






back()} />


);
};

Detail.sharedElements = (navigation: ReturnType) => {
const { item } = navigation.getParam('item');
return [item.id];
};

export default Detail;

```

Thanks again

Start with the SharedElement usage in the Outstanding and Detail components, including Detail.sharedElements, and reproduce the return transition shown in the GIF. Check how the absolutely positioned Actions and gradient elements interact with the shared image during that transition; done means the transient overlap no longer appears.

Written by the indexing model from the issue text.