/**
 * Add tuition class / tuition requirement
 * Reuses tm-register-page, tm-register-card, tm-classes-hero kicker (site-chrome.css).
 */

.tm-add-class-page.tm-register-page,
.tm-add-tuition-needed-page.tm-register-page {
	padding-bottom: 3rem;
}

/* Width matches Student/Teacher profile — .tm-teacher-profile-view__inner (1120px) on the inner wrapper */

.tm-add-class-page__hero,
.tm-add-tuition-needed-page__hero {
	margin-bottom: 1.35rem;
}

.tm-add-class-page__hero h1,
.tm-add-tuition-needed-page__hero h1 {
	font-family: "DM Sans", system-ui, sans-serif;
	font-size: clamp(1.65rem, 3.5vw, 2.1rem);
	font-weight: 700;
	letter-spacing: -0.02em;
	margin: 0 0 0.4rem;
	line-height: 1.15;
	color: var(--tm-c-text);
}

.tm-add-class-card .tm-register-card__body,
.tm-add-tuition-needed-card .tm-register-card__body {
	overflow-x: auto;
}

.tm-add-class-page__body .tm-add-class-form-table,
.tm-add-tuition-needed-page__body .tm-add-tuition-needed-form-table {
	width: 100%;
	max-width: 100%;
	border-collapse: collapse;
}

.tm-add-class-page__body .tm-add-class-form-table > tbody > tr > td,
.tm-add-tuition-needed-page__body .tm-add-tuition-needed-form-table > tbody > tr > td {
	padding: 0.4rem 0.35rem 0.4rem 0;
	vertical-align: top;
	font-size: 0.9rem;
	color: var(--tm-c-text);
}

.tm-add-class-page__body .tm-add-class-form-table > tbody > tr > td:first-child,
.tm-add-tuition-needed-page__body .tm-add-tuition-needed-form-table > tbody > tr > td:first-child {
	width: 11rem;
	max-width: 42%;
	font-weight: 600;
	color: var(--tm-c-muted);
	padding-right: 0.75rem;
}

@media (max-width: 640px) {
	.tm-add-class-page__body .tm-add-class-form-table > tbody > tr > td:first-child,
	.tm-add-tuition-needed-page__body .tm-add-tuition-needed-form-table > tbody > tr > td:first-child {
		width: auto;
		max-width: none;
	}
}

.tm-add-class-page__body .large_header,
.tm-add-tuition-needed-page__body .large_header {
	font-size: 1.02rem;
	font-weight: 700;
	color: var(--tm-c-text);
	padding-top: 0.65rem;
}

.tm-add-class-page__body hr.devider,
.tm-add-tuition-needed-page__body hr.devider {
	border: none;
	border-top: 1px dashed var(--tm-c-border);
	margin: 0.15rem 0 0.5rem;
	width: 100%;
}

/* Higher specificity than Envision.css (.styled-select select / select) loaded later from top.php */
.tm-add-class-page__body .tm-add-class-form-table select,
.tm-add-class-page__body .tm-add-class-form-table .styled-select select,
.tm-add-class-page__body input[type="text"]:not([disabled]),
.tm-add-class-page__body input[type="text"][disabled],
.tm-add-class-page__body textarea,
.tm-add-tuition-needed-page__body .tm-add-tuition-needed-form-table select,
.tm-add-tuition-needed-page__body .tm-add-tuition-needed-form-table .styled-select select,
.tm-add-tuition-needed-page__body input[type="text"]:not([disabled]),
.tm-add-tuition-needed-page__body input[type="text"][disabled],
.tm-add-tuition-needed-page__body textarea {
	font-family: inherit;
	font-size: 0.9rem;
	border-radius: 8px;
	border: 1px solid var(--tm-c-border);
	padding: 0.45rem 0.55rem;
	background: #fff;
	color: var(--tm-c-text);
	box-sizing: border-box;
	max-width: 100%;
	/* Envision sets select { height: 23px } — too small with padding; clips visible label text */
	min-height: 2.5rem;
	height: auto !important;
	line-height: 1.35;
	-webkit-appearance: menulist;
	-moz-appearance: menulist;
	appearance: auto;
}

.tm-add-class-page__body .tm-add-class-form-table select option,
.tm-add-class-page__body .tm-add-class-form-table select optgroup,
.tm-add-tuition-needed-page__body .tm-add-tuition-needed-form-table select option,
.tm-add-tuition-needed-page__body .tm-add-tuition-needed-form-table select optgroup {
	color: #0f172a;
	background-color: #fff;
}

.tm-add-class-page__body .tm-add-class-form-table select:focus,
.tm-add-class-page__body input[type="text"]:focus,
.tm-add-class-page__body textarea:focus,
.tm-add-tuition-needed-page__body .tm-add-tuition-needed-form-table select:focus,
.tm-add-tuition-needed-page__body input[type="text"]:focus,
.tm-add-tuition-needed-page__body textarea:focus {
	outline: 2px solid rgba(20, 184, 166, 0.35);
	outline-offset: 1px;
	border-color: var(--tm-c-accent);
}

.tm-add-class-page__body textarea,
.tm-add-tuition-needed-page__body textarea {
	min-height: 6rem;
	width: 100%;
	max-width: 52rem;
}

.tm-add-class-page__body .styled-select,
.tm-add-tuition-needed-page__body .styled-select {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.35rem 0.5rem;
}

.tm-add-class-page__body #add_class_schedule_mount {
	overflow-x: auto;
}

.tm-add-class-page__body #add_class_schedule_mount > table {
	width: 100%;
	min-width: 280px;
}

.tm-add-class-page__body #add_class_schedule_mount th {
	text-align: left;
	font-size: 0.78rem;
	font-weight: 700;
	color: var(--tm-c-muted);
	padding: 0.35rem 0.5rem;
	border-bottom: 1px solid var(--tm-c-border);
	background: var(--tm-c-surface2);
}

.tm-add-class-page__body #add_class_schedule_mount td {
	padding: 0.35rem 0.45rem;
	vertical-align: middle;
}

.tm-add-class-page__body #captchaImage img {
	max-width: 100%;
	height: auto;
	border-radius: 8px;
	border: 1px solid var(--tm-c-border);
}

.tm-add-class-page__actions,
.tm-add-tuition-needed-page__actions {
	margin-top: 1.25rem;
	padding-top: 1rem;
	border-top: 1px solid var(--tm-c-border);
}

.tm-add-class-page .tm-add-class-save,
.tm-add-class-page input.tm-add-class-save.button,
.tm-add-tuition-needed-page .tm-add-class-save,
.tm-add-tuition-needed-page input.tm-add-class-save.button {
	min-height: 44px;
	padding: 0.55rem 1.85rem;
	border: none !important;
	border-radius: 999px;
	font-family: inherit;
	font-size: 0.92rem;
	font-weight: 700;
	cursor: pointer;
	background: linear-gradient(135deg, var(--tm-c-accent), #0d9488) !important;
	color: #fff !important;
	box-shadow: 0 8px 24px rgba(20, 184, 166, 0.28);
}

.tm-add-class-page .tm-add-class-save:hover,
.tm-add-tuition-needed-page .tm-add-class-save:hover {
	box-shadow: 0 10px 28px rgba(20, 184, 166, 0.38);
}

.tm-add-tuition-needed-page .tm-add-tuition-needed-reset,
.tm-add-tuition-needed-page input.tm-add-tuition-needed-reset.button {
	min-height: 44px;
	padding: 0.55rem 1.3rem;
	border: 1px solid var(--tm-c-border) !important;
	border-radius: 999px;
	font-family: inherit;
	font-size: 0.92rem;
	font-weight: 700;
	cursor: pointer;
	background: var(--tm-c-surface2) !important;
	color: var(--tm-c-text) !important;
}

.tm-add-tuition-needed-page .tm-add-tuition-needed-reset:hover {
	background: #e2e8f0 !important;
}

.tm-add-class-page .tm-register-alert img {
	max-width: min(420px, 100%);
	height: auto;
	margin-top: 0.75rem;
	border-radius: 8px;
	border: 1px solid var(--tm-c-border);
}

.tm-add-tuition-needed-page__body #translControl {
	margin-top: 0.55rem;
}