/* ==========================================================================
   TradeSchool Manager  -  Student Portal styles
   Social-media-style profile with tabs. Scoped to .tsm-portal-wrap.
   ========================================================================== */

.tsm-portal-wrap {
	--tsm-primary: #1f6feb;
	--tsm-primary-600: #1758c4;
	--tsm-primary-contrast: #ffffff;
	--tsm-bg: #f5f7fb;
	--tsm-card: #ffffff;
	--tsm-text: #1f2937;
	--tsm-muted: #6b7280;
	--tsm-border: #e5e7eb;
	--tsm-radius: 14px;
	--tsm-shadow: 0 1px 3px rgba(15, 23, 42, .06), 0 8px 24px rgba(15, 23, 42, .06);
	--tsm-cover: linear-gradient(135deg, #1f6feb 0%, #6ea8ff 60%, #9bd3ff 100%);

	max-width: 1080px;
	margin: 24px auto;
	padding: 0 16px;
	color: var(--tsm-text);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	line-height: 1.5;
}

/* ---- Cards ---- */
.tsm-portal-wrap .tsm-card {
	background: var(--tsm-card);
	border: 1px solid var(--tsm-border);
	border-radius: var(--tsm-radius);
	box-shadow: var(--tsm-shadow);
	overflow: hidden;
}
.tsm-portal-wrap .tsm-card--pad { padding: 22px; }
.tsm-portal-wrap .tsm-card + .tsm-card { margin-top: 18px; }

.tsm-portal-wrap .tsm-h3 { margin: 0 0 14px; font-size: 18px; font-weight: 700; color: var(--tsm-text); }

/* ---- Profile card (cover + identity) ---- */
.tsm-portal-wrap .tsm-profile-card {
	background: var(--tsm-card);
	border: 1px solid var(--tsm-border);
	border-radius: var(--tsm-radius);
	box-shadow: var(--tsm-shadow);
	overflow: hidden;
	margin-bottom: 18px;
}
.tsm-portal-wrap .tsm-cover { height: 160px; background: var(--tsm-cover); }
@media (min-width: 720px) { .tsm-portal-wrap .tsm-cover { height: 200px; } }

.tsm-portal-wrap .tsm-profile-body {
	display: grid;
	grid-template-columns: auto 1fr auto;
	grid-template-areas: "avatar identity actions";
	column-gap: 24px;
	row-gap: 12px;
	align-items: end;
	padding: 16px 24px 20px;
	margin-top: -64px;
}
.tsm-portal-wrap .tsm-avatar-wrap { grid-area: avatar; align-self: end; }
.tsm-portal-wrap .tsm-identity { grid-area: identity; align-self: end; padding-bottom: 4px; min-width: 0; }
.tsm-portal-wrap .tsm-profile-actions { grid-area: actions; align-self: end; padding-bottom: 4px; }
@media (max-width: 720px) {
	.tsm-portal-wrap .tsm-profile-body { grid-template-columns: 1fr; grid-template-areas: "avatar" "identity" "actions"; text-align: center; padding: 12px 20px 18px; }
	.tsm-portal-wrap .tsm-identity { padding-bottom: 0; }
}

/* ---- Avatar ---- */
.tsm-portal-wrap .tsm-avatar-wrap { position: relative; width: 120px; height: 120px; }
@media (max-width: 640px) { .tsm-portal-wrap .tsm-avatar-wrap { margin: 0 auto; } }
.tsm-portal-wrap .tsm-avatar {
	width: 120px; height: 120px;
	border-radius: 50%;
	object-fit: cover;
	border: 4px solid var(--tsm-card);
	background: #e5e7eb;
	box-shadow: 0 4px 14px rgba(0,0,0,.12);
	display: flex; align-items: center; justify-content: center;
	font-size: 38px; font-weight: 700; color: #fff;
}
.tsm-portal-wrap .tsm-avatar--initials { background: linear-gradient(135deg, var(--tsm-primary), #6ea8ff); }
.tsm-portal-wrap .tsm-avatar-edit { position: absolute; bottom: 4px; right: 4px; }
.tsm-portal-wrap .tsm-avatar-edit-btn {
	display: inline-flex; align-items: center; justify-content: center;
	width: 34px; height: 34px;
	background: var(--tsm-primary); color: #fff;
	border-radius: 50%; cursor: pointer;
	box-shadow: 0 2px 8px rgba(0,0,0,.2);
	border: 2px solid #fff;
}
.tsm-portal-wrap .tsm-avatar-edit-btn:hover { background: var(--tsm-primary-600); }
.tsm-portal-wrap .tsm-avatar-edit-btn input[type="file"] { display: none; }

/* ---- Identity ---- */
.tsm-portal-wrap .tsm-name { margin: 0 0 6px; font-size: 26px; font-weight: 800; line-height: 1.2; color: var(--tsm-text); }
.tsm-portal-wrap .tsm-tagline { margin: 0; color: var(--tsm-muted); font-size: 14px; display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.tsm-portal-wrap .tsm-tagline-school { font-weight: 600; color: var(--tsm-text); }
.tsm-portal-wrap .tsm-tagline-sep { color: var(--tsm-border); }
.tsm-portal-wrap .tsm-chip {
	display: inline-block; padding: 2px 10px; border-radius: 999px;
	background: #e8f1ff; color: var(--tsm-primary-600); font-size: 12px; font-weight: 600;
}
.tsm-portal-wrap .tsm-chip--inactive { background: #fee; color: #b91c1c; }

.tsm-portal-wrap .tsm-profile-actions { display: flex; gap: 8px; flex-wrap: wrap; }
@media (max-width: 640px) { .tsm-portal-wrap .tsm-profile-actions { justify-content: center; } }

/* ---- Buttons ---- */
.tsm-portal-wrap .tsm-btn {
	display: inline-flex; align-items: center; justify-content: center;
	padding: 9px 16px;
	font-size: 14px; font-weight: 600;
	border-radius: 10px; border: 1px solid transparent;
	text-decoration: none; cursor: pointer; transition: background .15s, border-color .15s;
	background: #f3f4f6; color: var(--tsm-text);
}
.tsm-portal-wrap .tsm-btn:hover { background: #e5e7eb; }
.tsm-portal-wrap .tsm-btn--primary { background: var(--tsm-primary); color: #fff; }
.tsm-portal-wrap .tsm-btn--primary:hover { background: var(--tsm-primary-600); color: #fff; }
.tsm-portal-wrap .tsm-btn--ghost { background: transparent; border-color: var(--tsm-border); }
.tsm-portal-wrap .tsm-btn--block { width: 100%; }

/* ---- Stats strip ---- */
.tsm-portal-wrap .tsm-stats {
	display: flex;
	flex-wrap: wrap;
	gap: 0;
	border-top: 1px solid var(--tsm-border);
	background: #fafbfc;
}
.tsm-portal-wrap .tsm-stat {
	flex: 1 1 0;
	min-width: 120px;
	padding: 14px 12px;
	text-align: center;
	border-right: 1px solid var(--tsm-border);
}
.tsm-portal-wrap .tsm-stat:last-child { border-right: 0; }
@media (max-width: 720px) {
	.tsm-portal-wrap .tsm-stat { flex: 1 1 50%; border-bottom: 1px solid var(--tsm-border); }
	.tsm-portal-wrap .tsm-stat:nth-child(2n) { border-right: 0; }
}
.tsm-portal-wrap .tsm-stat-num { display: block; font-size: 20px; font-weight: 800; color: var(--tsm-text); }
.tsm-portal-wrap .tsm-stat-lbl { display: block; font-size: 12px; color: var(--tsm-muted); text-transform: uppercase; letter-spacing: .04em; margin-top: 2px; }

/* ---- Tabs ---- */
.tsm-portal-wrap .tsm-tabs {
	display: flex;
	gap: 4px;
	background: var(--tsm-card);
	border: 1px solid var(--tsm-border);
	border-radius: var(--tsm-radius);
	padding: 6px;
	margin-bottom: 18px;
	overflow-x: auto;
	box-shadow: var(--tsm-shadow);
}
.tsm-portal-wrap .tsm-tab {
	padding: 9px 16px;
	border: 0; background: transparent;
	font-size: 14px; font-weight: 600;
	color: var(--tsm-muted); cursor: pointer;
	border-radius: 10px; white-space: nowrap;
	transition: background .15s, color .15s;
}
.tsm-portal-wrap .tsm-tab:hover { background: #f3f4f6; color: var(--tsm-text); }
.tsm-portal-wrap .tsm-tab.is-active { background: var(--tsm-primary); color: #fff; }

.tsm-portal-wrap .tsm-tabpanel { display: none; }
.tsm-portal-wrap .tsm-tabpanel.is-active { display: block; }

.tsm-portal-wrap .tsm-subtab {
	padding: 7px 14px; border: 0; background: transparent;
	font-size: 13px; font-weight: 600; color: var(--tsm-muted);
	cursor: pointer; border-radius: 8px; white-space: nowrap;
	min-height: 38px; min-width: max-content;
	transition: background .15s, color .15s;
}
.tsm-portal-wrap .tsm-subtab:hover { background: #f3f4f6; color: var(--tsm-text); }
.tsm-portal-wrap .tsm-subtab.is-active {
	background-color: var(--tsm-primary);
	color: var(--tsm-primary-contrast) !important;
	text-decoration-color: var(--tsm-primary-contrast);
}
.tsm-portal-wrap .tsm-subtab.is-active * {
	color: var(--tsm-primary-contrast) !important;
	text-decoration-color: var(--tsm-primary-contrast);
}
.tsm-portal-wrap .tsm-subtab-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.65em;
	margin-left: 6px;
	padding: 1px 6px;
	border-radius: 999px;
	background: rgba(15, 23, 42, .08);
	color: inherit;
}
.tsm-portal-wrap .tsm-subtab.is-active .tsm-subtab-count {
	background: rgba(255, 255, 255, .22);
	color: var(--tsm-primary-contrast) !important;
}
.tsm-portal-wrap .tsm-subpanel { display: none; }
.tsm-portal-wrap .tsm-subpanel.is-active { display: block; }

/* ---- Layout ---- */
.tsm-portal-wrap .tsm-grid-2 {
	display: grid; gap: 18px;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

/* ---- Description list ---- */
.tsm-portal-wrap .tsm-dl { margin: 0; display: grid; grid-template-columns: 130px 1fr; gap: 8px 14px; }
.tsm-portal-wrap .tsm-dl dt { color: var(--tsm-muted); font-size: 13px; }
.tsm-portal-wrap .tsm-dl dd { margin: 0; font-size: 14px; }

/* ---- Tables ---- */
.tsm-portal-wrap .tsm-table {
	width: 100%; border-collapse: collapse; font-size: 14px;
}
.tsm-portal-wrap .tsm-table th, .tsm-portal-wrap .tsm-table td {
	padding: 10px 12px; text-align: left;
	border-bottom: 1px solid var(--tsm-border);
}
.tsm-portal-wrap .tsm-table th {
	background: #fafbfc; color: var(--tsm-muted);
	font-size: 12px; text-transform: uppercase; letter-spacing: .04em;
}
.tsm-portal-wrap .tsm-table tr:last-child td { border-bottom: 0; }
.tsm-portal-wrap .tsm-student-assignment-table.is-enhanced .tsm-assignment-detail-row[hidden] { display: none; }
.tsm-portal-wrap .tsm-assignment-summary-row {
	cursor: pointer;
	transition: background-color .15s;
}
.tsm-portal-wrap .tsm-assignment-summary-row:hover,
.tsm-portal-wrap .tsm-assignment-summary-row.is-expanded {
	background: #f8fbff;
}
.tsm-portal-wrap .tsm-assignment-toggle {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	-webkit-appearance: none;
	appearance: none;
	border: 0 !important;
	background: transparent !important;
	background-image: none !important;
	box-shadow: none !important;
	color: var(--tsm-text) !important;
	font: inherit;
	font-weight: 700;
	text-align: left;
	padding: 0 !important;
	cursor: pointer;
	text-decoration: none !important;
}
.tsm-portal-wrap .tsm-assignment-toggle:focus-visible {
	outline: 2px solid var(--tsm-primary);
	outline-offset: 3px;
	border-radius: 6px;
}
.tsm-portal-wrap .tsm-assignment-title { min-width: 0; }
.tsm-portal-wrap .tsm-assignment-chevron {
	width: 8px;
	height: 8px;
	flex: 0 0 auto;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(-45deg);
	transition: transform .15s ease;
	opacity: .75;
}
.tsm-portal-wrap .tsm-assignment-toggle[aria-expanded="true"] .tsm-assignment-chevron {
	transform: rotate(45deg);
}
.tsm-portal-wrap .tsm-assignment-detail-row td {
	background: #f8fbff;
}
.tsm-portal-wrap .tsm-assignment-detail {
	border-left: 3px solid var(--tsm-primary);
	padding: 12px 14px;
	background: #fff;
	border-radius: 8px;
	color: var(--tsm-text);
}
.tsm-portal-wrap .tsm-assignment-detail strong {
	display: block;
	margin-bottom: 6px;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--tsm-muted);
}
.tsm-portal-wrap .tsm-assignment-description p,
.tsm-portal-wrap .tsm-assignment-detail .tsm-muted {
	margin: 0 0 8px;
}
.tsm-portal-wrap .tsm-assignment-description p:last-child,
.tsm-portal-wrap .tsm-assignment-detail .tsm-muted:last-child {
	margin-bottom: 0;
}

/* ---- Class tiles ---- */
.tsm-portal-wrap .tsm-class-list { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.tsm-portal-wrap .tsm-class-tile {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	padding: 14px 16px;
	border: 1px solid var(--tsm-border); border-radius: 12px;
	background: #fff;
	transition: border-color .15s, box-shadow .15s;
}
.tsm-portal-wrap .tsm-class-tile:hover { border-color: var(--tsm-primary); box-shadow: 0 4px 14px rgba(31,111,235,.1); }
.tsm-portal-wrap .tsm-class-name { margin: 0 0 4px; font-size: 15px; font-weight: 700; }
.tsm-portal-wrap .tsm-class-grade { text-align: right; }
.tsm-portal-wrap .tsm-class-letter { font-size: 22px; font-weight: 800; color: var(--tsm-primary); line-height: 1; }
.tsm-portal-wrap .tsm-class-pct { font-size: 12px; color: var(--tsm-muted); }

/* ---- Feed ---- */
.tsm-portal-wrap .tsm-feed { list-style: none; padding: 0; margin: 0; }
.tsm-portal-wrap .tsm-feed li {
	display: grid; grid-template-columns: 1fr auto; gap: 4px 12px;
	padding: 10px 0; border-bottom: 1px solid var(--tsm-border);
}
.tsm-portal-wrap .tsm-feed li:last-child { border-bottom: 0; }
.tsm-portal-wrap .tsm-feed li strong { font-weight: 600; }
.tsm-portal-wrap .tsm-feed .tsm-muted { grid-column: 1; font-size: 12px; }
.tsm-portal-wrap .tsm-feed .tsm-score { grid-row: 1 / span 2; align-self: center; font-weight: 700; color: var(--tsm-primary); }

/* ---- Certificates ---- */
.tsm-portal-wrap .tsm-cert-list { display: grid; gap: 12px; margin-top: 12px; }
.tsm-portal-wrap .tsm-cert {
	display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center;
	padding: 14px 16px;
	border: 1px solid var(--tsm-border); border-radius: 12px;
	background: linear-gradient(180deg, #fffdf6, #fff);
}
.tsm-portal-wrap .tsm-cert-icon {
	width: 48px; height: 48px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	background: linear-gradient(135deg, #f7c948, #f0b323); color: #fff;
	box-shadow: 0 2px 8px rgba(240,179,35,.4);
}
.tsm-portal-wrap .tsm-cert h4 { margin: 0 0 2px; font-size: 15px; font-weight: 700; }
.tsm-portal-wrap .tsm-cert p { margin: 0; font-size: 13px; }
@media (max-width: 540px) {
	.tsm-portal-wrap .tsm-cert { grid-template-columns: 1fr; text-align: center; }
	.tsm-portal-wrap .tsm-cert-icon { margin: 0 auto; }
}

/* ---- Helpers ---- */
.tsm-portal-wrap .tsm-muted { color: var(--tsm-muted); font-size: 13px; }
.tsm-portal-wrap .tsm-empty { color: var(--tsm-muted); font-style: italic; margin: 0; }
.tsm-portal-wrap .tsm-link { color: var(--tsm-primary); text-decoration: none; font-weight: 600; }
.tsm-portal-wrap .tsm-link:hover { text-decoration: underline; }

/* ---- Login form ---- */
.tsm-portal-wrap .tsm-auth-shell { display: flex; justify-content: center; padding: 40px 0; }
.tsm-portal-wrap .tsm-auth-card {
	width: 100%; max-width: 420px;
	background: var(--tsm-card);
	border: 1px solid var(--tsm-border);
	border-radius: var(--tsm-radius);
	box-shadow: var(--tsm-shadow);
	padding: 32px;
	text-align: center;
}
.tsm-portal-wrap .tsm-auth-title { margin: 0 0 4px; font-size: 22px; font-weight: 800; }
.tsm-portal-wrap .tsm-auth-sub { margin: 0 0 20px; color: var(--tsm-muted); font-size: 14px; }
.tsm-portal-wrap .tsm-auth-card--status { max-width: 520px; }
.tsm-portal-wrap .tsm-auth-card--status .tsm-auth-title { margin-top: 10px; }
.tsm-portal-wrap .tsm-auth-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 4px 10px;
	border-radius: 999px;
	background: color-mix(in srgb, var(--tsm-primary) 12%, #fff);
	color: var(--tsm-primary);
	font-size: 12px;
	font-weight: 700;
}
.tsm-portal-wrap .tsm-auth-actions {
	display: flex;
	gap: 10px;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: 22px;
}
.tsm-portal-wrap .tsm-login-form { text-align: left; }
.tsm-portal-wrap .tsm-field { display: block; margin-bottom: 14px; }
.tsm-portal-wrap .tsm-field span { display: block; font-size: 13px; font-weight: 600; margin-bottom: 4px; color: var(--tsm-text); }
.tsm-portal-wrap .tsm-field input {
	width: 100%; padding: 10px 12px;
	border: 1px solid var(--tsm-border); border-radius: 10px;
	font-size: 14px; box-sizing: border-box;
}
.tsm-portal-wrap .tsm-field input:focus { outline: none; border-color: var(--tsm-primary); box-shadow: 0 0 0 3px rgba(31,111,235,.15); }
.tsm-portal-wrap .tsm-auth-note { margin: 16px 0 0; font-size: 12px; color: var(--tsm-muted); }
.tsm-portal-wrap .tsm-error {
	background: #fee2e2; color: #991b1b;
	padding: 10px 12px; border-radius: 10px; font-size: 13px;
	margin-bottom: 14px; text-align: left;
}

/* ---- Profile information panel (between header and tabs) ---- */
.tsm-portal-wrap .tsm-info-card { margin-bottom: 18px; }
.tsm-portal-wrap .tsm-info-grid {
	display: grid; gap: 22px;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	align-items: start;
}
.tsm-portal-wrap .tsm-info-block {
	min-width: 0; /* allow grid items to shrink so long values don't push siblings */
	overflow-wrap: anywhere;
	word-break: break-word;
}
.tsm-portal-wrap .tsm-info-block .tsm-h3 { margin-bottom: 10px; font-size: 15px; }
.tsm-portal-wrap .tsm-info-block .tsm-dl { margin: 0; min-width: 0; }
.tsm-portal-wrap .tsm-info-block dt {
	font-size: 11px; letter-spacing: .04em; text-transform: uppercase;
	color: var(--tsm-muted); margin-top: 8px;
}
.tsm-portal-wrap .tsm-info-block dd {
	margin: 2px 0 0; font-size: 14px; color: var(--tsm-text);
	min-width: 0;
	overflow-wrap: anywhere;
	word-break: break-word;
}

/* The base .tsm-dl is a 130px / 1fr grid  -  also needs overflow guards so
   long emails / addresses wrap instead of overlapping the next column. */
.tsm-portal-wrap .tsm-dl dd { min-width: 0; overflow-wrap: anywhere; word-break: break-word; }
.tsm-portal-wrap .tsm-dl dt { min-width: 0; }

/* On narrow viewports, stack the dl into a single column so labels and
   values can never collide with each other. */
@media (max-width: 640px) {
	.tsm-portal-wrap .tsm-info-grid { grid-template-columns: 1fr; gap: 18px; }
	.tsm-portal-wrap .tsm-dl {
		grid-template-columns: 1fr;
		gap: 2px 0;
	}
	.tsm-portal-wrap .tsm-dl dt { margin-top: 10px; }
}

/* ---- Success notice ---- */
.tsm-portal-wrap .tsm-success {
	background: #dcfce7; color: #166534;
	padding: 10px 12px; border-radius: 10px; font-size: 13px;
	margin-bottom: 14px; text-align: left;
}
.tsm-portal-wrap .tsm-link { color: var(--tsm-primary); text-decoration: none; }
.tsm-portal-wrap .tsm-link:hover { text-decoration: underline; }

/* ---- Teacher portal niceties (v1.6.3) ---- */
.tsm-portal-wrap.tsm-teacher-portal .tsm-table {
	width: 100%; border-collapse: collapse; background: #fff;
	border: 1px solid var(--tsm-border); border-radius: 12px; overflow: hidden;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-table th,
.tsm-portal-wrap.tsm-teacher-portal .tsm-table td { padding: 12px 14px; vertical-align: middle; border-bottom: 1px solid var(--tsm-border); }
.tsm-portal-wrap.tsm-teacher-portal .tsm-table tbody tr:last-child td { border-bottom: 0; }
.tsm-portal-wrap.tsm-teacher-portal .tsm-table thead th {
	background: #f9fafb; font-size: 11px; font-weight: 700; text-transform: uppercase;
	letter-spacing: .04em; color: #6b7280; text-align: left;
}
.tsm-portal-wrap .tsm-btn-sm {
	display: inline-flex; align-items: center; justify-content: center;
	padding: 6px 12px; border-radius: 8px;
	background: #f3f4f6; color: #111827 !important; text-decoration: none !important;
	border: 1px solid var(--tsm-border); font-size: 13px; font-weight: 600;
	margin-right: 4px; cursor: pointer; font-family: inherit; line-height: 1.2;
}
.tsm-portal-wrap .tsm-btn-sm:hover { background: #e5e7eb; color: #111827 !important; }
.tsm-portal-wrap .tsm-btn-sm.tsm-btn--primary { background: var(--tsm-primary); color: #fff !important; border-color: transparent; }
.tsm-portal-wrap .tsm-btn-sm.tsm-btn--primary:hover { background: var(--tsm-primary-600); color: #fff !important; }
.tsm-portal-wrap .tsm-row-actions {
	display: flex; align-items: center; justify-content: flex-end;
	gap: 8px; flex-wrap: wrap;
}
.tsm-portal-wrap.tsm-teacher-portal h3 { margin: 0 0 14px; font-size: 18px; font-weight: 700; color: var(--tsm-text); }
.tsm-portal-wrap.tsm-teacher-portal h4 { margin: 22px 0 10px; font-size: 15px; font-weight: 700; color: var(--tsm-text); }
.tsm-portal-wrap.tsm-teacher-portal section + section { margin-top: 18px; }
.tsm-portal-wrap.tsm-teacher-portal input[type="number"],
.tsm-portal-wrap.tsm-teacher-portal input[type="text"],
.tsm-portal-wrap.tsm-teacher-portal input[type="date"],
.tsm-portal-wrap.tsm-teacher-portal select {
	padding: 6px 10px; border: 1px solid var(--tsm-border); border-radius: 8px;
	font-size: 13px; background: #fff;
}
.tsm-portal-wrap.tsm-teacher-portal input:focus,
.tsm-portal-wrap.tsm-teacher-portal select:focus { outline: none; border-color: var(--tsm-primary); box-shadow: 0 0 0 3px rgba(31,111,235,.15); }

/* v1.7.0  -  Tuition summary grid for student portal Payments tab */
.tsm-portal-wrap .tsm-tuition-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; }
.tsm-portal-wrap .tsm-tuition-grid > div {
	background: #f9fafb; border: 1px solid var(--tsm-border); border-radius: 10px;
	padding: 14px 16px; display: flex; flex-direction: column; gap: 4px;
}
.tsm-portal-wrap .tsm-tuition-grid span { font-size: 12px; text-transform: uppercase; letter-spacing: .5px; }
.tsm-portal-wrap .tsm-tuition-grid strong { font-size: 22px; font-weight: 800; color: var(--tsm-text); }
@media (max-width: 640px) { .tsm-portal-wrap .tsm-tuition-grid { grid-template-columns: 1fr; } }

/* ---------- Portal Announcements (v1.10.2) ---------- */
.tsm-announcements{margin:14px 0;border-left:4px solid #f4b740;background:#fffbe6}
.tsm-announcements-title{display:flex;align-items:center;gap:8px;margin:0 0 10px}
.tsm-megaphone{font-size:1.15em}
.tsm-announce-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.tsm-announce-item{padding:10px 12px;background:#fff;border:1px solid #f1d99c;border-radius:6px}
.tsm-announce-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:4px}
.tsm-announce-title{font-size:1.02em}
.tsm-announce-date{font-size:.85em;color:#7a6a3a;white-space:nowrap}
.tsm-announce-body p{margin:.25em 0}

/* ==========================================================================
   Teacher portal v1.19.1  -  cleaner header, class cards, composers,
   and scoped polish for WP-admin attendance tables.
   ========================================================================== */

/* Hero: dedicated layout (avoids the negative-margin collisions of the
   shared profile band when the actions row gets dense). */
.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-hero { overflow: hidden; }
.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-hero .tsm-cover { height: 56px; }
.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-hero-body {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 16px;
	padding: 12px 20px 14px;
	margin-top: -28px;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-hero-avatar {
	width: 60px; height: 60px; font-size: 22px;
	border-width: 3px;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-hero-identity { min-width: 0; padding-top: 24px; }
.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-hero-identity .tsm-name {
	margin: 0; font-size: 18px; line-height: 1.2; font-weight: 600;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-hero-identity .tsm-tagline {
	margin-top: 2px; font-size: 12px; color: #64748b;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-hero-actions {
	display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
	padding-top: 24px;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-stats { padding: 8px 20px 14px; gap: 18px; }
.tsm-portal-wrap.tsm-teacher-portal .tsm-stats .tsm-stat-num { font-size: 20px; }
.tsm-portal-wrap.tsm-teacher-portal .tsm-stats .tsm-stat-lbl { font-size: 11px; letter-spacing: .06em; }
.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-year-switcher {
	display: inline-flex; align-items: center;
	background: #f3f4f6; border: 1px solid var(--tsm-border);
	border-radius: 10px; padding: 4px 10px; font-size: 13px;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-year-switcher select {
	border: 0; background: transparent; font-size: 13px; padding: 2px 4px;
}
@media (max-width: 760px) {
	.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-hero-body {
		grid-template-columns: 1fr;
		text-align: center;
		gap: 6px;
		padding: 10px 16px 14px;
	}
	.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-hero-avatar { margin: -28px auto 0; }
	.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-hero-identity { padding-top: 0; }
	.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-hero-actions { padding-top: 4px; justify-content: center; }
	.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-hero-identity .tsm-name { white-space: normal; }
	.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-hero-identity .tsm-tagline { justify-content: center; }
}

/* Section header (title + meta + count) */
.tsm-portal-wrap.tsm-teacher-portal .tsm-section-head {
	display: flex; align-items: baseline; justify-content: space-between;
	gap: 12px; margin-bottom: 14px; flex-wrap: wrap;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-section-head h3 { margin: 0; }
.tsm-portal-wrap.tsm-teacher-portal .tsm-section-meta { font-weight: 400; color: var(--tsm-muted); font-size: 14px; margin-left: 4px; }
.tsm-portal-wrap.tsm-teacher-portal .tsm-section-count { font-size: 12px; color: var(--tsm-muted); text-transform: uppercase; letter-spacing: .04em; }

/* Class cards (single, richer card grid  -  replaces old quick-actions + table) */
.tsm-portal-wrap.tsm-teacher-portal .tsm-tcard-grid {
	display: grid !important;
	grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
	gap: 16px !important;
	width: 100% !important;
	align-items: stretch !important;
}
/* Kill any theme-injected ::before/::after that themes add to flex/grid wrappers
   (e.g. clearfix on .entry-content > div)  -  these were rendering as phantom rows/cards
   inside the portal. Scope broadly to all grid wrappers inside any portal container. */
.tsm-portal-wrap .tsm-tcard-grid::before,
.tsm-portal-wrap .tsm-tcard-grid::after,
.tsm-portal-wrap .tsm-info-grid::before,
.tsm-portal-wrap .tsm-info-grid::after,
.tsm-portal-wrap .tsm-card::before,
.tsm-portal-wrap .tsm-card::after,
.tsm-portal-wrap div[style*="grid"]::before,
.tsm-portal-wrap div[style*="grid"]::after,
.tsm-portal-wrap div[style*="flex"]::before,
.tsm-portal-wrap div[style*="flex"]::after {
	content: none !important;
	display: none !important;
	grid-column: unset !important;
	width: 0 !important;
	height: 0 !important;
}
/* Profile-header action buttons (Report Card / Transcript / Log out)  -  keep
   them visually consistent with the primary action so labels are legible
   against the portal cover gradient and the white profile body. */
.tsm-portal-wrap .tsm-profile-actions .tsm-btn,
.tsm-portal-wrap .tsm-profile-actions .tsm-btn--ghost {
	background: var(--tsm-primary) !important;
	color: #fff !important;
	border-color: var(--tsm-primary) !important;
}
.tsm-portal-wrap .tsm-profile-actions .tsm-btn:hover,
.tsm-portal-wrap .tsm-profile-actions .tsm-btn--ghost:hover {
	background: var(--tsm-primary-600) !important;
	border-color: var(--tsm-primary-600) !important;
	color: #fff !important;
}
@media (max-width: 1100px) {
	.tsm-portal-wrap.tsm-teacher-portal .tsm-tcard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 700px) {
	.tsm-portal-wrap.tsm-teacher-portal .tsm-tcard-grid { grid-template-columns: 1fr !important; }
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-tcard { min-width: 0 !important; width: 100% !important; margin: 0 !important; }
.tsm-portal-wrap.tsm-teacher-portal .tsm-tcard {
	background: #fff;
	border: 1px solid var(--tsm-border);
	border-radius: 14px;
	padding: 18px;
	display: flex; flex-direction: column; gap: 10px;
	transition: border-color .15s, box-shadow .15s, transform .15s;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-tcard:hover {
	border-color: var(--tsm-primary);
	box-shadow: 0 6px 18px rgba(31,111,235,.10);
	transform: translateY(-1px);
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-tcard-head {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-tcard-title {
	margin: 0; font-size: 16px; font-weight: 700; line-height: 1.3;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-tcard-avg {
	font-size: 18px; font-weight: 800; color: var(--tsm-primary);
	background: #eef4ff; padding: 4px 10px; border-radius: 999px;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-tcard-avg.is-empty {
	color: var(--tsm-muted); background: #f3f4f6;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-tcard-meta {
	font-size: 13px; color: var(--tsm-muted);
	display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-tcard-meta strong { color: var(--tsm-text); }
.tsm-portal-wrap.tsm-teacher-portal .tsm-tcard-meta-sep { color: var(--tsm-border); }
.tsm-portal-wrap.tsm-teacher-portal .tsm-tcard-actions {
	display: flex; gap: 8px; margin-top: 4px; flex-wrap: wrap;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-tcard-actions .tsm-btn { padding: 7px 14px; font-size: 13px; }

/* Composers (assignment / announcement) */
.tsm-portal-wrap.tsm-teacher-portal .tsm-composer-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
	gap: 18px;
	margin-top: 24px;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-composer {
	background: #fff; border: 1px solid var(--tsm-border);
	border-radius: 12px; padding: 18px;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-composer--primary {
	margin: 0 0 18px;
	background: #fbfdff;
	border-color: color-mix(in srgb, var(--tsm-primary) 18%, var(--tsm-border));
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-collapsible-composer > summary {
	cursor: pointer;
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	font-size: 15px;
	font-weight: 700;
	color: var(--tsm-text);
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-collapsible-composer > summary::-webkit-details-marker {
	display: none;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-collapsible-composer > summary::after {
	content: '+';
	width: 26px;
	height: 26px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 999px;
	background: #eef4ff;
	color: var(--tsm-primary);
	font-weight: 800;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-collapsible-composer[open] > summary {
	margin-bottom: 14px;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-collapsible-composer[open] > summary::after {
	content: '-';
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-composer h4 { margin: 0 0 14px; }
.tsm-portal-wrap.tsm-teacher-portal .tsm-composer-form .tsm-field { display: block; margin-bottom: 12px; }
.tsm-portal-wrap.tsm-teacher-portal .tsm-composer-form .tsm-field span {
	display: block; font-size: 12px; font-weight: 600; color: var(--tsm-text);
	margin-bottom: 4px; text-transform: uppercase; letter-spacing: .04em;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-composer-form input[type="text"],
.tsm-portal-wrap.tsm-teacher-portal .tsm-composer-form input[type="number"],
.tsm-portal-wrap.tsm-teacher-portal .tsm-composer-form input[type="date"],
.tsm-portal-wrap.tsm-teacher-portal .tsm-composer-form textarea {
	width: 100%; box-sizing: border-box;
	padding: 9px 12px; border: 1px solid var(--tsm-border);
	border-radius: 8px; font-size: 14px; font-family: inherit;
	background: #fff;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-composer-form textarea { min-height: 96px; resize: vertical; }
.tsm-portal-wrap.tsm-teacher-portal .tsm-field-row {
	display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
}

/* Scope WordPress-default widefat/striped tables (used by attendance panel)
   inside the portal  -  gives them the same padding, header styling and chip
   alignment as the rest of the portal so they no longer look "smushed". */
.tsm-portal-wrap .widefat,
.tsm-portal-wrap .tsm-att-panel .widefat {
	width: 100%; border-collapse: collapse; background: #fff;
	border: 1px solid var(--tsm-border); border-radius: 12px; overflow: hidden;
	font-size: 14px;
}
.tsm-portal-wrap .widefat thead th {
	background: #fafbfc; color: var(--tsm-muted);
	font-size: 11px; text-transform: uppercase; letter-spacing: .04em;
	padding: 10px 14px; text-align: left; border-bottom: 1px solid var(--tsm-border);
}
.tsm-portal-wrap .widefat tbody td {
	padding: 10px 14px; border-bottom: 1px solid var(--tsm-border); vertical-align: middle;
}
.tsm-portal-wrap .widefat tbody tr:last-child td { border-bottom: 0; }
.tsm-portal-wrap .widefat.striped tbody tr:nth-child(2n) { background: #fafbfc; }
.tsm-portal-wrap .tsm-att-panel .button,
.tsm-portal-wrap .tsm-att-panel .button-small {
	display: inline-block; padding: 6px 12px; border-radius: 8px;
	background: #f3f4f6; color: #111827 !important; text-decoration: none;
	border: 1px solid var(--tsm-border); font-size: 13px; font-weight: 600;
}
.tsm-portal-wrap .tsm-att-panel .button:hover { background: #e5e7eb; }
.tsm-portal-wrap .tsm-att-panel .button-primary {
	background: var(--tsm-primary); color: #fff !important; border-color: transparent;
}
.tsm-portal-wrap .tsm-att-panel .button-primary:hover { background: var(--tsm-primary-600); }
.tsm-portal-wrap .tsm-att-panel input[type="text"],
.tsm-portal-wrap .tsm-att-panel input[type="date"],
.tsm-portal-wrap .tsm-att-panel select {
	padding: 7px 10px; border: 1px solid var(--tsm-border); border-radius: 8px;
	font-size: 13px; background: #fff;
}
.tsm-portal-wrap .tsm-att-tabs { gap: 6px; border-bottom-color: var(--tsm-border); }
.tsm-portal-wrap .tsm-att-tab.is-active { color: var(--tsm-primary); border-color: var(--tsm-border); }

/* Grade-entry table inputs spacing (assignment view) */
.tsm-portal-wrap.tsm-teacher-portal .tsm-table input[type="number"],
.tsm-portal-wrap.tsm-teacher-portal .tsm-table input[type="text"] {
	padding: 7px 10px;
}

/* Teacher portal  -  class sub-tabs (Roster / Assignments / Announcements) */
.tsm-portal-wrap.tsm-teacher-portal .tsm-class-head {
	display: flex; align-items: flex-start; justify-content: space-between;
	gap: 16px; flex-wrap: wrap; margin-bottom: 16px;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-class-section {
	scroll-margin-top: 128px;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-pill {
	display: inline-flex; align-items: center; gap: 6px;
	padding: 4px 12px; border-radius: 999px;
	background: color-mix(in srgb, var(--tsm-primary) 10%, #fff);
	color: var(--tsm-primary); font-size: 12px; font-weight: 600;
	border: 1px solid color-mix(in srgb, var(--tsm-primary) 20%, transparent);
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-subtabs {
	display: flex; gap: 4px; border-bottom: 1px solid var(--tsm-border);
	margin: 0 0 18px; padding: 0; flex-wrap: wrap;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-subtab {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 10px 16px; text-decoration: none; color: var(--tsm-muted);
	font-size: 14px; font-weight: 600; border-bottom: 2px solid transparent;
	margin-bottom: -1px; transition: color .15s, border-color .15s;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-subtab:hover { color: var(--tsm-text); }
.tsm-portal-wrap.tsm-teacher-portal .tsm-subtab.is-active {
	background: var(--tsm-primary);
	color: var(--tsm-primary-contrast) !important;
	border-bottom-color: var(--tsm-primary);
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-subtab-count {
	background: #f3f4f6; color: var(--tsm-muted);
	padding: 1px 8px; border-radius: 999px; font-size: 11px; font-weight: 700;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-subtab.is-active .tsm-subtab-count {
	background: rgba(255, 255, 255, .22);
	color: var(--tsm-primary-contrast) !important;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-tab-actions {
	display: flex; justify-content: flex-end; margin-bottom: 12px;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-check {
	display: inline-flex; align-items: center; gap: 6px;
	font-size: 13px; font-weight: 500; color: var(--tsm-text);
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-section-title {
	margin: 18px 0 10px;
	font-size: 15px;
	font-weight: 700;
	color: var(--tsm-text);
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-form-actions {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	margin-top: 4px;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-btn--danger {
	background: #fee2e2;
	color: #991b1b !important;
	border-color: #fecaca;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-btn--danger:hover {
	background: #fecaca;
	color: #7f1d1d !important;
}

/* Announcement list in announcements tab */
.tsm-portal-wrap.tsm-teacher-portal .tsm-ann-list {
	list-style: none; margin: 0 0 16px; padding: 0;
	display: grid; gap: 10px;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-ann-item {
	border: 1px solid var(--tsm-border); border-radius: 12px;
	padding: 14px 16px; background: #fff;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-ann-title {
	font-weight: 700; font-size: 15px; margin-bottom: 4px;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-ann-row {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	align-items: flex-start;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-ann-actions {
	display: flex;
	gap: 8px;
	align-items: center;
	flex-wrap: wrap;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-ann-actions form {
	margin: 0;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-ann-body {
	font-size: 14px; color: var(--tsm-text); line-height: 1.5;
}
.tsm-portal-wrap.tsm-teacher-portal .tsm-ann-meta {
	margin-top: 6px; font-size: 12px; color: var(--tsm-muted);
}

/* ==========================================================================
   Mobile-friendly portals (v1.19.14)
   Bigger tap targets, stacked tables, sticky save bars, horizontal-scroll
   tabs. Applies to both student and teacher portals.
   ========================================================================== */

/* Prevent iOS zoom on focus  -  all portal inputs must be at least 16px font */
@media (max-width: 760px) {
	.tsm-portal-wrap input[type="text"],
	.tsm-portal-wrap input[type="email"],
	.tsm-portal-wrap input[type="password"],
	.tsm-portal-wrap input[type="number"],
	.tsm-portal-wrap input[type="date"],
	.tsm-portal-wrap input[type="search"],
	.tsm-portal-wrap input[type="tel"],
	.tsm-portal-wrap select,
	.tsm-portal-wrap textarea {
		font-size: 16px !important;
		min-height: 44px;
	}
	.tsm-portal-wrap .tsm-btn,
	.tsm-portal-wrap .tsm-btn-sm,
	.tsm-portal-wrap .button {
		min-height: 44px;
		padding-top: 10px;
		padding-bottom: 10px;
	}

	/* Tabs scroll horizontally instead of wrapping */
	.tsm-portal-wrap .tsm-tabs,
	.tsm-portal-wrap.tsm-teacher-portal .tsm-subtabs,
	.tsm-portal-wrap .tsm-att-tabs {
		flex-wrap: nowrap;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}
	.tsm-portal-wrap .tsm-tabs::-webkit-scrollbar,
	.tsm-portal-wrap.tsm-teacher-portal .tsm-subtabs::-webkit-scrollbar,
	.tsm-portal-wrap .tsm-att-tabs::-webkit-scrollbar { display: none; }
	.tsm-portal-wrap .tsm-tab,
	.tsm-portal-wrap.tsm-teacher-portal .tsm-subtab,
	.tsm-portal-wrap .tsm-att-tab { flex: 0 0 auto; }

	/* Cards: tighter padding so they breathe on small screens */
	.tsm-portal-wrap .tsm-card--pad { padding: 14px; }
	.tsm-portal-wrap { padding: 0 10px; margin: 12px auto; }

	/* Class card grid -> single column */
	.tsm-portal-wrap.tsm-teacher-portal .tsm-tcard-grid { grid-template-columns: 1fr !important; gap: 12px !important; }
	.tsm-portal-wrap.tsm-teacher-portal .tsm-tcard-actions .tsm-btn { flex: 1; }

	/* ---- Stacked tables (roster, assignments, grade entry, attendance) ---- */
	.tsm-portal-wrap .tsm-stack-table,
	.tsm-portal-wrap .tsm-stack-table thead,
	.tsm-portal-wrap .tsm-stack-table tbody,
	.tsm-portal-wrap .tsm-stack-table tr,
	.tsm-portal-wrap .tsm-stack-table td {
		display: block;
		width: 100% !important;
	}
	.tsm-portal-wrap .tsm-stack-table thead { display: none; }
	.tsm-portal-wrap .tsm-stack-table tr {
		background: #fff;
		border: 1px solid var(--tsm-border);
		border-radius: 12px;
		margin-bottom: 12px;
		padding: 4px 0;
		box-shadow: 0 1px 2px rgba(15,23,42,.04);
	}
	.tsm-portal-wrap .tsm-stack-table td {
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 12px;
		padding: 10px 14px;
		border-bottom: 1px solid #f1f5f9 !important;
		text-align: right;
	}
	.tsm-portal-wrap .tsm-stack-table tr td:last-child { border-bottom: 0 !important; }
	.tsm-portal-wrap .tsm-stack-table td::before {
		content: attr(data-label);
		flex: 0 0 40%;
		text-align: left;
		font-size: 12px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: .04em;
		color: var(--tsm-muted);
	}
	.tsm-portal-wrap .tsm-stack-table td[data-label=""]::before { display: none; }
	.tsm-portal-wrap .tsm-stack-table td[data-label=""] { justify-content: flex-end; }
	.tsm-portal-wrap .tsm-stack-table .tsm-assignment-summary-row {
		margin-bottom: 0;
	}
	.tsm-portal-wrap .tsm-stack-table .tsm-assignment-detail-row {
		margin-top: 0;
		border-top: 0;
		border-radius: 0 0 12px 12px;
	}
	.tsm-portal-wrap .tsm-stack-table .tsm-assignment-detail-row td {
		display: block;
		text-align: left;
		border-bottom: 0 !important;
	}
	.tsm-portal-wrap .tsm-stack-table .tsm-assignment-detail-row td::before {
		display: none;
	}
	.tsm-portal-wrap .tsm-stack-table .tsm-assignment-summary-row.is-expanded {
		border-radius: 12px 12px 0 0;
		border-bottom-color: transparent;
	}
	.tsm-portal-wrap .tsm-stack-table .tsm-assignment-summary-row.is-expanded + .tsm-assignment-detail-row {
		margin-bottom: 12px;
	}
	/* Inputs in stacked cells fill the right column */
	.tsm-portal-wrap .tsm-stack-table td input[type="text"],
	.tsm-portal-wrap .tsm-stack-table td input[type="number"],
	.tsm-portal-wrap .tsm-stack-table td input[type="date"],
	.tsm-portal-wrap .tsm-stack-table td select,
	.tsm-portal-wrap .tsm-stack-table td .tsm-grade-num,
	.tsm-portal-wrap .tsm-stack-table td .tsm-grade-comments {
		flex: 1; min-width: 0; width: auto !important;
		max-width: 60%;
	}

	/* Grade entry  -  make the student name a full-width header inside the card */
	.tsm-portal-wrap .tsm-grade-grid td.tsm-grade-name {
		justify-content: flex-start;
		background: #f9fafb;
		font-weight: 700;
		text-align: left;
		border-radius: 12px 12px 0 0;
		padding: 12px 14px;
	}
	.tsm-portal-wrap .tsm-grade-grid td.tsm-grade-name::before { display: none; }

	/* Attendance pills become big tappable tiles in 2-col grid */
	.tsm-portal-wrap .tsm-att-pills {
		display: grid !important;
		grid-template-columns: 1fr 1fr;
		gap: 6px;
		width: 100%;
	}
	.tsm-portal-wrap .tsm-att-pill {
		justify-content: center;
		padding: 12px 8px;
		font-size: 14px;
		border-radius: 10px;
		min-height: 44px;
	}
	.tsm-portal-wrap .tsm-stack-table .tsm-att-pills { max-width: 60%; }

	/* Bulk-mark buttons full width row */
	.tsm-portal-wrap .tsm-att-bulk { width: 100%; }
	.tsm-portal-wrap .tsm-att-bulk .tsm-att-bulk-btn { flex: 1; min-height: 40px; }

	/* Composers (assignment / announcement)  -  collapse 2-col rows */
	.tsm-portal-wrap.tsm-teacher-portal .tsm-field-row { grid-template-columns: 1fr; }
	.tsm-portal-wrap.tsm-teacher-portal .tsm-composer-grid { grid-template-columns: 1fr; }

	/* Profile tabs  -  student portal */
	.tsm-portal-wrap .tsm-tab { padding: 10px 14px; font-size: 13px; }

	/* Tagline wraps cleanly */
	.tsm-portal-wrap .tsm-tagline { justify-content: center; }
}

/* Sticky save bar  -  applies on every viewport so it's always reachable */
.tsm-portal-wrap .tsm-save-bar {
	position: sticky;
	bottom: 0;
	background: linear-gradient(180deg, rgba(255,255,255,0) 0%, var(--tsm-bg) 30%);
	padding: 16px 0 12px;
	margin-top: 18px;
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	z-index: 5;
}
.tsm-portal-wrap .tsm-btn--lg { padding: 12px 22px; font-size: 15px; min-height: 48px; }
@media (max-width: 760px) {
	.tsm-portal-wrap .tsm-save-bar { flex-direction: column-reverse; }
	.tsm-portal-wrap .tsm-save-bar > * { width: 100%; }
}

/* Hero actions wrap on mobile (year switcher + buttons) */
@media (max-width: 540px) {
	.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-hero-actions { width: 100%; }
	.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-hero-actions .tsm-teacher-year-switcher,
	.tsm-portal-wrap.tsm-teacher-portal .tsm-teacher-hero-actions .tsm-btn { flex: 1 1 auto; }
}

/* v1.19.32  -  status-driven grade entry (teacher portal) */
.tsm-portal-wrap .tsm-grade-entry-scroll{overflow-x:auto;border:1px solid var(--tsm-border,#e5e7eb);border-radius:10px;background:#fff;}
.tsm-portal-wrap .tsm-grade-entry{margin:0;width:100%;min-width:1048px;table-layout:fixed;}
.tsm-portal-wrap .tsm-grade-entry th,
.tsm-portal-wrap .tsm-grade-entry td{padding:10px 12px;vertical-align:middle;overflow:hidden;}
.tsm-portal-wrap .tsm-grade-entry input{width:100%;box-sizing:border-box;}
.tsm-portal-wrap .tsm-grade-entry .tsm-ge-total,
.tsm-portal-wrap .tsm-grade-entry .tsm-ge-pct{font-weight:600;text-align:right;font-variant-numeric:tabular-nums;}
.tsm-portal-wrap .tsm-grade-entry .tsm-ge-counts{text-align:center;color:#555;font-size:12px;}
.tsm-portal-wrap .tsm-grade-row{--tsm-grade-row-bg:#fff;}
.tsm-portal-wrap .tsm-grade-row[data-status=completed_ontime]{--tsm-grade-row-bg:#f1f8f3;}
.tsm-portal-wrap .tsm-grade-row[data-status=completed_late]{--tsm-grade-row-bg:#fff8e6;}
.tsm-portal-wrap .tsm-grade-row[data-status=incomplete],
.tsm-portal-wrap .tsm-grade-row[data-status=missing]{--tsm-grade-row-bg:#fdf1f1;}
.tsm-portal-wrap .tsm-grade-row[data-status=excused],
.tsm-portal-wrap .tsm-grade-row[data-status=excluded]{--tsm-grade-row-bg:#f3f4f6;color:#777;}

/* Column widths  -  full grading (10 cols: Student, Status, Submitted, Raw, Bonus, Penalty, Total, Grade, Counts, Comments) */
.tsm-portal-wrap .tsm-grade-entry colgroup col{}
.tsm-portal-wrap .tsm-grade-entry thead th:nth-child(1),
.tsm-portal-wrap .tsm-grade-entry tbody td:nth-child(1){width:14%;}        /* Student */
.tsm-portal-wrap .tsm-grade-entry thead th:nth-child(2),
.tsm-portal-wrap .tsm-grade-entry tbody td:nth-child(2){width:11%;}        /* Status */
.tsm-portal-wrap .tsm-grade-entry thead th:nth-child(3),
.tsm-portal-wrap .tsm-grade-entry tbody td:nth-child(3){width:150px !important;min-width:150px !important;padding-left:8px;padding-right:8px;} /* Submitted cell sized so the actual date control can be 126px */
.tsm-portal-wrap .tsm-grade-entry .tsm-ge-submitted{width:126px !important;min-width:126px !important;max-width:none;}
.tsm-portal-wrap .tsm-grade-entry td:nth-child(3) input[type=date]{width:126px !important;min-width:126px !important;}
/* v1.19.42  -  color-code the actual form controls too; native date/select controls need an inset paint layer, not just background-color. */
.tsm-portal-wrap .tsm-grade-row,
.tsm-portal-wrap .tsm-grade-row > td{background:var(--tsm-grade-row-bg) !important;}
.tsm-portal-wrap .tsm-grade-row .tsm-ge-status,
.tsm-portal-wrap .tsm-grade-row .tsm-ge-submitted,
.tsm-portal-wrap .tsm-grade-row .tsm-grade-num,
.tsm-portal-wrap .tsm-grade-row .tsm-grade-comments{
	background-color:var(--tsm-grade-row-bg) !important;
	box-shadow:inset 0 0 0 999px var(--tsm-grade-row-bg);
	-webkit-box-shadow:inset 0 0 0 999px var(--tsm-grade-row-bg);
}
.tsm-portal-wrap .tsm-grade-entry thead th:nth-child(4),
.tsm-portal-wrap .tsm-grade-entry tbody td:nth-child(4),
.tsm-portal-wrap .tsm-grade-entry thead th:nth-child(5),
.tsm-portal-wrap .tsm-grade-entry tbody td:nth-child(5),
.tsm-portal-wrap .tsm-grade-entry thead th:nth-child(6),
.tsm-portal-wrap .tsm-grade-entry tbody td:nth-child(6){width:7%;}         /* Raw / Bonus / Penalty */
.tsm-portal-wrap .tsm-grade-entry thead th:nth-child(7),
.tsm-portal-wrap .tsm-grade-entry tbody td:nth-child(7),
.tsm-portal-wrap .tsm-grade-entry thead th:nth-child(8),
.tsm-portal-wrap .tsm-grade-entry tbody td:nth-child(8){width:6%;}         /* Total / Grade */
.tsm-portal-wrap .tsm-grade-entry thead th:nth-child(9),
.tsm-portal-wrap .tsm-grade-entry tbody td:nth-child(9){width:6%;}         /* Counts */
.tsm-portal-wrap .tsm-grade-entry thead th:nth-child(10),
.tsm-portal-wrap .tsm-grade-entry tbody td:nth-child(10){width:auto;min-width:200px;} /* Comments  -  take remaining */

@media (max-width:720px){
  .tsm-portal-wrap .tsm-grade-entry-scroll{overflow-x:visible;border:0;background:transparent;}
  .tsm-portal-wrap .tsm-grade-entry{min-width:0;table-layout:auto;}
  .tsm-portal-wrap .tsm-grade-entry thead{display:none;}
  .tsm-portal-wrap .tsm-grade-entry,.tsm-portal-wrap .tsm-grade-entry tbody,.tsm-portal-wrap .tsm-grade-entry tr,.tsm-portal-wrap .tsm-grade-entry td{display:block;width:100%;}
  .tsm-portal-wrap .tsm-grade-entry tr{border:1px solid var(--tsm-border,#e5e7eb);border-radius:10px;margin:10px 0;padding:8px;background:#fff;}
  .tsm-portal-wrap .tsm-grade-entry td{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:6px 4px;border:0;}
  .tsm-portal-wrap .tsm-grade-entry td:before{content:attr(data-label);font-weight:600;font-size:12px;text-transform:uppercase;color:#666;}
  .tsm-portal-wrap .tsm-grade-entry td:nth-child(n){width:100%;min-width:0;}
  .tsm-portal-wrap .tsm-grade-entry input{max-width:60%;width:auto;}
}
