.#{$prefix} {
	$h: &;
	&#{$h}-edit,
	&#{$h}-import-export {
		.wrap {
			padding-left: 1.5rem;
			padding-right: 1.5rem;
			padding-top: 1.5rem;
			.comments-box {
				tbody {
					td {
						padding: 1rem;
						.delete {
							display: inline-block;
							position: static;
							font-size: 13px;
							width: auto;
						}
					}
				}
			}
		}
		.wp-heading-inline {
			font-size: 1.325rem;
			font-weight: 600;
			padding: 0;
		}
		.button {
			&.insert-media {
				padding-top: 0;
				padding-bottom: 0;
				height: 2rem;
				outline: none;
			}
			&.preview {
				padding: 0 0.625rem;
				height: 2rem;
				outline: none;
			}
		}
		.page-title-action {
			background: rgb(var(--wpt-lms-primary-700));
			border-color: rgb(var(--wpt-lms-primary-700));
			color: rgb(var(--wpt-lms-white));
			transition: all 0.2s ease-in-out;
			&:hover,
			&:focus,
			&:active {
				background-color: rgb(var(--wpt-lms-primary-800));
				box-shadow: 0 0.25rem 0.375rem rgba(var(--wpt-lms-primary-800), 0.12);
				color: rgb(var(--wpt-lms-white));
				border-color: rgb(var(--wpt-lms-primary-800));
			}
		}
		// hr.wp-header-end {
		// 	display: none;
		// }
		#poststuff {
			#titlediv {
				#titlewrap {
					input[type="text"] {
						padding: 0.625rem 1rem;
						height: auto;
						margin: 0;
					}
				}
				.inside {
					margin: 0.625rem 0;
				}
			}
			.tagsdiv {
				.ajaxtag {
					display: flex;
					flex-flow: row wrap;
					justify-content: space-between;
					gap: 0.313rem;
				}
			}
		}
		#wp-content-editor-tools {
			background-color: rgba(var(--wpt-lms-white), 0);
			padding: 0.625rem 0;
			border-color: rgb(var(--wpt-lms-editor-border));
			.button {
				margin-bottom: 0;
			}
			.wp-editor-tabs {
				display: flex;
				gap: 5px;
				button {
					margin: 0;
					padding: 0.313rem 0.5rem;
					background-color: rgba(var(--wpt-lms-black), 0.05);
					color: rgb(var(--wpt-lms-black));
					border: none;
					border-radius: 0.188rem;
				}
			}
		}
		.wp-editor-wrap {
			.quicktags-toolbar {
				width: 100% !important;
			}
			&.tmce-active #wp-content-editor-tools button.switch-tmce {
				background-color: rgb(var(--wpt-lms-primary-700), 8%);
				color: rgb(var(--wpt-lms-primary-700));
			}
			&.html-active #wp-content-editor-tools button.switch-html {
				background-color: rgb(var(--wpt-lms-primary-700), 8%);
				color: rgb(var(--wpt-lms-primary-700));
			}
			.wp-switch-editor:focus {
				box-shadow: none;
			}
			textarea {
				background-color: rgb(var(--wpt-lms-white));
				border: none;
				border-radius: 0;
				color: rgb(var(--wpt-lms-black));
				font-family: inherit;
				font-size: 1rem;
				font-weight: 400;
				line-height: initial;
				padding: 0.625rem;
				transition: none;
				outline: none;
				box-shadow: none;
			}
		}
		/* Post meta */
		.postbox {
			&#{$h}-meta {
				border-color: rgb(var(--wpt-lms-postmeta-border));
				background-color: rgb(var(--wpt-lms-white));
				box-shadow: 0 0.063rem 0.25rem rgba(var(--wpt-lms-primary-700), 0.078);
				.postbox-header {
					background-color: rgb(var(--wpt-lms-primary-700), 5%);
					border-color: rgb(var(--wpt-lms-postmeta-border));
					padding: 1rem;
					h2 {
						color: rgb(var(--wpt-lms-primary-700));
						font-size: 1rem !important;
						padding: 0 !important;
					}
					.handle-order-higher:focus,
					.handle-order-lower:focus,
					.handlediv:focus {
						box-shadow: inset 0 0 0 0.125rem rgb(var(--wpt-lms-primary-700));
						border-radius: 50%;
						outline: 0.125rem solid transparent;
					}
				}

				.inside {
					padding: 1rem;
					margin: 0;
					font-size: 1rem;
					font-weight: 400;
					color: rgb(var(--wpt-lms-black));
				}
			}
		}
		//Tabs
		#{$h}-tab {
			display: flex;
			flex-flow: column wrap;
			gap: 1.25rem;
			& #{$h}-tab-navs {
				margin: 0;
				display: flex;
				flex-flow: row wrap;
				gap: 0.313rem;
				font-size: 0.875rem;
				padding-bottom: 0.625rem;
				border-bottom: 0.063rem solid rgb(var(--wpt-lms-postmeta-border));
				li {
					margin: 0;
					display: flex;
					&.ui-tabs-active,
					&.ui-tabs-active.ui-state-active {
						a {
							background-color: rgb(var(--wpt-lms-primary-700), 9%);
							color: rgb(var(--wpt-lms-primary-800));
						}
					}
					&.ui-state-hover {
						a {
							background-color: rgb(var(--wpt-lms-primary-700), 6%);
							color: rgb(var(--wpt-lms-primary-800));
						}
					}
				}
				a {
					text-decoration: none;
					color: rgb(var(--wpt-lms-black));
					font-weight: 500;
					padding: 0.318rem 0.5rem;
					border-radius: 0.188rem;
					&:focus {
						box-shadow: none;
					}
				}
			}
			& #{$h}-row {
				display: flex;
				flex-direction: column;
				gap: 1rem;
				&-item {
					display: grid;
					grid-template-columns: repeat(4, 1fr);
				}
				&-right {
					grid-column: span 3;
					display: flex;
					flex-direction: column;
					align-items: flex-start;
					gap: 0.5rem;
				}
				&-label {
					font-weight: 500;
				}
			}
		}
		#{$h}-infotext {
			font-size: 0.875rem;
			color: rgba(var(--wpt-lms-black), 0.75);
			margin-top: 0.5rem;
		}
		.edit-post-meta-boxes-area .postbox .handlediv {
			width: 1.62rem;
			height: 1.62rem;
		}
		.edit-post-meta-boxes-area .postbox .handle-order-higher,
		.handle-order-lower {
			width: 1.62rem;
			height: 1.62rem;
		}
	}
	//Add remove fields
	#{$h}-text-field {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 0.625rem;
		width: 100%;
		&-wrap {
			@extend #{$h}-text-field;
		}
	}
	& #{$h}-text-field {
		&-item {
			position: relative;
			width: 100%;
		}
		&-input {
			width: 100% !important;
			padding-right: 2.5rem !important;
			padding-left: 2.5rem !important;
			&:focus + .sort,
			&:focus + .sort + .delete {
				color: rgb(var(--wpt-lms-primary-700));
			}
		}
	}

	.sort {
		left: 0;
		cursor: grab;
	}
	.delete {
		right: 0;
	}
	.sort,
	.delete {
		display: flex;
		position: absolute;
		top: 0;
		width: 2.5rem;
		height: 100%;
		color: rgb(var(--wpt-lms-input-border));
		text-decoration: none;
		align-items: center;
		justify-content: center;
		transition: all 0.15s ease-in-out;
		font-size: 1.25rem;
	}
}

.inside {
	.categorydiv div.tabs-panel {
		padding: 0.938rem;
		.wpt-lms-grid {
			column-gap: 0;
			row-gap: 0.5rem;
			label {
				p {
					margin: 0;
				}
			}
		}
	}
	.meta-options {
		.selectit {
			input {
				border: 1px solid #8c8f94;
				border-radius: 4px;
				height: 1rem;
				margin: -0.25rem 0.25rem 0 0;
				vertical-align: middle;
				width: 1rem;
				box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
				transition: 0.05s border-color ease-in-out;
			}
			input[type="checkbox"] {
				border: 1px solid #8c8f94;
				border-radius: 4px;
				margin: -0.25rem 0.25rem 0 0;
				vertical-align: middle;
				width: 1rem;
				box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
				transition: 0.05s border-color ease-in-out;
				background: #fff;
				&::before {
					content: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20d%3D%27M14.83%204.89l1.34.94-5.81%208.38H9.02L5.78%209.67l1.34-1.25%202.57%202.4z%27%20fill%3D%27%233582c4%27%2F%3E%3C%2Fsvg%3E");
					margin: -0.1875rem 0 0 -0.25rem;
					height: 1.3125rem;
					width: 1.3125rem;
					display: inline-block;
				}
			}
			a {
				color: #2271b1;
			}
		}
	}
	#wpt-lms-material--group-container {
		// margin-top: 1.25rem;
		display: flex;
		flex-direction: column;
		// gap: 1.25rem;
		.#{$prefix}-material--group {
			margin-top: 1.25rem;
		}
	}
	.#{$prefix}-material--table {
		margin-top: 1.25rem;
	}
	.#{$prefix}-video {
		display: flex;
		align-items: center;
		gap: 0.625rem;
		font-family: "remixicon";
		i {
			&::before {
				color: rgb(var(--wpt-lms-primary-800));
				font-size: 1.5rem;
			}
		}
		.#{$prefix}-grid {
			width: 100%;
			.#{$prefix}-video-metabox-item {
				padding: 1.25rem;
				border: 1px dashed rgb(var(--wpt-lms-primary-800));
				border-radius: 0.188rem;
				display: flex;
				flex-direction: column;
				justify-content: flex-start;
				align-items: flex-start;
				width: 100%;
				gap: 1.25rem;
				.#{$prefix}-upload-img {
					display: none;

					.#{$prefix}-upload-img-card {
						padding: 1rem;
						flex-direction: row;
						justify-content: space-between;
						margin: 1.25rem 0;
						.#{$prefix}-card-body {
							padding: 0;
							.#{$prefix}-video-file-title {
								font-size: 1.25rem;
								font-weight: 500;
							}
						}
						.button {
							border: 0;
							background-color: transparent;
							box-shadow: none;
							&:hover {
								background-color: transparent;
							}
						}
					}
					.#{$prefix}-upload-poster {
						.#{$prefix}-upload-poster-card {
							margin-top: 1rem;
							padding: 1rem;
							flex-direction: row;
							.#{$prefix}-card-header {
								padding: 0;
								border-bottom: 0;
								width: 300px;
								height: 150px;
								border-bottom: 0;
								background-color: rgb(var(--wpt-lms-primary-50));
								img {
									max-width: 100%;
									max-height: 100%;
									width: auto;
									height: 100%;
									object-position: center;
									object-fit: cover;
								}
							}
						}
					}
				}
				&.#{$prefix}-has-video .#{$prefix}-upload-img {
					display: block;
				}
				&.#{$prefix}-has-video .htmls-video-upload {
					display: none;
				}
				input,
				textarea {
					width: 100%;
				}
			}
		}
	}
	#commentsdiv {
		#add-new-comment {
			padding: 1rem;
		}
		#no-comments {
			padding: 0 1rem 1rem 1rem;
		}
		.wp-list-table {
			tbody {
				td {
					padding: 1rem;
					.delete {
						display: inline-block;
						position: static;
						font-size: 13px;
					}
					.row-actions {
						span {
							a {
								color: rgb(var(--wpt-lms-primary-800));
							}
						}
					}
					.comment-reply {
						legend {
							padding: 1rem;
						}
						#replycontainer {
							padding: 0 1rem;
						}
						#replysubmit {
							padding: 0;
							.reply-submit-buttons {
								padding: 1rem;
							}
						}
					}
				}
			}
		}
	}
}

// Editor

.mce-toolbar {
	.mce-btn-group {
		.mce-btn.mce-listbox {
			border-radius: 0 !important;
			background: transparent !important;
			border: 0 !important;
			margin: 0 !important;
			&:hover {
				box-shadow: none !important;
				outline: 0 !important;
			}
		}
		.mce-btn {
			button {
				.mce-ico {
					color: rgb(var(--wpt-lms-primary-700)) !important;
				}
			}
			&:hover {
				box-shadow: 0 0 0 1px rgb(var(--wpt-lms-primary-700)) !important;
			}
		}
		.mce-wp-dfw {
			&:hover {
				box-shadow: 0 0 0 2px #2271b1 !important;
			}
			button {
				.mce-i-dfw {
					color: #50575e !important;
				}
			}
		}

		.mce-btn {
			button {
				padding: 0 3px !important;
			}
			&.mce-active {
				border-color: rgb(var(--wpt-lms-primary-700)) !important;
			}
			&.hover {
				box-shadow: 0 0 0 1.5px rgb(var(--wpt-lms-primary-700)) !important;
			}
		}
		.mce-colorbutton {
			.mce-preview {
				background-color: rgb(var(--wpt-lms-primary-800)) !important;
			}
			.mce-open {
				.mce-caret {
					border-top-color: rgb(var(--wpt-lms-primary-800)) !important;
				}
			}
		}
	}
}

.mce-toolbar .mce-ico {
	color: rgb(var(--wpt-lms-primary-800)) !important;
}
