$primary_color: #078dce;

#tc-megamenu-choose-icons {
	.main {
		padding: 20px;

		.search {
			font-size: 11px;
			display: inline-block;
			width: 260px;
			padding: 6px 8px;
		}
	}

	.top {
		margin-bottom: 20px;
	}

	.tc-icons {
		max-height: 300px;
		overflow-y: auto;
	}

	.tc-icon {
		width: 50px;
		height: 50px;
		line-height: 50px;
		text-align: center;
		font-size: 30px;
		border: 1px solid #eee;
		margin: 3px;
		display: none;

		&.show {
			display: inline-block;
		}

		&:hover, &.active {
			cursor: pointer;
			border-color: #078dce;
			color: #078dce;
			background: #f6fafc;
		}
	}
}

#menu-to-edit {
	.field-move {
		.field-move-visual-label {
			line-height: 2em;
		}

		.menus-move {
			text-decoration: none;

			&:before {
				font-family: Dashicons;
				font-size: 1.5em;
				font-style: normal;
				position: relative;
				top: 4px;
			}
		}

		.menus-move-up {
			&:before {
				content: "\f342";
			}
		}

		.menus-move-down {
			&:before {
				content: "\f346";
			}
		}

		.menus-move-left {
			&:before {
				content: "\f340";
			}
		}

		.menus-move-right {
			&:before {
				content: "\f344";
			}
		}
		.menus-move-top {
			&:before {
				content: "\f522";
				transform: rotate(-90deg);
				display: inline-block;
			}
		}
	}

	.link-to-original {
		display: none;
	}

	.menu-item {
		&:hover {
			.item-controls {
				&:before {
					display: inline-block;
				}
			}
		}
	}

	.item-controls {
		&:hover {
			&:before {
				cursor: pointer;
			}
		}

		&:before {
			content: "\f182";
			font-family: Dashicons;
			font-size: 20px;
			width: 20px;
			height: 20px;
			position: absolute;
			top: 6px;
			left: -20px;
			z-index: 1;
			display: none;
		}
	}

	.menu-item-actions {
		display: none;
	}

	.description {
		float: none;
	}

	.menu-item {
		.field-thim-mega-menu {
			display: none;
		}

		&.menu-item-depth-0 {
			.field-thim-mega-menu {
				display: block;
			}
		}
	}

	.thim-wrapper-mega-menu {
		margin: 20px 0 20px -10px;
		padding: 0 10px 0;
		background-color: #f5f5f5;

		label {
			display: block;
			font-style: italic;
			margin-bottom: 2px;
		}

		.hidden-field {
			display: none !important;
		}

		.field-thim-icons {
			padding-top: 10px;
			float: left;
			width: 50%;
		}

		&.hidden-field {
			display: none !important;
		}

		&:before {
			clear: both;
			content: '';
			display: block;
		}

		&.inactive {
			.tc-menu-extra-field {
				display: none;
			}
		}

		.tc-icon-selector {
			display: inline-block;
			border-radius: 3px;
			box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
			border: 1px solid #bbbbbb;

			.choose {
				cursor: pointer;
				display: inline-block;
			}

			&:hover {
				border-color: #999;
			}

			span {
				display: inline-block;
				height: 35px;
				line-height: 35px;
				vertical-align: middle;
			}

			.label {
				font-weight: normal;
			}

			.tc-preview-icon {
				width: 35px;
				text-align: center;

				i {
					line-height: 35px;
					font-size: 20px;
				}
			}
		}

		.tc-remove {
			color: #aaa;
			font-size: 20px;
			padding: 0 5px;

			&:before {
				content: "\f335";
				font-family: Dashicons;
			}

			&:hover {
				cursor: pointer;
				color: #666;
			}
		}

		a {
			text-decoration: none;
		}

		.field-thim-sub-align {
			padding-top: 10px;
			float: left;
			width: 50%;
			min-height: 35px;

			input {
				position: relative;
				top: 8px;
				border: none;
				background-color: transparent;
				box-shadow: none;
				z-index: 0;
				width: 30px;
				height: 30px;
				cursor: pointer;
				color: #555;

				&:hover {
					color: #333;
				}

				&:checked {
					color: $primary_color;
				}

				&:before {
					display: none;
				}

				&:after {
					font-family: Dashicons;
					position: absolute;
					z-index: 1;
					font-size: 30px;
					top: 10px;
					left: 0;
				}

				&[value='left'] {
					&:after {
						content: "\f206";
					}
				}

				&[value='center'] {
					&:after {
						content: "\f207";
					}
				}

				&[value='right'] {
					&:after {
						content: "\f208";
					}
				}
			}
		}

		.field-thim-mega-menu {
			.help {
				&:hover {
					color: $primary_color;
				}
			}

			.tc-hide {
				display: none;
			}

			&[data-type="column"] {
				.tc-layout-hide-title {
					display: inline-block;
					line-height: 39px;
				}
			}

			&[data-type="builder"] {
				.open-builder {
					display: inline-block;
					min-width: 65px;
				}

				.tc-waring-builder {
					display: block;
					font-size: 0.9em;
					font-style: italic;
					color: #888;
					margin: 5px 0;
				}
			}
		}
	}

	.tc-field {
		margin-bottom: 10px;
		display: inline-block;

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

		&.tc-field-empty {
			.tc-remove {
				visibility: hidden;
			}
		}
	}

	.tc-field-layout {
		width: 100%;
	}

	.tc-field-type-layout {
		width: 150px;
		line-height: 37px;
		height: 37px;
	}
}

#tc-mega-menu-layout-builder {
	width: 98%;
	height: 80%;
	max-width: 1170px;

	.md-content {
		height: 100%;
	}

	.main {
		max-height: 100%;
		height: 100%;

		iframe {
			height: 98%;
		}
	}
}

.tc-col-50 {
	float: left;
	width: 50%;
}

.tc-row {
	&:after {
		content: '';
		display: table;
		clear: both;
	}
}