/* Teacher schedule payment reminder — SSOT 8·11. */
.payment-reminder {
	position: fixed;
	inset-block-end: calc(var(--wa-space-l) + 3.5rem);
	inset-inline-end: var(--wa-space-l);
	z-index: 40;
	box-sizing: border-box;
	inline-size: min(25rem, calc(100vw - 2 * var(--wa-space-l)));
	max-block-size: calc(100dvh - 2 * var(--wa-space-l) - 3.5rem);
	overflow-y: auto;
	display: grid;
	gap: var(--wa-space-m);
	padding: var(--wa-space-l);
	border: var(--wa-border-width-s) solid var(--wa-color-brand-border-normal);
	border-radius: var(--wa-border-radius-l);
	background: var(--wa-color-surface-raised);
	color: var(--wa-color-text-normal);
	box-shadow: var(--wa-shadow-l);
}
.payment-reminder h2 {
	margin: 0;
	padding-inline-end: var(--wa-space-xl);
	font-size: var(--wa-font-size-m);
	line-height: var(--wa-line-height-normal);
	overflow-wrap: anywhere;
}
.payment-reminder-close {
	position: absolute;
	inset-block-start: var(--wa-space-xs);
	inset-inline-end: var(--wa-space-xs);
	min-inline-size: 2.5rem;
	min-block-size: 2.5rem;
	border: 0;
	background: transparent;
	color: var(--wa-color-text-normal);
	cursor: pointer;
}
.payment-reminder-close:focus-visible {
	outline: var(--wa-focus-ring);
	outline-offset: var(--wa-focus-ring-offset);
}
.payment-reminder .sonub-button { text-align: center; white-space: normal; }
.payment-reminder > .link-button { justify-self: end; white-space: normal; }
.pending-payments-dialog { --width: 52rem; }
.pending-payments-timezone {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--wa-space-xs);
	margin-block: 0 var(--wa-space-m);
	color: var(--wa-color-text-quiet);
	font-size: var(--wa-font-size-s);
}
.pending-payments-list { display: grid; gap: var(--wa-space-s); list-style: none; padding: 0; margin: 0; }
.pending-payment-row {
	display: grid;
	grid-template-columns: minmax(8rem, 1fr) minmax(11rem, 1.4fr) auto;
	align-items: center;
	gap: var(--wa-space-m);
	margin: 0;
	padding: var(--wa-space-m);
	border: var(--wa-border-width-s) solid var(--wa-color-surface-border);
	border-radius: var(--wa-border-radius-m);
	background: var(--wa-color-surface-raised);
	overflow-wrap: anywhere;
	line-height: var(--wa-line-height-normal);
}
.pending-payment-row :is(.pending-payment-teacher, .pending-payment-schedule, .pending-payment-teacher > div) { min-inline-size: 0; }
.pending-payment-teacher { display: flex; align-items: center; gap: var(--wa-space-s); }
.pending-payment-teacher .teacher-avatar {
	flex: 0 0 2.75rem;
	inline-size: 2.75rem;
	block-size: 2.75rem;
	font-size: var(--wa-font-size-l);
}
.pending-payment-teacher > div, .pending-payment-schedule { display: grid; gap: var(--wa-space-2xs); }
.pending-payment-reference, .pending-payment-learner { color: var(--wa-color-text-quiet); font-size: var(--wa-font-size-s); }
.pending-payment-learner { display: flex; flex-wrap: wrap; align-items: center; gap: var(--wa-space-xs); }
.pending-payment-schedule time { font-size: var(--wa-font-size-s); }
.pending-payment-payment { display: grid; justify-items: end; gap: var(--wa-space-xs); }
.pending-payment-amount { color: var(--wa-color-brand-on-quiet); font-size: var(--wa-font-size-m); font-variant-numeric: tabular-nums; }
.pending-payments-actions { display: flex; flex-wrap: wrap; justify-content: end; gap: var(--wa-space-xs); }
.pending-payments-actions .sonub-button { gap: var(--wa-space-xs); padding: var(--wa-space-xs) var(--wa-space-s); min-block-size: 2.5rem; font-size: var(--wa-font-size-s); white-space: normal; text-align: center; }
@media (max-width: 700px) {
	.pending-payments-dialog::part(body) { padding: var(--wa-space-m); }
	.pending-payment-row { grid-template-columns: minmax(0, 1fr); gap: var(--wa-space-xs); padding: var(--wa-space-s); }
	.pending-payment-payment { grid-template-columns: minmax(0, 1fr) auto; align-items: center; justify-items: stretch; }
	.pending-payment-amount { justify-self: start; }
	.pending-payments-actions { max-inline-size: 10rem; }
}