ui-panel {
	box-shadow: 3px 5px 7px #000;
	position: absolute !important;
	display: flex;
	flex-direction: column;
	border: 2px solid black;
	border-radius: 10px;
	z-index: 1001;
 }
ui-panel > :first-child {
	display: flex;
	flex-direction: row;
	background-color: var(--dark);
	background-image: linear-gradient(0deg, #00000033, #ffffff00 50%, #ffffff22);
    background-repeat: no-repeat;
    filter: none;
	color: white;
	font-weight: bold;
	justify-content: center;
	align-items: center;
	border-top-right-radius: 10px;
	border-top-left-radius: 10px;
 }
ui-panel > :first-child label {
	display: flex;
	flex-direction: row;
	flex-grow: 1;
	color: white;
	font-weight: bold;
	justify-content: center;
	align-items: center;
	font-size: 125%;
 }
ui-panel > :first-child i {
	color: white;
 }
ui-panel > :first-child i:hover {
	color: red;
	cursor: pointer;
 }
ui-panel > :nth-child(2) {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background-color: white;
	width: 100%;
	flex-grow: 1;
 }
ui-panel > :nth-last-child(1 of :not(.ui-resizable-handle)) {
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
 }
ui-panel > :nth-child(3) {
	display: flex;
	flex-direction: row;
	width: 100%;
	background-color: var(--bs-body-bg);
	background-image: linear-gradient(180deg, #00000033, #ffffff00 50%, #ffffff22);
    background-repeat: no-repeat;
    filter: none;
	justify-content: center;
	align-items: center;
 }

