#jet_engine_dashboard {
	visibility: hidden;
	&.is-mounted {
		visibility: visible;
	}
}

.wp-admin .cx-vui-select.size-fullwidth {
	width: 100%;
	max-width: 100%;
}

.jet-engine-skins-wrap {
	padding: 0 0 20px;
}

.cx-vui-component.jet-import-preset {
	justify-content: space-between;
}

.jet-shortocde-generator {
	p {
		font-size: 13px;
		line-height: 17px;
		color: #7b7e81;
	}
	&__result {
		position: relative;
		margin: 15px 20px 0;
		background: #f5f5f5;
		padding: 10px 40px 10px 10px;
		border: 1px dotted #dcdcdd;
		font-size: 15px;
		line-height: 20px;
		font-family: 'Courier New', monospace;
		direction: ltr;

		&-copy {
			position: absolute;
			top: 2px;
			right: 0;
			display: flex;
			justify-content: center;
			align-items: center;
			padding: 8px;
			cursor: pointer;

			svg {
				fill: currentColor;
				width: 22px;
				height: 22px;
			}

			&:hover {
				svg {
					fill: #007cba;
				}
			}
		}
	}
}

.je-module-heading {
	display: flex;
	align-items: center;
}

.je-module-icon {
	position: relative;
	width: 20px;
	height: 20px;
	margin: 0 0 0 10px;

	.rtl & {
		margin: 0 10px 0 0;
	}

	+ .je-module-icon {
		margin: 0 0 0 2px;

		.rtl & {
			margin: 0 2px 0 0;
		}
	}
	svg {
		width: 100%;
		height: auto;
	}
	&--inactive {
		opacity: .4;
	}
	.cx-vui-tooltip {
		left: 50%;
		margin-left: -80px;
		width: 160px;
		bottom: calc( 100% + 15px );
		box-sizing: border-box;
		pointer-events: none;
		transition: all 150ms linear;
		opacity: 0;
		padding-left: 0;
		padding-right: 0;
	}
	&:hover {
		.cx-vui-tooltip {
			opacity: 1;
			bottom: 100%;
		}
	}
}

.jet-enine-module-info-close {
	width: 24px;
	height: 24px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	svg {
		path {
			transition: all 150ms linear;
			fill: #dcdcdd;
		}
	}
	&:hover {
		svg {
			path {
				fill: #007cba;
			}
		}
	}
}

.jet-engine-module-info {
	width: 24px;
	height: 24px;
	cursor: pointer;
	position: relative;
	svg {
		path {
			transition: all 150ms linear;
			fill: #dcdcdd;
		}
	}
	.cx-vui-tooltip {
		left: 50%;
		margin-left: -80px;
		width: 160px;
		bottom: calc( 100% + 15px );
		box-sizing: border-box;
		pointer-events: none;
		transition: all 150ms linear;
		opacity: 0;
		padding-left: 0;
		padding-right: 0;
	}
	&:hover {
		.cx-vui-tooltip {
			opacity: 1;
			bottom: 100%;
		}
		svg {
			path {
				fill: #007cba;
			}
		}
	}
}

.jet-engine-module {
	display: flex;
	padding: 20px;
}

.jet-engine-module-video {
	padding-right: 20px;
	.rtl & {
		padding-right: 0;
		padding-left: 20px;
	}
}

.jet-engine-links {
	padding: 20px 0 0 0;
	font-family: Roboto,-apple-system,BlinkMacSystemFont,Segoe UI,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;
	&__title {
		font-size: 15px;
		line-height: 20px;
		color: #23282d;
		font-weight: 500;
		padding: 0 0 10px;
	}
	&__item {
		padding: 6px 0 0;
	}
	&__link {
		color: #007cba;
		text-decoration: none;
		display: inline-flex;
		align-items: flex-start;
		svg {
			margin: 2px 8px 0 0;
			.rtl & {
				margin: 2px 0 0 8px;
			}
			path {
				fill: #007cba;
			}
		}
	}
}

.jet-engine-details {
	padding: 0;
	overflow: hidden;
	font-size: 13px;
    line-height: 17px;
    color: #7b7e81;
    p {
    	padding: 0 0 6px;
    	margin: 0;
    	&:last-child {
    		padding: 0;
    	}
    }
}

.cx-vui-component--jet-is-stackable {
	position: sticky;
	bottom: 0;
	background: #fff;
}

.jet-engine-skins {
	&__header {
		padding: 25px 0;
		display: flex;
		align-items: center;
		cursor: pointer;
		&-label {
			font-weight: 500;
			font-size: 15px;
			line-height: 23px;
			color: #007CBA;
			margin: 0 25px 0 0;
			display: flex;
			align-items: center;
			svg {
				margin: -1px 8px 0 0;
			}

			.rtl & {
				margin: 0 0 0 25px;
				svg {
					margin: -1px 0 0 8px;
					transform: scale(-1);
				}
			}

			.jet-engine-skins--active & {
				svg {
					transform: rotate( 90deg );
				}
			}
		}
		&-desc {
			font-size: 15px;
			line-height: 23px;
			color: #7B7E81;
		}
	}
	border-bottom: 1px solid #ECECEC;
	&:first-child {
		border-top: 1px solid #ECECEC;
		margin-top: 20px;
	}
	&--active {
		&:last-child {
			border-bottom: none;
		}
	}
	&__content {
		padding: 0 0 30px;
		.cx-vui-subtitle {
			padding: 0 0 15px;
		}
		p {
			font-size: 15px;
			line-height: 23px;
			color: #7B7E81;
			margin: 0;
			padding: 0 0 15px;
		}
	}
}

.jet-engine-import {
	&__btn {
		padding: 20px 0 0 0;
	}
	&__log {
		background: #E9F6EA;
		padding: 20px;
		border-radius: 4px;
		&-title {
			color: #46B450;
			font-weight: 500;
			font-size: 15px;
			line-height: 23px;
			margin: 0 0 6px;
			display: flex;
			align-items: center;
			svg {
				margin: -1px 10px 0 0;
				.rtl & {
					margin: -1px 0 0 10px;
				}
			}
		}
		&-item {
			font-size: 15px;
			line-height: 23px;
			b {
				color: #23282D;
				font-weight: 500;
			}
			span {
				color: #7B7E81;
				font-style: italic;
			}
		}
	}
}

.jet-engine-skins-settings-grid {
	display: grid;
	grid-template-columns: repeat( auto-fill, minmax( 250px, 1fr ) );
	grid-gap: 10px;
}

.jet-engine-skins-settings-item {
	background: #fff;
	padding: 15px 20px;
	.cx-vui-component {
		padding: 0;