@import 'variables';

.uploader {
  h1 {
	margin: 10px 0px;
  }

  .dropzone {
	border: 2px dotted @pfm-purple;
	background: lighten(@pfm-purple, 25%);
	padding: 10px;
	color: darken(@pfm-purple, 25%);
	margin-bottom: 10px;

	p {
	  padding: 0px;
	  margin: 0px;
	}

	&.file-over {
	  background: lighten(@pfm-purple, 5%);
	}
  }

  .close-button {
	.border-radius(0px);
	width: auto;
	margin-bottom: 10px;
	float: none;
	display: block;
  }

  .uploads {
	margin: 0px;
	padding: 0px;
	list-style: none;

	li {
	  margin-bottom: 5px;
	  background: #eee;
	  font-size: 9pt;
	  position: relative;
	  z-index: 1;
	  color: #444;
	  border: 2px solid #aaa;

	  p {
		margin: 5px;
		padding: 0px;
		height: 26px;
		line-height: 26px;

		a {
		}
	  }

	  .bar {
		position: absolute;
		bottom: 0px;
		left: 0px;
		height: 10px;
		z-index: -1;
		background: @pfm-purple;
		display: none;
	  }

	  &.has-error {
		border-color: @red;

		.bar {
		  display: none;
		}
	  }

	  &.uploading {
		.bar {
		  display: block;
		}
	  }

	  &.is-processing {
		border-color: @blue;

		.bar {
		  display: none;
		}
	  }
	}
  }
}