.local-load,
.remote-load {
	display: none;
}

div:has(#load-remote:checked) .remote-load {
	display: unset;
}

div:has(#load-local:checked) .local-load {
	display: flex;
	flex-direction: row;
	label {
		flex: 1;
	}
	.load-file-name {
		flex: 1;
		margin: 0.5em;
	}
}

.remote-load {
	max-height: 10em;
	overflow-y: auto;
	.file {
		margin: 0.2em 0;
		cursor: pointer;
		width: 100%;
	}
	.file.selected {
		background-color: var(--green);
		font-weight: bold;
	}
}

.game-metadata {
	display: flex;
	flex-direction: column;
	.metadata-attr {
		display: flex;
		flex-direction: row;
		align-items: flex-start;
		.metadata-title {
			font-weight: bold;
			width: 33%;
			text-wrap: wrap;
		}
		.metadata-data {
			flex: 1;
		}
	}
}