.wrapper {
	height: 250px;
	border-radius: var( --jp-border-radius );
	border: 1px dashed var( --jp-gray-20 );
	background-color: var( --jp-gray-0 );
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 16px;

	.button {
		margin-bottom: calc( var( --spacing-base ) * 2 ); // 16px;
	}

	&.small {
		height: 200px;

		.button {
			margin-bottom: calc( var( --spacing-base ) * 3 ); // 24px;
		}
	}
}

.file-input {
	display: none;
}

.hover {
	background-color: var( --jp-gray-5 );
	transition: all 0.1s linear;

	// Avoiding drag events on children
	* {
		pointer-events: none;
	}
}

.icon {
	fill: var( --jp-green-50 );
	flex-shrink: 0;
}