/*** Style of setting panel container ***/
#karma-element-setting-panel-container {
	display: flex;
	left: 710px;
	max-width: 330px;
	position: fixed;
	top: 90px;
	z-index: $level-20;

	.karma-hide-controller{
	  display: none;
	}

	.karma-element-setting-panel {
		background-color: #fff;
		border-radius: 4px;
		box-shadow: 0 4px 20px 11px rgba( $builder-main-color, 0.08 );
		margin: 17px;
		min-height: 220px;
		position: relative;
		width: 285px;

		.karma-element-setting-panel-header {
			@include box( 285px, 46px );
			background: #fff;
			border-radius: 4px 4px 0 0;
			box-shadow: 0 2px 4px 0 rgba( $builder-main-color, 0.1 );
			cursor: all-scroll;
			position: relative;
			z-index: 1;

			.karma-element-setting-panel-header-title {
				@extend .karma-builder-title-3;
				color: $builder-main-color;
				font-family: $builder-medium-font;
				padding: 16px 0 15px 20px;
				text-align: left;
				text-transform: capitalize;
			}

			.karma-element-setting-panel-header-svg {
				@extend .center-both-flex;
				@include element_direction( 11.51px, 7px );
				cursor: pointer;
				position: absolute;

				.revert-svg {
					@extend .center-both-flex;
					@include box( 24.49px, 24.49px );
					@include element_direction( 9.51px, 7px );
					display: none;
					margin-right: 10px;
					svg {
						* {
							stroke: #fff !important;
						}
					}
				}

				.karma-setting-panel-close-svg {
					@extend .center-both-flex;
					@include box( 24.49px, 24.49px );
					@include element_direction( 9.51px, 7px );
					margin-right: 5px;
					svg {
						* {
							stroke: $builder-main-color-1;
						}
					}
				}
			}

		}


		.karma-element-setting-panel-content {

			max-height: 70vh;
			overflow: hidden;

			#karma-Builder-form {

				transition:all .3s cubic-bezier( 0.2, 0.32, 0.07, 1.01 );
				div:last-child .karma-setting-panel-group-button {
					border-bottom-left-radius: 4px;
					border-bottom-right-radius: 4px;
				}

				input.hidden-input {
					display: none;
				}

				#elementRow{
					position: relative;
				}

			}
		}

	}
}

.tooltip-div {
	background-color: $builder-main-color-4;
	display: none;
	height: 50px;
	position: fixed;
	width: 50px;
}

.karma-not-found{
	@extend .karma-builder-title-4;
	color : $builder-main-color-1;
	margin: 20px;
}
