/* Suthar Solutions School ERP Core — public front-end styles.
 *
 * Deliberately theme-adaptive: no font-family is set (inherits the active
 * theme's typography). Colors are driven by CSS custom properties with
 * sensible defaults, overridable from the theme's Additional CSS, e.g.:
 *
 *   :root { --sserp-accent: #6d3fc4; --sserp-radius: 4px; }
 */

.sserp-public {
	--sserp-accent: #6d3fc4;
	--sserp-accent-dark: #4c2a8c;
	--sserp-radius: 8px;
	--sserp-border: #e2e2e2;
	--sserp-muted: #6b7280;
	--sserp-bg-subtle: #f7f6fb;

	max-width: 960px;
	margin: 0 auto;
	line-height: 1.6;
}
.sserp-public * { box-sizing: border-box; }

/* School info */
.sserp-school-info-header { display: flex; align-items: center; gap: 16px; margin-bottom: 20px; }
.sserp-school-logo { max-width: 80px; max-height: 80px; border-radius: var(--sserp-radius); object-fit: cover; }
.sserp-school-name { margin: 0 0 4px; font-size: 1.5em; }
.sserp-school-principal { margin: 0; color: var(--sserp-muted); }
.sserp-school-info-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.sserp-school-info-item { display: flex; flex-direction: column; gap: 2px; padding: 12px 14px; background: var(--sserp-bg-subtle); border-radius: var(--sserp-radius); }
.sserp-school-info-label { font-size: .78em; text-transform: uppercase; letter-spacing: .03em; color: var(--sserp-muted); }
.sserp-school-info-item a { color: var(--sserp-accent); text-decoration: none; }
.sserp-school-info-item a:hover { text-decoration: underline; }

/* Staff directory */
.sserp-staff-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 18px; }
.sserp-staff-card { text-align: center; padding: 18px 14px; border: 1px solid var(--sserp-border); border-radius: var(--sserp-radius); background: #fff; }
.sserp-staff-photo { width: 88px; height: 88px; border-radius: 50%; object-fit: cover; margin: 0 auto 10px; display: block; }
.sserp-staff-photo-placeholder {
	display: flex; align-items: center; justify-content: center;
	background: var(--sserp-accent); color: #fff; font-size: 1.6em; font-weight: 600;
}
.sserp-staff-name { margin: 0 0 4px; font-size: 1.05em; }
.sserp-staff-designation { margin: 0; color: var(--sserp-muted); font-size: .9em; }
.sserp-staff-specialization { margin: 4px 0 0; font-size: .82em; color: var(--sserp-accent); }

/* Portal */
.sserp-portal-login-required { text-align: center; padding: 40px 20px; }
.sserp-portal-btn,
.sserp-portal-switch-btn {
	display: inline-block;
	background: var(--sserp-accent);
	color: #fff;
	border: none;
	border-radius: 4px;
	padding: 10px 22px;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	text-decoration: none;
}
.sserp-portal-btn:hover { background: var(--sserp-accent-dark); color: #fff; }

.sserp-portal-switcher { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.sserp-portal-switch-btn { background: #fff; color: var(--sserp-accent); border: 1px solid var(--sserp-accent); }
.sserp-portal-switch-btn.sserp-portal-switch-active,
.sserp-portal-switch-btn:hover { background: var(--sserp-accent); color: #fff; }

.sserp-portal-header { display: flex; align-items: center; gap: 16px; margin-bottom: 18px; }
.sserp-portal-photo { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; }
.sserp-portal-photo-placeholder {
	display: flex; align-items: center; justify-content: center;
	background: var(--sserp-accent); color: #fff; font-size: 1.5em; font-weight: 600;
}
.sserp-portal-name { margin: 0 0 4px; font-size: 1.3em; }
.sserp-portal-id { margin: 0; color: var(--sserp-muted); font-size: .9em; }

.sserp-portal-current-class {
	background: var(--sserp-bg-subtle);
	border-radius: var(--sserp-radius);
	padding: 12px 16px;
	margin-bottom: 18px;
	display: flex;
	gap: 10px;
	align-items: baseline;
	flex-wrap: wrap;
}
.sserp-portal-roll { color: var(--sserp-muted); font-size: .85em; }

.sserp-portal-info-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin-bottom: 24px; }
.sserp-portal-info-item { display: flex; flex-direction: column; gap: 2px; }
.sserp-portal-info-label { font-size: .78em; text-transform: uppercase; letter-spacing: .03em; color: var(--sserp-muted); }

.sserp-portal-section-title { margin: 24px 0 10px; font-size: 1.1em; }
.sserp-portal-muted { color: var(--sserp-muted); }

.sserp-portal-table { width: 100%; border-collapse: collapse; }
.sserp-portal-table th,
.sserp-portal-table td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--sserp-border); font-size: .92em; }
.sserp-portal-table th { color: var(--sserp-muted); font-weight: 500; }

.sserp-portal-status {
	display: inline-block;
	padding: 2px 10px;
	border-radius: 12px;
	font-size: .85em;
	font-weight: 600;
	background: #f0f0f1;
	color: #50575e;
}
.sserp-portal-status-active { background: #f1ebfb; color: var(--sserp-accent); }
.sserp-portal-status-expired,
.sserp-portal-status-cancelled,
.sserp-portal-status-withdrawn { background: #fcf0f1; color: #d63638; }
.sserp-portal-status-completed,
.sserp-portal-status-graduated,
.sserp-portal-status-alumni { background: #eef1f5; color: #2271b1; }

.sserp-portal-footnote { margin-top: 20px; font-size: .82em; color: var(--sserp-muted); }