@import "_mixins";

.add_new_profile {
	padding: 20px;
	display: block;
	text-align: center;
	font-size: 20px;
	border-bottom: 1px solid transparent;
	@include theme(border-color, off);
}

.profile {
	margin-bottom: 20px;

	.quality_label input {
		font-weight: bold;
	}

	> .delete {
		position: absolute;
		padding: $padding/3 $padding;
		right: 0;
		cursor: pointer;
		opacity: 0.6;
		color: #fd5353;
		font-size: 1.5em;
		z-index: 2;

		&:hover {
			opacity: 1;
		}
	}

	.ctrlHolder {

		.types {
			flex: 1 1 auto;
			min-width: 360px;

			.type {
				display: flex;
				flex-row: row nowrap;
				align-items: center;
				padding: 2px 0;

				label {
					min-width: 0;
					margin-left: $padding/2;

					span {
						font-size: .9em;
					}
				}

				input[type=checkbox] {
					margin-right: 3px;
				}

				.delete, .handle {
					margin-left: $padding/4;
					width: 20px;
					font-size: 20px;
					opacity: .1;
					text-align: center;
					cursor: pointer;

					&.handle {
						cursor: move;
						cursor: grab;
					}

					&:hover {
						opacity: 1;
					}
				}

				&.is_empty {
					.delete, .handle {
						display: none;
					}
				}
			}

		}

		&.wait_for.wait_for {
			display: block;

			input {
				min-width: 0;
				width: 40px;
				text-align: center;
				margin: 0 2px;
			}

			.advanced {
				display: none;
				@include theme(color, primary);

				.show_advanced & {
					display: inline;
				}
			}

		}

		.formHint {
		}

	}
}

#profile_ordering {
	ul {
		list-style: none;
		margin: 0;
		width: 275px;
		padding: 0;
	}

	li {
		border-bottom: 1px solid transparent;
		@include theme(border-color, off);
		padding: 5px;
		display: flex;
		align-items: center;

		&:hover {
			@include theme(background, off);
		}

		&:last-child { border: 0; }

		input[type=checkbox] {
			margin: 2px 10px 0 0;
			vertical-align: top;
		}

		> span {
			display: inline-block;
			height: 20px;
			vertical-align: top;
			line-height: 20px;

			&.profile_label {
				flex: 1 1 auto;
			}
		}

		.handle {
			font-size: 20px;
			width: 20px;
			float: right;
			cursor: move;
			cursor: grab;
			opacity: .5;
			text-align: center;

			&:hover {
				opacity: 1;
			}
		}
	}

	.formHint {
	}
}
