// File field
.uf-file {
	display: inline-block;
	background: #eee;
	border: 1px solid #ccc;
	max-width: 100%;
	box-sizing: border-box;

	&-preview {
		display: block;
		border-bottom: 1px solid #ccc;
		background: #fff;
		text-align: center;

		img {
			display: block;
			margin: 0 auto;
			max-width: 100%;
			height: auto;
		}

		.icon {
			display: inline-block;
			vertical-align: middle;
			margin: 8px;
			width: 24px;
			height: 32px;
		}

		em {
			display: inline-block;
			vertical-align: middle;
			margin: 8px 8px 8px 0;
		}
	}

	&-buttons {
		display: block;
		text-align: center;
		padding: 8px;

		.uf-button + .uf-button {
			margin-left: 5px;
		}
	}
}

.uf-uploader {
	background: #eee;
	border: 2px dashed #ddd;
	padding: 40px 20px 9px;
	text-align: center;
	position: relative;
	max-width: 600px;;

	&-trigger {
		display: inline-block;
		border: 1px solid #ccc;
		border-bottom-width: 2px;
		padding: 5px 10px;
		border-radius: 3px;
		background: #fff;
		font-size: 14px;
		line-height: 22px;
		color: #555;
		text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
		position: relative;
		z-index: 4;
		text-decoration: none;
	}

	&-text {
		font-size: 14px;
	    color: #999;
	    padding-top: 10px;
		position: relative;
		z-index: 2;
		text-shadow: 1px 1px 1px #fff;
	}

	&-drop,
	&-progressbar {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

	&-drop {
		z-index: 3;
	}

	&-drop-active {
		background: #0085ba;
	}

	&-progressbar {
		z-index: 2;
		width: 0;
		transition: all .1s ease;
		background: #ddd;

		&-hidden {
			opacity: 0;
		}
	}

	&-incognito {
		position: absolute;
		top: -4000px;
		left: -4000px;;
	}
}

.uf-overlay-screen-media {
	overflow: visible;
}

.uf-overlay-body {
	.media-modal-backdrop {
		display: none;
	}

	.media-modal {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: -49px;
	}

	.media-modal-content {
		box-shadow: none;
	}

	.media-modal-close,
	.media-frame-title {
		display: none;
	}

	.media-frame-router {
		top: 5px;
	}

	.media-frame-content {
		top: 39px;
	}
}

.uf-overlay-screen > .supports-drag-drop {
	position: static !important;
}