.ac-setbox {
	$e: &;
	-webkit-font-smoothing: antialiased;
	margin-top: 30px;

	&__descriptive {
		color: #636669;
		font-size: 13px;
		line-height: 17px;
	}

	&__header {
		padding: 10px;
		position: relative;
		cursor: pointer;

		&__title {
			font-size: 15px;
			font-weight: bold;

			small {
				font-size: 14px;
				font-weight: 300;
				color: #72777C;
			}
		}

		&:after {
			content: "";
			position: absolute;
			right: 20px;
			top: 50%;
			border-left: 4px solid transparent;
			border-right: 4px solid transparent;
			border-bottom: 6px solid #000;
			transition: all .2s;
			margin-top: -4px;

		}
	}

	&__row {
		$row: &;
		background: #fff;

		&__th, &__fields {
			border-bottom: 1px solid var(--ac-border-grey);
		}

		&__th {
			background: #f5f5f5;
			position: relative;
			padding: 12px 13px;
			padding-top: 15px;
			border-right: 1px solid var(--ac-border-grey);

			label {
				display: block;
				font-weight: bold;
				margin-bottom: 5px;
			}

			small {
				color: #636669;
				font-size: 13px;
				line-height: 17px;
			}
		}

		&__fields {
			flex: auto;

			&.-has-subsettings {
				display: flex;
				flex-direction: column;
			}

			&__inner {
				padding: 15px;

				> * {
					&:last-child {
						margin-bottom: 0;
					}
				}
			}

			select {
				width: 100%;
				margin-bottom: 10px;
			}
		}

		a.ac-pointer.instructions {
			position: absolute;
			top: 14px;
			right: 10px;
			display: inline-block;
			cursor: pointer;
		}

		@media screen and (min-width: 900px) {
			display: flex;
			&__th {
				flex: 0 0 230px;
			}
			&__fields {
				flex: auto;
			}
			&.-sub {
				display: block;

				#{$row}__th,
				#{$row}__fields {
					flex: 100%;
				}
			}
		}
		@media screen and (min-width: 1150px) {
			&.-sub {
				display: flex;

				#{$row}__th,
				#{$row}__fields {
					flex: 100%;
				}
			}
		}

	}

	.checkbox-labels,
	.radio-labels {
		> label {
			padding-right: 10px;
			vertical-align: top;
		}

		&.vertical {
			input[type=radio] {
				margin-right: 6px;
			}

			> label {
				display: block;
				margin-bottom: 5px;
			}
		}
	}

	&.-closed {
		#{$e}__header {
			&:after {
				transform: rotate(180deg);
			}
		}

		#{$e}__row {
			display: none;
		}
	}


	.select2-search__field {
		width: 100% !important;
	}
}

.ac-ls-settings {
	.select2 {
		margin-bottom: 10px;

		input {
			min-height: 0;
		}

		li {
			margin-bottom: 0;
		}
	}

	.row.users {
		.select2 {
			margin-bottom: 0;
		}
	}

	select.sorting_order {
		margin-bottom: 0;
	}

	&-mockup {
		position: relative;

		.ac-setbox {

			&__row__fields {
				filter: blur(1.5px);
			}

		}
	}
}

.ac-unlock-modal {
	background: #FFFFFF;
	border: 1px solid #D0CECE;
	box-shadow: 0 0 19px 0 rgba(0, 0, 0, 0.44);
	position: absolute;
	right: calc(30% - 100px);
	top: 50%;
	margin-top: -20px;
	border-radius: 4px;
	padding: 12px;
	z-index: 2;

	span {
		margin-right: 5px;
		color: var(--ac-pink-color);
		transform: translateY( 4px );
	}

	.-pink {
		margin-left: 10px;
		padding-left: 20px;
		padding-right: 20px;
	}
}