@import "./common.scss";

#poststuff {
	.inside {
		&:has(.media-type-select) {
			padding: 10px;
			margin: 0;
		}
		&:has(.stlms-lesson-duration) {
			padding: 10px;
			margin: 0;
		}
	}
}
.media-type-select{
	display: flex;
	gap: 16px;
	padding-bottom: 10px;
}
.stlms-media-choose{
	display: flex;
	align-items: center;
	&.hidden {
		display: none !important;
	}
	label{
		width: 178px;
		font-size: 12px;
		font-weight: 600;
		flex-shrink: 0;
	}
	input:not([type="checkbox"]){
		width: 226px
	}
	.stlms-media-file{
		width: 100%;
		display: flex;
		align-items: center;
		gap: 16px;
		span.stlms-media-name{
			font-size: 14px;
			a {
				text-decoration: none;
			}
		}
	}
	&.ai-chatbot-option {
		padding-bottom: 8px;
	}
}
.stlms-video-type-box{
	border: 1px solid #DDDDDD;
	padding: 10px;
	.stlms-or{
		display: flex;
		align-items: center;
		gap: 8px;
		padding: 5px 0;
		span{
			text-transform: uppercase;
			color: #A0A0A0;
			font-size: 12px;
			font-weight: 600;
			flex-shrink: 0;
		}
		&:after{
			content: "";
			background: #DDDDDD;
			width: 100%;
			height: 1px;
			display: block;
		}
	}
}

.stlms-lesson-duration{
	display: flex;
	align-items: center;
	padding-bottom: 20px;
	label{
		width: 178px;
		font-size: 12px;
		font-weight: 600;
	}
	input{
		width: 64px
	}
}

.stlms-materials-box{
	border: 1px solid #DDDDDD;
	margin-bottom: 10px;
	&__header{
		padding: 10px;
		border-bottom: 1px solid #DDDDDD;
		display: flex;
		align-items: center;
		justify-content: space-between;
		h3{
			font-size: 12px;
			font-weight: 600;
			color: #23282D;
			margin: 0
		}
		p{
			margin: 0;
			font-size: 12px;
			color: #272D31;
		}
	}

	&.brd-0 &{
		&__header{
			border: 0;
		}
	}

	&__footer{
		padding: 10px;
	}
	.stlms-materials-list{
		ul {
			display: flex;
			margin: 0;
			&.hidden{
				display: none;
			}
			li{
				font-size: 12px;
				line-height: 1.361;
				color: #23282D;
				width: 33.333%;
				padding: 10px;
				margin: 0;
				position: relative;
				border-bottom: 1px solid #DDDDDD;
				&:not(:last-child):after{
					content: "";
					position: absolute;
					top: 0;
					right: 0;
					bottom: 0;
					width: 1px;
					height:16px;
					margin: auto 0;
					background: #DDDDDD;
				}
				&:not(:first-child){
					padding-left: 35px;
				}
				.stlms-materials-list-action{
					display: flex;
    				gap: 20px;
					> a {
						display: flex;
						align-items: center;
						text-decoration: none;
						color: #0073aa;
						font-size: 12px;
						font-weight: 600;
						gap: 10px;
						&.stlms-delete-link {
							color: #a53934;
						}
					}
				}
			}
		}
	}
}

.stlms-materials-item{
	.stlms-media-choose{
		padding: 10px;
		border-bottom: 1px solid #DDDDDD;
	}
	.stlms-remove-material{
		color: #A53934;
		background: transparent;
		border: 0;
		padding: 0 10px;
		display: flex;
		align-items: center;
		gap: 10px;
		cursor: pointer;
	}
}

#assign-to-course{
	.stlms-assign-quiz{
		padding-top: 16px;
		padding-bottom: 10px;
		text-align: center;
	}
}
.inline-edit-lesson {
	.inline-edit-col {
		span.title {
			display: block;
			margin: .2em 0;
			line-height: 2.5;
		}
		.inline-edit-lesson {
			label {
				display: flex;
				align-items: center;
				width: 100%;
				gap: 10px;
				margin: 0;
				input {
					width: 60%;
				}
				select {
					width: 20%;
				}
				ul.cat-checklist {
					width: 60%;
					background: #ffffff;
					height: 9em;
					input {
						width: 16px;
					}
				}
			}
		}
	}
}