$color-1 : #e6f0f5;
$color-2 : #ff0038;

.gravityview-shortcode-preview {
	background  : $color-1;
	text-align  : center;
	padding     : 40px;
	font-size   : 14px;
	line-height : 30px;
	font-family : -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;

	> img {
		margin-bottom : 20px;
	}

	.field-container {
		text-align : center;

		.components-base-control {
			display        : inline-block;
			vertical-align : top;
		}

		.components-base-control__field {
			margin-bottom : 0;
		}

		hr {
			margin : 10px 0;
		}

		select, input {
			width  : 250px;
			margin : 5px;
			height : 40px;
		}
	}

	.alert-box {
		margin-top : 30px;

		.title {

		}

		.value {
			color       : $color-2;
			font-weight : 700;
		}
	}
}

.btn-group-double {
	width         : 100%;
	margin-bottom : 20px;

	.components-button {
		width           : 50%;
		justify-content : center;
	}
}

.btn-group-triple {
	width         : 100%;
	margin-bottom : 20px;

	.components-button {
		width           : 33%;
		justify-content : center;
	}
}

.react-datepicker-wrapper {
	display : block;

	.react-datepicker__input-container {
		display : block;

		input {
			display : block;
			width   : 100%;
		}
	}
}

.autocomplete-box {
	ul {
		background : $color-1;
		border     : 1px solid darken($color-1, 10%);

		li {
			cursor        : pointer;
			line-height   : 25px;
			margin        : 0;
			padding       : 10px;
			border-bottom : 1px solid #fff;

			&:last-child {
				border-bottom : 0;
			}

			&:hover {
				background : #fff;
			}
		}
	}
}

.select-view-selectbox {
	width      : 250px;
	display    : inline-block;
	text-align : left;
	position   : relative;
	z-index    : 10;

	input {
		margin     : 0 !important;
		height     : auto !important;
		box-shadow : none !important;
	}

	[class*="-menu"] {
		line-height : 20px;
	}

	[class*="-control"] {
		border-color : hsl(0, 0%, 80%) !important;
		box-shadow   : none !important;
	}
}

.edit-post-sidebar {
	.select-view-selectbox {
		width   : 100%;
		display : block;
	}
}

.gv-calendar-buttons, .gv-calendar-link {
	pointer-events: none;
}
