.hlc-campus-learning-status {
	position: relative;
	z-index: 1;
	display: grid;
	width: min(560px, 100%);
	grid-template-columns: 1fr auto;
	align-items: center;
	gap: 12px;
	margin-top: 18px;
	border: 1px solid rgba(73, 99, 77, .16);
	border-radius: 18px;
	background: rgba(255, 255, 255, .78);
	padding: 12px 14px;
	color: #49634d;
}

.hlc-lesson-progress {
	width: min(560px, 100%);
	margin-top: 12px;
	border: 1px solid rgba(73, 99, 77, .16);
	border-radius: 18px;
	background: rgba(255, 255, 255, .78);
	padding: 16px;
}

.hlc-lesson-progress__heading {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 10px;
}

.hlc-lesson-progress__heading > span {
	display: grid;
	width: 34px;
	height: 34px;
	place-items: center;
	border-radius: 50%;
	background: #e5daef;
	color: #5b496e;
	font-weight: 900;
}

.hlc-lesson-progress__heading small,
.hlc-lesson-progress > small {
	color: #667169;
}

.hlc-lesson-progress__bar {
	height: 9px;
	overflow: hidden;
	margin: 12px 0;
	border-radius: 999px;
	background: #e3e6df;
}

.hlc-lesson-progress__bar span {
	display: block;
	height: 100%;
	border-radius: inherit;
	background: linear-gradient(90deg, #728c74, #9bab72);
}

.hlc-lesson-progress__goals {
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
}

.hlc-lesson-progress__goals span,
.hlc-lesson-progress__goals a {
	border-radius: 999px;
	background: #f3f1eb;
	padding: 5px 9px;
	color: #6b716c;
	font-size: .78rem;
	font-weight: 700;
	text-decoration: none;
}

.hlc-lesson-progress__goals .is-done {
	background: #dfeadd;
	color: #49634d;
}

.hlc-lesson-progress.is-complete {
	border-color: #8ba58c;
	background: #edf5ed;
}

.hlc-lesson-progress.is-complete .hlc-lesson-progress__heading > span {
	background: #728c74;
	color: #fff;
}

.hlc-lesson-progress > small {
	display: block;
	margin-top: 10px;
}

.hlc-campus-learning-summary {
	display: flex;
	min-width: 0;
	flex-direction: column;
}

.hlc-campus-learning-status span,
.hlc-campus-learning-status label > span {
	font-size: .78rem;
	font-weight: 700;
}

.hlc-campus-learning-status strong {
	font-size: .9rem;
}

.hlc-learning-edit,
.hlc-learning-cancel {
	border: 0;
	background: transparent;
	color: #49634d;
	font: inherit;
	font-weight: 800;
	text-decoration: underline;
	cursor: pointer;
}

.hlc-learning-form {
	display: grid;
	grid-column: 1 / -1;
	grid-template-columns: minmax(140px, .8fr) minmax(180px, 1.2fr);
	gap: 12px;
	border-top: 1px solid rgba(73, 99, 77, .14);
	padding-top: 13px;
}

.hlc-learning-form[hidden] {
	display: none !important;
}

.hlc-learning-form label {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.hlc-learning-form label > strong,
.hlc-learning-form select {
	min-height: 44px;
	border: 1px solid rgba(73, 99, 77, .22);
	border-radius: 11px;
	background: #fff;
	padding: 9px 11px;
	color: #29352d;
	font: inherit;
}

.hlc-learning-form label > strong {
	display: flex;
	align-items: center;
}

.hlc-learning-form > div {
	display: flex;
	grid-column: 1 / -1;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
}

.hlc-learning-form .hlc-button {
	width: auto;
	min-height: 42px;
	padding: 9px 16px;
}

.hlc-learning-form > p {
	grid-column: 1 / -1;
	margin: 0;
	font-size: .86rem;
	font-weight: 700;
}

.hlc-campus-learning-status > small {
	grid-column: 1 / -1;
}

.hlc-lesson-next-dialog {
	position: fixed;
	z-index: 100000;
	inset: 0;
	display: grid;
	place-items: center;
	padding: 20px;
	opacity: 0;
	transition: opacity .2s ease;
}

.hlc-lesson-next-dialog[hidden] {
	display: none !important;
}

.hlc-lesson-next-dialog.is-visible {
	opacity: 1;
}

.hlc-lesson-next-dialog__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(34, 45, 38, .58);
	backdrop-filter: blur(5px);
}

.hlc-lesson-next-dialog__card {
	position: relative;
	width: min(520px, 100%);
	border: 1px solid rgba(73, 99, 77, .2);
	border-radius: 28px;
	background: linear-gradient(135deg, #faf5e8, #eef4e9 60%, #eee7f4);
	box-shadow: 0 24px 70px rgba(36, 47, 40, .3);
	padding: clamp(26px, 5vw, 44px);
	text-align: center;
}

.hlc-lesson-next-dialog__icon {
	display: grid;
	width: 68px;
	height: 68px;
	margin: 0 auto 16px;
	place-items: center;
	border-radius: 50%;
	background: #728c74;
	color: #fff;
	font-size: 2rem;
	font-weight: 900;
}

.hlc-lesson-next-dialog__card h2 {
	margin: 8px 0 12px;
	color: #29352d;
	font-size: clamp(1.55rem, 4vw, 2.15rem);
}

.hlc-lesson-next-dialog__card p {
	color: #5e6c62;
}

.hlc-lesson-next-dialog__message {
	min-height: 1.4em;
	font-weight: 800;
}

.hlc-lesson-next-dialog__actions {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 20px;
}

.hlc-lesson-next-dialog__actions .hlc-button {
	width: auto;
}

@media (max-width: 480px) {
	.hlc-campus-learning-status {
		grid-template-columns: 1fr;
		border-radius: 16px;
	}

	.hlc-learning-edit {
		justify-self: start;
	}

	.hlc-learning-form {
		grid-template-columns: 1fr;
	}

	.hlc-lesson-next-dialog__actions .hlc-button {
		width: 100%;
	}
}
