/* Mestre styling layer for Tutor LMS. Keep Tutor LMS responsible for layout and behaviour. */

body.tutor-lms-body,
.tutor-wrap,
.tutor-course-details-page,
.tutor-dashboard {
	color: var(--mestre-brand-black);
	font-family: var(--mestre-font-family);
}

.tutor-wrap {
	padding-block: clamp(2rem, 5vw, 5rem);
}

.tutor-card,
.tutor-course-card,
.tutor-dashboard-content,
.tutor-course-details-widget,
.tutor-login-wrap {
	border-color: rgba(48, 55, 61, 0.12) !important;
	border-radius: var(--mestre-radius) !important;
	background: var(--mestre-white);
	box-shadow: var(--mestre-shadow);
}

.tutor-btn,
.tutor-btn-primary,
.tutor-button,
.tutor-course-entry-box .tutor-btn {
	border-color: var(--mestre-brand-teal) !important;
	border-radius: var(--mestre-radius-small) !important;
	background: var(--mestre-brand-teal) !important;
	color: var(--mestre-brand-black) !important;
	font-weight: 700;
}

.tutor-btn:hover,
.tutor-btn:focus,
.tutor-btn-primary:hover,
.tutor-btn-primary:focus {
	border-color: var(--mestre-brand-black) !important;
	background: var(--mestre-brand-black) !important;
	color: var(--mestre-brand-softwhite) !important;
}

.tutor-color-primary,
.tutor-color-primary a,
.tutor-course-name a,
.tutor-dashboard-menu-item.active a,
.tutor-dashboard-menu-item:hover a {
	color: var(--mestre-brand-teal) !important;
}

.tutor-progress-bar .tutor-progress-value,
.tutor-progress-value,
.tutor-form-check-input:checked {
	background-color: var(--mestre-brand-organiseren) !important;
}

.tutor-dashboard-left-menu,
.tutor-course-single-sidebar-wrapper {
	background: var(--mestre-brand-softwhite) !important;
}

.tutor-course-details-title,
.tutor-course-content-title,
.tutor-dashboard-title {
	color: var(--mestre-brand-black);
	font-weight: 300;
}


/* Tutor LMS 4 course archive and cards. */
.course-archive-page {
	--tutor-color-primary: var(--mestre-brand-teal);
	--tutor-color-primary-rgb: 116, 173, 175;
	padding-block: clamp(2.5rem, 6vw, 6rem);
}

.course-archive-page > .tutor-row { row-gap: 2rem; }

.mestre-course-archive-intro {
	max-width: 52rem;
	margin-bottom: clamp(2rem, 5vw, 4rem);
}

.mestre-course-archive-intro h1 {
	max-width: 14ch;
	margin-bottom: 0.3em;
}

.mestre-course-archive-intro > p:last-child {
	max-width: 42rem;
	margin-bottom: 0;
	font-size: clamp(1.05rem, 1rem + 0.3vw, 1.25rem);
}

.course-archive-page .tutor-course-filter-container {
	align-self: flex-start;
	padding: clamp(1.25rem, 2vw, 1.75rem);
	border: 1px solid rgba(48, 55, 61, 0.12);
	border-radius: var(--mestre-radius);
	background: var(--mestre-white);
}

.course-archive-page .tutor-widget + .tutor-widget { margin-top: 2rem; }
.course-archive-page .tutor-widget-title { margin-bottom: 0.75rem; font-size: 1rem; font-weight: 700; }
.course-archive-page .tutor-list-item label { display: flex; align-items: flex-start; gap: 0.65rem; cursor: pointer; }
.course-archive-page .tutor-course-filter[tutor-course-filter] { margin-bottom: 1.5rem; }
.course-archive-page .tutor-course-filter[tutor-course-filter] form { width: min(100%, 19rem); }

.course-archive-page .tutor-course-list,
.course-archive-page .tutor-course-listing-grid { gap: clamp(1rem, 2.5vw, 2rem); }

.course-archive-page .tutor-course-card {
	overflow: hidden;
	height: 100%;
	transition: transform 180ms ease, box-shadow 180ms ease;
}

.course-archive-page .tutor-course-card:hover {
	transform: translateY(-0.25rem);
	box-shadow: 0 1.25rem 3.5rem rgba(48, 55, 61, 0.13);
}

.course-archive-page .tutor-course-card:focus-within {
	outline: 3px solid color-mix(in srgb, var(--mestre-brand-teal) 65%, white);
	outline-offset: 3px;
}

.course-archive-page .tutor-course-card .tutor-card-image-top,
.course-archive-page .tutor-course-card img { border-radius: var(--mestre-radius) var(--mestre-radius) 0 0; }
.course-archive-page .tutor-course-card .tutor-card-body { padding: clamp(1rem, 2.5vw, 1.5rem); }
.course-archive-page .tutor-course-card .tutor-course-name { font-size: clamp(1.2rem, 1.05rem + 0.5vw, 1.55rem); line-height: 1.25; }
.course-archive-page .tutor-course-card .tutor-course-name a { color: var(--mestre-brand-black) !important; text-decoration: none; }
.course-archive-page .tutor-course-card .tutor-card-footer { padding: 1rem clamp(1rem, 2.5vw, 1.5rem); border-color: rgba(48, 55, 61, 0.1); }
.course-archive-page .tutor-pagination { margin-top: clamp(2rem, 4vw, 3rem); }

.course-archive-page .tutor-empty-state {
	padding: clamp(2rem, 6vw, 5rem);
	border: 1px dashed rgba(48, 55, 61, 0.24);
	border-radius: var(--mestre-radius);
	background: rgba(255, 255, 255, 0.55);
}

/* Tutor course cards on the existing homepage. */
.mestre-home-courses {
	margin-top: clamp(3rem, 7vw, 7rem);
	padding-block: clamp(3rem, 7vw, 7rem);
	background: color-mix(in srgb, var(--mestre-brand-ondersteunen) 28%, var(--mestre-brand-softwhite));
}

.mestre-home-courses__header {
	max-width: 48rem;
	margin-bottom: clamp(1.5rem, 4vw, 3rem);
}

.mestre-home-courses__header h2 { margin-bottom: 0; }
.mestre-home-courses__more { margin: clamp(2rem, 4vw, 3rem) 0 0; text-align: center; }

/* Course detail */
.tutor-course-details-page .tutor-course-details-title{max-width:18ch;font-size:clamp(2.25rem,1.7rem + 2.5vw,4.5rem);line-height:1.05}
.tutor-course-details-page .tutor-course-details-widget{overflow:hidden}
.tutor-course-details-page .tutor-course-content-list-item{border-color:rgba(48,55,61,.1)!important}
.tutor-course-details-page .tutor-course-topic{border-radius:var(--mestre-radius);background:var(--mestre-white)}
.tutor-course-details-page .tutor-accordion-item-header{font-weight:700}

/* Dashboard */
.tutor-dashboard .tutor-dashboard-left-menu{border-radius:var(--mestre-radius);padding-block:.75rem}
.tutor-dashboard .tutor-dashboard-permalinks li a{border-radius:var(--mestre-radius-small);color:var(--mestre-brand-black)}
.tutor-dashboard .tutor-dashboard-permalinks li.active a,.tutor-dashboard .tutor-dashboard-permalinks li a:hover{background:var(--mestre-brand-ondersteunen);color:var(--mestre-brand-black)}
.tutor-dashboard .tutor-dashboard-content{padding:clamp(1rem,3vw,2rem)}
.tutor-dashboard .tutor-dashboard-title{font-size:var(--mestre-font-size-h3)}
.tutor-dashboard .tutor-card{height:100%}

/* Tutor 4 learning area */
.tutor-learning-area {
	--tutor-brand-200: color-mix(in srgb, var(--mestre-brand-ondersteunen) 55%, white);
	--tutor-brand-300: var(--mestre-brand-ondersteunen);
	--tutor-brand-500: var(--mestre-brand-teal);
	--tutor-brand-600: var(--mestre-brand-teal);
	--tutor-actions-brand-primary: var(--mestre-brand-teal);
	--tutor-actions-brand-secondary: var(--mestre-brand-ondersteunen);
	--tutor-actions-brand-tertiary: color-mix(in srgb, var(--mestre-brand-ondersteunen) 38%, white);
	--tutor-actions-success-primary: var(--mestre-brand-organiseren);
	--tutor-actions-success-secondary: color-mix(in srgb, var(--mestre-brand-organiseren) 62%, white);
	--tutor-actions-success-tertiary: color-mix(in srgb, var(--mestre-brand-organiseren) 25%, white);
	--tutor-border-brand: var(--mestre-brand-teal);
	--tutor-border-success: color-mix(in srgb, var(--mestre-brand-organiseren) 72%, var(--mestre-brand-black));
	--tutor-icon-brand: var(--mestre-brand-teal);
	--tutor-icon-brand-hover: var(--mestre-brand-black);
	--tutor-text-brand: var(--mestre-brand-black);
}
.tutor-course-single-content-wrapper,.tutor-learning-area{background:var(--mestre-brand-softwhite)!important}
.tutor-course-single-sidebar-wrapper,.tutor-learning-area .tutor-course-single-sidebar-wrapper{border-color:rgba(48,55,61,.12)!important;background:var(--mestre-white)!important}
.tutor-course-single-sidebar-title,.tutor-course-single-sidebar-wrapper .tutor-accordion-item-header{color:var(--mestre-brand-black);font-weight:700}
.tutor-course-single-sidebar-wrapper .tutor-course-topic-item.is-active,.tutor-course-single-sidebar-wrapper .tutor-course-topic-item:hover{background:var(--mestre-brand-ondersteunen)!important}
.tutor-learning-area .tutor-progress-bar .tutor-progress-value,
.tutor-learning-area .tutor-progress-value {background-color:var(--mestre-brand-organiseren)!important}
.tutor-learning-area .tutor-color-success {color:color-mix(in srgb,var(--mestre-brand-organiseren) 55%,var(--mestre-brand-black))!important}
.tutor-learning-area .tutor-learning-nav-body::before {width:2px!important;background:color-mix(in srgb,var(--mestre-brand-teal) 62%,transparent)!important}
.tutor-learning-area .tutor-learning-nav-item.mestre-item-complete > svg {display:none}
.tutor-learning-area .tutor-learning-nav-item.mestre-item-complete::before {content:"\2713";display:inline-grid;position:static;width:1rem;height:1rem;flex:0 0 1rem;margin-top:.15rem;place-items:center;border-radius:50%;background:var(--mestre-brand-organiseren);color:var(--mestre-brand-black);font-size:.68rem;font-weight:700;line-height:1}
.tutor-learning-area .tutor-learning-nav-item.active,
.tutor-learning-area .tutor-learning-nav-item.active:hover,
.tutor-learning-area .tutor-learning-nav-item.active:focus {background:var(--mestre-brand-black)!important;color:var(--mestre-white)!important;view-transition-name:mestre-active-lesson}
.tutor-learning-area .tutor-learning-nav-item.active.mestre-item-complete::before {display:inline-grid;background:rgba(255,255,255,.16);color:var(--mestre-white)}
.tutor-learning-area .tutor-learning-nav-item.active .tutor-text-subdued {color:rgba(255,255,255,.72)!important}
.tutor-learning-area .tutor-learning-nav-item.active:not(.mestre-item-complete) svg,
.tutor-learning-area .tutor-learning-nav-item.active:not(.mestre-item-complete) svg path {color:var(--mestre-white)!important;stroke:var(--mestre-white)!important}
.tutor-course-single-content-wrapper .tutor-course-single-content,.tutor-learning-area .tutor-course-single-content{max-width:62rem;margin-inline:auto;padding:clamp(1.25rem,4vw,3rem)}
.tutor-course-single-content-wrapper .tutor-lesson-content-area{font-size:var(--mestre-font-size-body);line-height:1.75}
.tutor-course-single-content-wrapper .tutor-lesson-content-area>p,.tutor-course-single-content-wrapper .tutor-lesson-content-area>ul,.tutor-course-single-content-wrapper .tutor-lesson-content-area>ol{max-width:var(--mestre-reading-width)}

/* Forms, tables and feedback */
.tutor-form-control,.tutor-form-select{border-color:rgba(48,55,61,.2)!important;border-radius:var(--mestre-radius-small)!important}
.tutor-table{border-radius:var(--mestre-radius);overflow:hidden;background:var(--mestre-white)}
.tutor-alert{border-radius:var(--mestre-radius-small)}
.tutor-alert-success{background:color-mix(in srgb,var(--mestre-brand-organiseren) 35%,white)}
.tutor-alert-warning{background:color-mix(in srgb,var(--mestre-brand-plannen) 35%,white)}

@media(max-width:48rem){.tutor-wrap{padding-block:1.5rem}.tutor-course-details-page .tutor-course-details-title{font-size:clamp(2rem,10vw,3rem)}.tutor-course-single-content-wrapper .tutor-course-single-content{padding:1rem}.mestre-course-archive-intro{margin-bottom:2rem}.course-archive-page .tutor-course-filter-container{padding:1rem}}

@media (prefers-reduced-motion: reduce) {
	.course-archive-page .tutor-course-card { transition: none; }
	.course-archive-page .tutor-course-card:hover { transform: none; }
}

@view-transition { navigation: auto; }
::view-transition-group(mestre-active-lesson) { animation-duration: .32s; animation-timing-function: cubic-bezier(.22, 1, .36, 1); }

@media (prefers-reduced-motion: reduce) {
	::view-transition-group(mestre-active-lesson) { animation-duration: 0s; }
}

/* The shared site header already provides branding and a route home. */
.tutor-dashboard-sidebar-logo {
	display: none !important;
}

/* Full-canvas Tutor 4 learning area. */
@media (min-width: 769px) {
	.tutor-learning-area .tutor-learning-area-content {
		min-height: calc(100vh - 64px);
		background: var(--mestre-white);
	}

	.tutor-learning-area.tutor-has-admin-bar .tutor-learning-area-content {
		min-height: calc(100vh - 96px);
	}

	.tutor-learning-area .tutor-learning-area-container {
		width: 100%;
		max-width: none !important;
		min-height: inherit;
		margin: 0;
		padding: clamp(1rem, 2vw, 2rem);
	}

	.tutor-learning-area .tutor-lesson-content {
		display: flex;
		min-height: calc(100vh - 128px);
		margin-top: 0;
		flex-direction: column;
	}

	.tutor-learning-area.tutor-has-admin-bar .tutor-lesson-content {
		min-height: calc(100vh - 160px);
	}

	.tutor-learning-area .tutor-lesson-content-tab {
		display: flex;
		flex: 1;
		flex-direction: column;
		border: 0;
		border-radius: 0;
		box-shadow: none;
	}

	.tutor-learning-area .tutor-tabs-content,
	.tutor-learning-area .tutor-tab-panel {
		display: flex;
		flex: 1;
		flex-direction: column;
	}

	.tutor-learning-area .tutor-tab-panel[style*="display: none"] {
		display: none !important;
	}

	.tutor-learning-area .tutor-lesson-wrapper {
	width: 100%;
	max-width: 80ch;
	font-size: var(--mestre-font-size-body);
	line-height: 1.75;
	}

	.tutor-learning-area .tutor-lesson-video-wrapper,
	.tutor-learning-area .tutor-lesson-image-wrapper,
	.tutor-learning-area .tutor-quiz-wrapper {
		width: 100%;
		max-width: none;
	}
}

@media (min-width: 1600px) {
	.tutor-learning-area .tutor-learning-area-container {
		padding: 2rem 3rem;
	}
}

/* Quiet, unified Tutor learning chrome. */
@media (min-width: 993px) {
	html.mestre-learning-sidebar-collapsed .tutor-learning-area .tutor-learning-sidebar {
		opacity: 0;
		pointer-events: none;
		transform: translateX(-100%);
	}

	html[dir="rtl"].mestre-learning-sidebar-collapsed .tutor-learning-area .tutor-learning-sidebar {
		transform: translateX(100%);
	}

	html.mestre-learning-sidebar-collapsed .tutor-learning-area .tutor-learning-area-body {
		padding-inline-start: 0;
	}

	.tutor-learning-area {
		--mestre-learning-sidebar-background: #f0f1f0;
	}

	.tutor-learning-area .tutor-learning-header {
		background: linear-gradient(
			to right,
			var(--mestre-learning-sidebar-background) 0,
			var(--mestre-learning-sidebar-background) 320px,
			var(--mestre-white) 320px,
			var(--mestre-white) 100%
		);
	}

	.tutor-learning-area.is-fullscreen .tutor-learning-header {
		background: var(--mestre-white);
	}

	html.mestre-learning-sidebar-collapsed .tutor-learning-area .tutor-learning-header {
		background: var(--mestre-white);
	}

	.tutor-learning-area .tutor-learning-header-inner {
		background: transparent;
		border-radius: 0;
		overflow: visible;
	}

	.tutor-learning-area .tutor-learning-header-back {
		border-inline-end: 0;
	}

	.tutor-learning-area .tutor-learning-header-title {
		margin-inline-start: 0;
	}

	.tutor-learning-area .tutor-expand-btn {
		z-index: 21;
		top: 50%;
		bottom: auto;
		inset-inline-start: 304px;
		position: fixed;
		width: 2rem;
		height: 3.5rem;
		padding: 0;
		border: 1px solid rgba(48, 55, 61, 0.14) !important;
		border-inline-start: 0 !important;
		border-radius: 0 var(--mestre-radius-small) var(--mestre-radius-small) 0 !important;
		background: var(--mestre-learning-sidebar-background) !important;
		box-shadow: .35rem 0 1rem rgba(48, 55, 61, 0.08);
		transform: translateY(-50%);
		transition: inset-inline-start .25s ease-in-out, background-color 160ms ease;
	}

	.tutor-learning-area.tutor-has-admin-bar .tutor-expand-btn {
		top: 50%;
	}

	.tutor-learning-area.is-fullscreen .tutor-expand-btn {
		inset-inline-start: 0;
	}

	html.mestre-learning-sidebar-collapsed .tutor-learning-area .tutor-expand-btn {
		inset-inline-start: 0;
	}

	.tutor-learning-area .tutor-expand-btn:hover,
	.tutor-learning-area .tutor-expand-btn:focus-visible {
		background: var(--mestre-brand-ondersteunen) !important;
	}

	.tutor-learning-area .tutor-learning-sidebar {
		gap: 0;
		padding: 0;
		border-inline-end: 1px solid rgba(48, 55, 61, 0.08);
		background: var(--mestre-learning-sidebar-background);
	}

	.tutor-learning-area .tutor-learning-sidebar-curriculum {
		border-radius: 0;
		background: transparent;
	}

	.tutor-learning-area .tutor-learning-sidebar-pages,
	.tutor-learning-area .tutor-learning-sidebar-pages.expanded {
		margin-top: 0;
		margin-bottom: 0 !important;
		border-top: 1px solid rgba(48, 55, 61, 0.1);
		border-radius: 0;
		background: transparent;
	}

	.tutor-learning-area .tutor-learning-sidebar-pages .tutor-sidebar-resizer,
	.tutor-learning-area .tutor-learning-sidebar-pages .tutor-sidebar-restore-dropdown {
		display: none;
	}
}

/* Replace Tutor's 100% topic circle with an unambiguous completion mark. */
.tutor-learning-area .mestre-topic-complete {
	display: inline-grid;
	width: 1rem;
	height: 1rem;
	flex: 0 0 1rem;
	place-items: center;
	border-radius: 50%;
	background: var(--mestre-brand-organiseren);
	color: var(--mestre-brand-black);
	font-size: .68rem;
	font-weight: 700;
	line-height: 1;
}

.tutor-learning-area .mestre-topic-complete > div { display: none; }
.tutor-learning-area .mestre-topic-complete::before { content: "\2713"; }


/* One quiet lesson toolbar: notes left, progress actions right. */
.tutor-learning-area .tutor-tabs-nav[data-mestre-toolbar="ready"] {display:flex;align-items:center;gap:.5rem;border-bottom:0!important}
.tutor-learning-area .tutor-tabs-nav .mestre-overview-tab {display:none!important}
.tutor-learning-area .mestre-notes-count {display:inline-grid;min-width:1.35rem;height:1.35rem;margin-inline-start:.15rem;padding-inline:.3rem;place-items:center;border-radius:999px;background:var(--mestre-brand-teal);color:white;font-size:.75rem;font-weight:700;line-height:1}
.tutor-learning-area .mestre-notes-count[hidden] {display:none}
.tutor-learning-area .tutor-tabs-nav .mestre-notes-toggle {position:static;margin:0}
.tutor-learning-area .mestre-discussions-link {display:inline-flex;align-items:center;gap:.45rem;min-height:2.5rem;padding:.5rem .75rem;border-radius:var(--mestre-radius-small);color:var(--mestre-brand-black);font-size:.875rem;font-weight:600;text-decoration:none}
.tutor-learning-area .mestre-discussions-link:hover,.tutor-learning-area .mestre-discussions-link:focus-visible {background:var(--mestre-brand-ondersteunen);color:var(--mestre-brand-black)}
.tutor-learning-area .mestre-discussions-link svg {width:1.25rem;height:1.25rem}
.tutor-learning-area #tutor-take-lesson-note-btn,
.tutor-learning-area #tutor-lesson-nav-take-note-btn {display:none!important}
.tutor-learning-area .mestre-lesson-actions {display:flex;align-items:center;gap:.5rem;margin-inline-start:auto}
.tutor-learning-area .mestre-lesson-actions form {margin:0!important}
.tutor-learning-area .mestre-lesson-navigation {display:inline-flex;align-items:center;gap:.4rem;white-space:nowrap}
.tutor-learning-area .mestre-lesson-navigation__arrow {font-size:1.15em;line-height:1}
.tutor-learning-area .mestre-lesson-actions .tutor-mark-as-complete-button {min-width:auto;height:2.5rem;padding-inline:1rem}
.tutor-learning-area .mestre-lesson-actions .tutor-mark-as-complete-button svg {width:1.5rem;height:1.5rem}
.tutor-learning-area .mestre-lesson-actions .tutor-mark-as-complete-button.completed {border-color:var(--mestre-brand-organiseren)!important;background:var(--mestre-brand-organiseren)!important;color:var(--mestre-brand-black)!important}
.tutor-learning-area .mestre-lesson-actions .tutor-mark-as-complete-button.completed svg {color:var(--mestre-brand-black)!important}
.tutor-learning-area .tutor-learning-area-footer:empty,.tutor-learning-area .tutor-learning-area-footer.mestre-integrated-footer {display:none}
@media (max-width:768px){.tutor-learning-area .tutor-tabs-nav[data-mestre-toolbar="ready"]{flex-wrap:wrap}.tutor-learning-area .mestre-lesson-actions{width:100%;margin-inline-start:0;justify-content:flex-end}}