@import '../../../styles/_partials/index';

.DownloaderOverlay {
	z-index: 7;
	position: absolute;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	@include __theme-background(rgba($black, .5), rgba($gray-dark, .75));
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;

	.Downloader {
		list-style: none;
		padding: 0;
		margin: 0 auto;
		width: 100%;
		display: flex;
		justify-content: center;
	}

	.DownloaderItem {
		width: 62%;
		border-radius: 8px;
		@include __theme-background($white, $gray-darker);
		padding: 30px;
	}

	.DownloaderItem_Content_Top, .DownloaderItem_Content_Bottom {
		height: unset;
	}
}

.DownloaderItem_Content_Top, .DownloaderItem_Content_Bottom {
	height: 300px;
	display: flex;
	flex-direction: column;
}

.DownloaderItem_Content_Top {
	justify-content: flex-end;
}


.DownloaderItem {
	display: flex;
	width: 100%;
	flex-direction: column;
	text-align: center;

	.DownloaderItemLabel {
		margin-bottom: 20px;
	}

	.DownloadSizeProgress {
		word-wrap: break-word;
	}

	.DownloadSizeProgress__Truncate {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.DownloadSizeProgress, .DownloaderItemCancelButton {
		margin-top: 20px;
	}

	.DownloaderProgressBar {
		align-self: center;
	}
}