/* elmur-ds-driving-lessons: Frontend booking styles.
   One cohesive calendar widget: stacked control bars (filled boxes) that connect
   into a coloured month header and the calendar/list body, plus a slot panel.
   Uses the shared theme tokens (--ds-*) like the other frontend forms. */

.elmur-ds-dlf {
	max-width: none;
}

/* Notices */
.elmur-ds-dlf__notice {
	margin-bottom: 1.2em;
	padding: 0.75em 1em;
	border-radius: 4px;
	font-size: 0.95em;
	border-left: 4px solid transparent;
}

.elmur-ds-dlf__notice--success {
	background: #edfaed;
	border-color: #4caf50;
	color: #1a6b1a;
}

.elmur-ds-dlf__notice--error {
	background: #fcecec;
	border-color: #d63638;
	color: #8a1f1f;
}

/* The widget: one connected card */
.elmur-ds-dlf__widget {
	max-width: 30rem;
	border: 1px solid #d6d9dc;
	border-radius: 8px;
	overflow: hidden;
	background: #fff;
	box-shadow: 0 1px 3px rgba( 0, 0, 0, 0.08 );
}

.elmur-ds-dlf__widget--list {
	max-width: 46rem;
}

/* Stacked control bars (filled boxes) */
.elmur-ds-dlf__bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5em 1em;
	margin: 0;
	padding: 0.6em 0.9em;
	background: #f4f5f6;
	border-bottom: 1px solid #e2e5e8;
}

/* Bar 1: view toggle (segmented) */
.elmur-ds-dlf__views {
	gap: 0;
	justify-content: center;
	text-align: center;
}

.elmur-ds-dlf__viewbtn {
	width: 10rem;
	padding: 0.45em 0;
	text-align: center;
	font-size: 0.9em;
	font-weight: 600;
	text-decoration: none;
	color: var( --ds-color-text, #1d2327 );
	background: #fff;
	border: 1px solid #d6d9dc;
	border-radius: 4px;
}

.elmur-ds-dlf__viewbtn:last-child {
	margin-left: 1rem;
}

.elmur-ds-dlf__viewbtn.is-active {
	background: var( --ds-color-accent, #cc0000 );
	border-color: var( --ds-color-accent, #cc0000 );
	color: #fff;
}

/* Bar 2: filters */
.elmur-ds-dlf__select {
	flex: 1 1 12rem;
	max-width: 100%;
	padding: 0.5em 0.7em;
	border: 1px solid var( --ds-input-border, #ccc );
	border-radius: 4px;
	background: #fff;
	font-family: inherit;
	font-size: 0.95em;
	color: var( --ds-color-text, #1d2327 );
	box-sizing: border-box;
}

/* Bar 3: legend */
.elmur-ds-dlf__legend {
	justify-content: center;
	align-items: center;
	flex-wrap: nowrap;
	gap: 2rem;
	padding: 0.55em 0.4em;
	font-size: 0.7em;
	line-height: 1;
	color: #555;
}

.elmur-ds-dlf__legend-item {
	display: inline-flex;
	align-items: center;
	gap: 0.35em;
	white-space: nowrap;
}

/* All legend markers share one box height so the row reads evenly */
.elmur-ds-dlf__legend-sw,
.elmur-ds-dlf__legend-num,
.elmur-ds-dlf__legend-dbl {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	height: 1.4em;
	border: 1px solid transparent;
	border-radius: 3px;
	line-height: 1;
}

.elmur-ds-dlf__legend-sw {
	width: 1.4em;
}

.elmur-ds-dlf__legend-num,
.elmur-ds-dlf__legend-dbl {
	min-width: 1.4em;
	padding: 0 0.25em;
	font-weight: 700;
}

.elmur-ds-dlf__legend-sw--free {
	background: #eaf6ec;
	border-color: #2e7d32;
}

.elmur-ds-dlf__legend-sw--off {
	background: #eceef0;
	border-color: #c9cdd1;
}

.elmur-ds-dlf__legend-num {
	color: #2e7d32;
	background: #eaf6ec;
	border-color: #2e7d32;
}

.elmur-ds-dlf__legend-dbl {
	color: #1a5e20;
	background: #fff;
	border-color: #2e7d32;
}

/* Coloured month header — the calendar starts here */
.elmur-ds-dlf__monthbar {
	display: flex;
	align-items: center;
	gap: 0.5em;
	padding: 0.55em 0.8em;
	background: var( --ds-color-accent, #cc0000 );
	color: #fff;
}

.elmur-ds-dlf__cal-title {
	flex: 1;
	text-align: center;
	font-weight: 700;
	font-size: 1.02em;
}

.elmur-ds-dlf__nav {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.9em;
	height: 1.9em;
	border-radius: 4px;
	font-size: 1.15em;
	line-height: 1;
	text-decoration: none;
	color: #fff;
	border: 1px solid rgba( 255, 255, 255, 0.6 );
	background: transparent;
}

.elmur-ds-dlf__nav:hover,
.elmur-ds-dlf__nav:focus {
	background: rgba( 255, 255, 255, 0.18 );
	border-color: #fff;
	color: #fff;
}

.elmur-ds-dlf__nav.is-disabled {
	opacity: 0.4;
	pointer-events: none;
}

/* Calendar body (white) */
.elmur-ds-dlf__calbody {
	padding: 0.7em 0.8em 0.9em;
	background: #fff;
}

/* Coloured weekday header strip */
.elmur-ds-dlf__wdrow {
	display: grid;
	grid-template-columns: repeat( 7, 1fr );
	margin-bottom: 0.45em;
	background: #fbeaea;
	border-radius: 4px;
}

.elmur-ds-dlf__wd {
	text-align: center;
	padding: 0.45em 0;
	font-size: 0.72em;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var( --ds-color-accent, #cc0000 );
}

.elmur-ds-dlf__grid {
	display: grid;
	grid-template-columns: repeat( 7, 1fr );
	gap: 0.3em;
}

.elmur-ds-dlf__cell {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 2.9rem;
	padding: 0.15em;
	border-radius: 6px;
	line-height: 1.05;
	text-decoration: none;
}

.elmur-ds-dlf__cell-day {
	font-size: 0.9em;
}

/* Corner badges (free-time count top-left, double-lesson top-right) */
.elmur-ds-dlf__cell-count,
.elmur-ds-dlf__cell-dbl {
	position: absolute;
	top: 0.15em;
	padding: 0 0.2em;
	border: 1px solid #2e7d32;
	border-radius: 3px;
	background: #fff;
	color: #1a5e20;
	font-size: 0.55em;
	font-weight: 700;
	line-height: 1.35;
}

.elmur-ds-dlf__cell-count {
	left: 0.2em;
}

.elmur-ds-dlf__cell-dbl {
	right: 0.2em;
}

.elmur-ds-dlf__cell--empty {
	visibility: hidden;
}

.elmur-ds-dlf__cell--off {
	color: #c2c6ca;
	background: #f5f6f7;
}

.elmur-ds-dlf__cell--free {
	color: #1a5e20;
	background: #eaf6ec;
	border: 1px solid #2e7d32;
	font-weight: 700;
	transition: background 0.15s, color 0.15s;
}

.elmur-ds-dlf__cell--free .elmur-ds-dlf__cell-count {
	color: #2e7d32;
}

.elmur-ds-dlf__cell--free:hover,
.elmur-ds-dlf__cell--free:focus,
.elmur-ds-dlf__cell--free.is-selected {
	background: #2e7d32;
	color: #fff;
}

.elmur-ds-dlf__cell--free:hover .elmur-ds-dlf__cell-count,
.elmur-ds-dlf__cell--free:focus .elmur-ds-dlf__cell-count,
.elmur-ds-dlf__cell--free.is-selected .elmur-ds-dlf__cell-count {
	color: #dff3e3;
}

.elmur-ds-dlf__cell.is-today {
	outline: 2px solid var( --ds-color-accent, #cc0000 );
	outline-offset: -2px;
}

/* Slot panel (below the calendar, inside the card) */
.elmur-ds-dlf__panel {
	padding: 0.8em 0.9em;
	border-top: 1px solid #ececec;
	background: #fafbfb;
}

.elmur-ds-dlf__panel-hint {
	margin: 0;
	color: #666;
	font-size: 0.92em;
}

.elmur-ds-dlf__panel-title {
	margin: 0 0 0.5em;
	font-size: 1em;
}

.elmur-ds-dlf__times {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4em;
}

.elmur-ds-dlf__slot {
	display: inline-block;
	padding: 0.35em 0.7em;
	border: 1px solid #2e7d32;
	border-radius: 4px;
	color: #1a5e20;
	background: #eaf6ec;
	font-size: 0.9em;
	text-decoration: none;
	transition: background 0.15s, color 0.15s;
}

.elmur-ds-dlf__slot:hover,
.elmur-ds-dlf__slot:focus {
	background: #2e7d32;
	color: #fff;
}

/* List body */
.elmur-ds-dlf__calbody--list {
	padding: 0;
}

.elmur-ds-dlf__row {
	padding: 0.7em 0.9em;
	border-bottom: 1px solid #ececec;
}

.elmur-ds-dlf__row:last-child {
	border-bottom: none;
}

.elmur-ds-dlf__day {
	margin-bottom: 0.45em;
	font-weight: 700;
}

.elmur-ds-dlf__empty {
	margin: 0;
	padding: 1em 0.9em;
	color: #666;
}

/* List: "show more" expander (CSS-only, stays in place) */
.elmur-ds-dlf__more-toggle {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
	pointer-events: none;
}

.elmur-ds-dlf__more {
	position: relative;
	display: block;
	padding: 0.7em 0.7em 1.3em;
	text-align: center;
	font-weight: 600;
	color: var( --ds-color-accent, #cc0000 );
	background: #f4f5f6;
	border-top: 1px solid #ececec;
	cursor: pointer;
}

.elmur-ds-dlf__more::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0.45em;
	transform: translateX( -50% );
	border-left: 0.4em solid transparent;
	border-right: 0.4em solid transparent;
	border-top: 0.4em solid currentColor;
}

.elmur-ds-dlf__more-wrap {
	display: none;
}

.elmur-ds-dlf__more-toggle:checked ~ .elmur-ds-dlf__more-wrap {
	display: block;
}

.elmur-ds-dlf__more-toggle:checked ~ .elmur-ds-dlf__more {
	display: none;
}

/* Buttons + links (confirm / cancel steps) */
.elmur-ds-dlf__submit {
	display: inline-block;
	padding: 0.55em 1.4em;
	background: var( --ds-color-accent, #cc0000 );
	color: #fff;
	border: none;
	border-radius: 4px;
	font-family: inherit;
	font-size: 1em;
	font-weight: 600;
	cursor: pointer;
	transition: opacity 0.15s;
}

.elmur-ds-dlf__submit:hover,
.elmur-ds-dlf__submit:focus {
	opacity: 0.85;
	color: #fff;
}

.elmur-ds-dlf__submit--danger {
	background: #d63638;
}

.elmur-ds-dlf__link {
	font-size: 0.95em;
	color: var( --ds-color-muted, #666 );
}

/* Confirm + cancel */
.elmur-ds-dlf__title {
	margin-top: 0;
}

.elmur-ds-dlf__summary {
	list-style: none;
	margin: 0 0 1.2em;
	padding: 0.75em 1em;
	background: var( --ds-input-bg, #f7f7f7 );
	border: 1px solid var( --ds-input-border, #e0e0e0 );
	border-radius: 6px;
	max-width: 30rem;
}

.elmur-ds-dlf__summary li + li {
	margin-top: 0.35em;
}

.elmur-ds-dlf__form {
	display: flex;
	flex-direction: column;
	gap: 1em;
	max-width: 30rem;
}

.elmur-ds-dlf__field {
	display: flex;
	flex-direction: column;
	gap: 0.35em;
}

.elmur-ds-dlf__field label {
	font-size: 0.9em;
	font-weight: 600;
}

.elmur-ds-dlf__field input {
	padding: 0.5em 0.7em;
	border: 1px solid var( --ds-input-border, #ccc );
	border-radius: 4px;
	font-family: inherit;
	font-size: 1em;
	background: var( --ds-input-bg, #fff );
	color: var( --ds-color-text, #1d2327 );
	box-sizing: border-box;
}

.elmur-ds-dlf__check {
	display: flex;
	align-items: flex-start;
	gap: 0.5em;
	font-size: 0.9em;
	line-height: 1.5;
	cursor: pointer;
}

.elmur-ds-dlf__check input[type="checkbox"] {
	margin-top: 0.2em;
	flex-shrink: 0;
}

.elmur-ds-dlf__check a {
	color: inherit;
	text-decoration: underline;
}

.elmur-ds-dlf__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1em;
	margin-top: 0.5em;
}

@media ( max-width: 34rem ) {
	.elmur-ds-dlf__widget,
	.elmur-ds-dlf__widget--list {
		max-width: 100%;
	}

	.elmur-ds-dlf__select {
		flex-basis: 100%;
	}
}

/* My lessons (logged-in student overview) */
.elmur-ds-mylessons {
	max-width: 46rem;
}

.elmur-ds-mylessons__list {
	list-style: none;
	margin: 0;
	padding: 0;
	border: 1px solid var( --ds-input-border, #e0e0e0 );
	border-radius: 6px;
	overflow: hidden;
}

.elmur-ds-mylessons__item {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.75em 1em;
	padding: 0.85em 1em;
	border-top: 1px solid #ececec;
}

.elmur-ds-mylessons__item:first-child {
	border-top: none;
}

.elmur-ds-mylessons__info {
	display: flex;
	flex-direction: column;
	gap: 0.15em;
	min-width: 14rem;
}

.elmur-ds-mylessons__when {
	font-weight: 700;
}

.elmur-ds-mylessons__meta {
	font-size: 0.85em;
	color: var( --ds-color-muted, #666 );
}

.elmur-ds-mylessons__btn {
	padding: 0.45em 1.1em;
	border: 1px solid #d6a0a0;
	border-radius: 4px;
	background: #fff;
	color: #8a1f1f;
	font-family: inherit;
	font-size: 0.95em;
	font-weight: 600;
	cursor: pointer;
}

.elmur-ds-mylessons__locked {
	font-size: 0.9em;
	color: var( --ds-color-muted, #888 );
}

.elmur-ds-mylessons__empty {
	color: var( --ds-color-muted, #666 );
}