#main:has(.dashboard__overview) .entry-header {
	display: none;
}

.dashboard__greeting {
	font-size: 25px;
	font-weight: bold;
	margin: 0 0 15px;
	color: #233b93;
}

.dashboard__courses,
.dashboard__overview {
	border-radius: 20px;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
	padding: 20px;
	--color-accent: #ccc;
}

.dashboard__overview {
	margin: 0 0 20px;
}

.dashboard__overview:has(.dashboard__overview-cell--off.dashboard__overview-cell--completed) ~ .dashboard__courses .dashboard__courses-course--completed,
.dashboard__overview:has(.dashboard__overview-cell--off.dashboard__overview-cell--not_started) ~ .dashboard__courses .dashboard__courses-course--not_started,
.dashboard__overview:has(.dashboard__overview-cell--off.dashboard__overview-cell--in_progress) ~ .dashboard__courses .dashboard__courses-course--in_progress {
	display: none;
}

.dashboard__courses h2.dashboard__courses-title,
.dashboard__overview h2.dashboard__overview-title {
	font-size: 25px;
	font-weight: bold;
	margin: 0 0 15px;
}

.dashboard__overview-tip {
	font-size: 14px;
	margin: -11px 0 20px;
}

.dashboard__overview-cells {
	display: flex;
	gap: 30px;
	flex-wrap: wrap;
}

.dashboard__overview-cell {
	cursor: pointer;
}

.dashboard__overview-cell:not(.dashboard__overview-cell--off):hover .dashboard__overview-cell-value {
	color: var(--color-accent);
}

.dashboard__overview-cell--off {
	opacity: 0.7;
	--color-accent: #aaa !important;
	color: #aaa;
}

.dashboard__overview-cell--off:hover {
	opacity: 1;
}

.dashboard__overview-cell-title {
	font-size: 16px;
	display: flex;
	align-items: center;
	gap: 8px;
}

.dashboard__overview-cell-title::before {
	content: '';
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--color-accent);
}

.dashboard__overview-cell-value {
	font-size: 40px;
	font-weight: 600;
	width: 60px;
	border-bottom: 2px solid var(--color-accent);
}

.dashboard__courses-header {
	display: flex;
	border-bottom: 1px solid #aaa;
	gap: 15px;
	padding: 0 0 10px;
	font-size: 16px;
	margin-bottom: 8px;
}

.dashboard__courses-list {
	display: flex;
	flex-direction: column;
}

.dashboard__courses-course summary {
	display: flex;
	gap: 10px;
	padding: 6px 0 6px 20px;
	position: relative;
}

.dashboard__courses-course summary::before,
.dashboard__courses-course summary::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 0;
	width: 11px;
	border-top: 1px solid #000;
	height: 0;
	transform: translateY(-50%);
}

.dashboard__courses-course summary::after {
	transform: translateY(-45%) rotate(90deg);	
}

.dashboard__courses-course[open] summary::after {
	display: none;
}

.dashboard__courses-course--not_started {
	--color-accent: #253e92;
	order: 2;
}

.dashboard__courses-course--in_progress {
	--color-accent: #fab616;
	order: 1;
}

.dashboard__courses-course--completed {
	--color-accent: #2c9d48;
	order: 3;
}

.lesson__list-lesson--pending {
	color: #d3455b;
	font-weight: 600;
}

.dashboard__courses-course-title a:hover,
.dashboard__courses-course-title a,
.dashboard__courses-course-title {
	color: var(--color-accent);
	text-decoration: none;
	font-weight: bold;
	font-size: 17px;
}

.dashboard__courses-course-progress {
	font-size: 16px;
}

.courses__title {
	flex: 1;
}

.courses__progress {
	flex: 0 0 150px;
}

.courses__due {
	flex: 0 0 150px;
}

.courses__due--value {
	font-size: 16px;
}

.lesson__list {
	font-size: 15px;
	display: flex;
	flex-direction: column;
	gap: 5px;
	padding: 10px 20px 30px;
}

.lesson__list-title {
	font-weight: 600;
	font-size: 16px;
}

.lesson__list-lesson--done {
	text-decoration: line-through;
	opacity: 0.5;
}

.lesson__list-lesson a {
	color: inherit;
	text-decoration: none;
}

.lesson__list-lesson a:hover {
	text-decoration: underline;
}

.course__completed-on {
	font-size: 14px;
	margin: 0 0 10px 20px;
}

@media (max-width: 768px) {
	.courses__due {
		display: none;
	}

	.courses__progress {
		flex: 0 0 120px;
	}
}