.overlay.clean
{
	height: calc(100% - 64px);
	z-index: 10;
	padding: 0;
	overflow: visible;
}

.overlay.clean .widget
{
	border-radius: 0;
	width: 100%;

	max-height: none;
	height: 100%;
	position: relative;
	overflow: visible;
	box-shadow: none;
}

.overlay.clean .widget .content
{
	height: calc(100% - 40px - env(safe-area-inset-top));

	padding-left: calc(20px + env(safe-area-inset-left));
	padding-right: calc(20px + env(safe-area-inset-right));

	position: relative;
	top: 0;
}

.overlay.clean .widget h2
{
	justify-content: center;
	width: 100%;
	pointer-events: none;
	background-color: var(--app-color);
    height: 30px;
    top: 0;
    z-index: 10;
    position: relative;
    padding: 0;
    font-size: 14px;
	align-items: flex-start;
	margin-top: -5px;
    padding-bottom: 3px;
    box-sizing: content-box;
}

#foreground
{
	box-shadow: 0 0 0 64px var(--app-color);
	border-radius: 32px 32px 0 0;
	margin: 0;
	width: 100%;
	top: calc(64px + env(safe-area-inset-top));
	height: calc(100% - 64px);
	border-radius: 0;
}

#admin-bar
{
	background-color: var(--app-color);
	/* justify-content: space-between; */
}

#admin-bar button, #admin-bar input
{
	background-color: white!important;
	color: black;
	border: none;
}

#admin-bar img
{
	filter: none;
}

@media only screen and (min-width: 1176px)
{
	.overlay.clean .widget h2
	{
		position: fixed;
		height: 64px;
		top: -64px;
		box-sizing: border-box;
		align-items: center;
		background-color: transparent;
		margin-top: 0;
		padding: 20px;
		font-size: 18px;
	}
}