/**
 * Estilos propios del panel del profesor (Fase 1H).
 *
 * Solo se cargan en Automatrícula > Panel profesor
 * (ver AMPRO_Admin::maybe_enqueue_teacher_panel_assets()). Reutiliza
 * clases ya existentes del admin (.ampro-card, .ampro-badge,
 * .ampro-calendar-legend, .ampro-calendar-detail*,
 * .ampro-practice-slots-calendar para el contenedor del calendario) sin
 * duplicarlas; aquí solo se añade lo propio de esta pantalla.
 */

.ampro-teacher-panel__profile {
	display: flex;
	align-items: center;
	gap: 16px;
	margin: 12px 0 20px;
}

.ampro-teacher-panel__profile-copy {
	min-width: 0;
}

.ampro-teacher-panel__welcome {
	font-size: 1.05em;
	margin: 0;
}
.ampro-teacher-avatar--panel {
	width: 72px;
	height: 72px;
}

@media screen and (max-width: 600px) {
	.ampro-teacher-panel__profile {
		align-items: flex-start;
	}

	.ampro-teacher-avatar--panel {
		width: 56px;
		height: 56px;
	}
}

/* -----------------------------------------------------------------------
 * Fase 1X.1 — Ancho completo. `.ampro-card` (admin.css, sección 3) trae
 * un `max-width: 780px` pensado para formularios de alta/edición, que
 * en el resto del plugin no molesta porque esas pantallas usan
 * principalmente `WP_List_Table` (fuera de cualquier `.ampro-card`).
 * El panel profesor, en cambio, envuelve CADA pestaña (Resumen, Mi
 * horario, Mis alumnos, Evaluaciones, Mensajes) en una `.ampro-card`,
 * así que heredaba ese límite en las cinco pestañas — de ahí la
 * sensación de bloque estrecho "encajonado" frente a pantallas como
 * Automatrícula > Grupos. Se sobrescribe aquí, acotado a
 * `.ampro-teacher-panel` (esta hoja de estilos ya solo se carga en esta
 * pantalla, ver AMPRO_Admin::maybe_enqueue_teacher_panel_assets()), sin
 * tocar el límite de 780px en el resto del plugin.
 * --------------------------------------------------------------------- */

.ampro-teacher-panel .ampro-card {
	max-width: none;
	width: 100%;
	box-sizing: border-box;
}

/* -----------------------------------------------------------------------
 * Tarjetas de resumen
 * --------------------------------------------------------------------- */

.ampro-teacher-panel__cards {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin-bottom: 20px;
}

.ampro-teacher-panel__card {
	background: #fff;
	border: 1px solid #dcdcde;
	border-radius: 6px;
	padding: 16px 20px;
	min-width: 160px;
	flex: 1 1 160px;
	text-align: center;
}

.ampro-teacher-panel__card-number {
	display: block;
	font-size: 2em;
	font-weight: 700;
	color: #2271b1;
	line-height: 1.2;
}

.ampro-teacher-panel__card-label {
	display: block;
	color: #50575e;
	font-size: 0.9em;
	margin-top: 4px;
}

/* -----------------------------------------------------------------------
 * Filtros de "Mis alumnos" (reutiliza el estilo nativo de WP para
 * selects/inputs; solo se ajusta el espaciado en línea)
 * --------------------------------------------------------------------- */

.ampro-teacher-panel__filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 12px;
	margin-bottom: 16px;
	width: 100%;
}

.ampro-teacher-panel__filters select,
.ampro-teacher-panel__filters input[type="search"],
.ampro-teacher-panel__filters input[type="text"] {
	min-width: 180px;
}

/* Tablas de "Mis alumnos", Evaluaciones y Mensajes: ya usan `widefat`
 * (WordPress las pone a `width: 100%` por defecto), pero se refuerza
 * aquí para no depender de que ese comportamiento nativo no cambie, y
 * se evita el desborde horizontal en pantallas estrechas con scroll en
 * el propio contenedor en vez de romper el layout del admin. */
.ampro-teacher-panel table.widefat {
	width: 100%;
}

.ampro-teacher-panel .ampro-card {
	overflow-x: auto;
}

/* El calendario de "Mi horario" (FullCalendar, ver
 * admin/assets/practice-slots-calendar.js, reutilizado tal cual) ya se
 * ajusta solo al ancho de su contenedor — al ensanchar `.ampro-card`
 * arriba, gana automáticamente todo el ancho disponible. Se añade un
 * ancho mínimo orientativo para que la rejilla nunca quede tan
 * comprimida que sea ilegible en pantallas de escritorio normales. */
.ampro-teacher-panel .ampro-practice-slots-calendar {
	width: 100%;
	min-width: 0;
}

@media screen and (min-width: 783px) {
	.ampro-teacher-panel .ampro-practice-slots-calendar {
		min-width: 1100px;
	}
}

/* -----------------------------------------------------------------------
 * Calendario "Mi horario": distinción visual clase/práctica sin
 * colores agresivos. El color de "clase" ya lo aporta
 * AMPRO_Calendar_Helper::get_status_colors()['active'] (verde suave,
 * igual que en los otros dos calendarios); aquí solo se define el
 * matiz para "práctica" en la leyenda y en los propios eventos.
 * --------------------------------------------------------------------- */

.ampro-teacher-panel__swatch--practice {
	background: #fdf2e0;
	border-color: #f0dba8;
}

.ampro-calendar-event--practice {
	opacity: 0.92;
}

.ampro-calendar-event__teacher {
	font-size: 0.85em;
	opacity: 0.85;
}

/* -----------------------------------------------------------------------
 * Fase 2.0.3 — la Fase 2.0.2 (32px/fila de 15 min → 64px por franja de
 * 30 min) seguía resultando justa en prueba real: el nombre del
 * alumno quedaba apretado o se cortaba en algunas franjas ocupadas.
 * Se sube más la altura de fila (40px/15 min → 80px por franja de 30
 * min, dentro del rango 78-84px que pide el encargo) y se da bastante
 * más aire a cada línea: instrumento en negrita, hora pequeña pero
 * clara, alumno/a en tamaño igual o mayor que la hora, y estado
 * ("Libre"/"Completa") como línea aparte, siempre bien diferenciada.
 * Solo se toca el calendario del Panel profesor
 * (`#ampro-teacher-panel-calendar`) — el calendario público de
 * matrícula, el resto de listados admin y los otros dos calendarios
 * (Franjas de práctica y Horarios de grupo del admin general) no se
 * tocan.
 * --------------------------------------------------------------------- */

#ampro-teacher-panel-calendar .fc-timegrid-slot {
	height: 40px;
}

#ampro-teacher-panel-calendar .ampro-calendar-event {
	box-sizing: border-box;
	padding: 6px 8px;
	line-height: 1.3;
	overflow: hidden;
	min-height: 100%;
	display: flex;
	flex-direction: column;
	gap: 1px;
}

#ampro-teacher-panel-calendar .ampro-calendar-event__title {
	font-size: 13px;
	font-weight: 700;
	white-space: normal;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}

#ampro-teacher-panel-calendar .ampro-calendar-event__time {
	font-size: 11px;
	font-weight: 500;
	opacity: 0.9;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

#ampro-teacher-panel-calendar .ampro-calendar-event__teacher {
	font-size: 11px;
	white-space: normal;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}

#ampro-teacher-panel-calendar .ampro-calendar-event__students {
	font-size: 13px;
	font-weight: 700;
	white-space: normal;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	line-height: 1.25;
}

#ampro-teacher-panel-calendar .ampro-calendar-event__occupancy {
	display: inline-block;
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	opacity: 0.95;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	margin-top: auto;
	padding-top: 2px;
}

.ampro-calendar-event__tag {
	display: inline-block;
	font-size: 9px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	background: rgba(255,255,255,0.55);
	border-radius: 3px;
	padding: 1px 5px;
	margin-top: 2px;
}

/* Colores por estado — verdes/azules suaves, nunca rojo agresivo,
 * tal y como pide el encargo ("no usar rojo agresivo salvo error"),
 * con buen contraste de texto en los tres casos. */
.ampro-calendar-event--free {
	background: #eaf6ec !important;
	border-color: #bfe2c4 !important;
	color: #1e5c2a !important;
}

.ampro-calendar-event--partial {
	background: #fdf1de !important;
	border-color: #f0d3a0 !important;
	color: #7a4a00 !important;
}

.ampro-calendar-event--full {
	background: #f3e3e1 !important;
	border-color: #dcb5b0 !important;
	color: #7a2e26 !important;
}

.ampro-calendar-detail__students-list {
	list-style: none;
	margin: 6px 0 0;
	padding: 0;
}

.ampro-calendar-detail__students-list li {
	border: 1px solid #e2e8f0;
	border-radius: 6px;
	padding: 8px 10px;
	margin-bottom: 8px;
}

.ampro-calendar-detail__student-name {
	font-weight: 600;
}

.ampro-calendar-detail__student-course {
	font-size: 12px;
	color: #6b7280;
	margin: 2px 0 6px;
}


/* -----------------------------------------------------------------------
 * Evaluaciones: formulario más legible para profesorado
 * --------------------------------------------------------------------- */

.ampro-teacher-evaluations-card .form-table select {
	min-width: 280px;
}

.ampro-teacher-evaluations-card .form-table input.regular-text,
.ampro-teacher-evaluations-card .form-table textarea.large-text {
	max-width: 520px;
}

.ampro-teacher-evaluations-card .description {
	max-width: 620px;
}

/* -----------------------------------------------------------------------
 * Ficha de alumno: aviso de bloqueo de acceso
 * --------------------------------------------------------------------- */

.ampro-teacher-panel .notice.inline {
	margin: 0 0 16px;
}

@media screen and (max-width: 782px) {
	.ampro-teacher-panel__card {
		min-width: 45%;
	}

	.ampro-teacher-panel__filters {
		flex-direction: column;
		align-items: stretch;
	}

	.ampro-teacher-panel__filters select,
	.ampro-teacher-panel__filters input[type="search"],
	.ampro-teacher-panel__filters input[type="text"] {
		width: 100%;
		min-width: 0;
	}
}

/* -----------------------------------------------------------------------
 * 3.3.42 — Flujo trimestral de evaluaciones.
 * --------------------------------------------------------------------- */
.ampro-teacher-period-workflow {
	margin: 12px 0 24px;
}

.ampro-teacher-period-workflow__heading,
.ampro-teacher-evaluations-history-head,
.ampro-teacher-period-actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px 18px;
	flex-wrap: wrap;
}

.ampro-teacher-period-workflow__heading h3,
.ampro-teacher-evaluations-history-head h3 {
	margin: 0 0 4px;
}

.ampro-teacher-period-workflow__heading select {
	min-width: 260px;
}

.ampro-teacher-period-cards {
	margin-top: 16px;
	margin-bottom: 14px;
}

.ampro-teacher-period-actions {
	justify-content: flex-start;
	margin: 14px 0;
}

.ampro-teacher-period-actions form {
	margin: 0;
}

.ampro-teacher-period-table-wrap {
	overflow-x: auto;
}

.ampro-teacher-period-table td,
.ampro-teacher-period-table th {
	vertical-align: middle;
}

.ampro-teacher-period-table td:last-child {
	white-space: nowrap;
}

.ampro-teacher-evaluations-divider {
	border: 0;
	border-top: 1px solid #dcdcde;
	margin: 26px 0 20px;
}

.ampro-teacher-evaluations-history-head {
	margin-bottom: 12px;
}

@media screen and (max-width: 782px) {
	.ampro-teacher-period-workflow__heading,
	.ampro-teacher-evaluations-history-head {
		align-items: stretch;
	}

	.ampro-teacher-period-workflow__heading form,
	.ampro-teacher-period-workflow__heading select {
		width: 100%;
		min-width: 0;
	}
}

/* 3.3.57 · Fichaje profesor */
.ampro-timeclock-status{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px;border:1px solid #dce3eb;border-radius:12px;background:#f8fafc;margin:14px 0}.ampro-timeclock-status>div{display:flex;flex-direction:column;gap:3px}.ampro-timeclock-status>div>span{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:#657184;font-weight:700}.ampro-timeclock-status>div>strong{font-size:24px;line-height:1.1}.ampro-timeclock-status>div>small{color:#657184}.ampro-timeclock-status.is-open{background:#f1faf5;border-color:#b9dfc8}.ampro-timeclock-main-button{min-width:150px!important;min-height:42px!important;font-weight:700!important}.ampro-timeclock-network-notice{margin:12px 0 0!important}.ampro-timeclock-ip{display:block;margin-top:4px;color:#657184;font-size:11px}.ampro-timeclock-history td,.ampro-timeclock-history th{vertical-align:middle}
@media(max-width:700px){.ampro-timeclock-status{align-items:stretch;flex-direction:column}.ampro-timeclock-status form,.ampro-timeclock-main-button{width:100%!important}}

/* 3.3.60 · Seguimiento por contextos evaluables */
.ampro-teacher-context-formation{
	margin-bottom:6px;
}
.ampro-teacher-context-statuses{
	display:flex;
	flex-wrap:wrap;
	gap:5px;
}
.ampro-teacher-context-statuses .ampro-badge{
	white-space:nowrap;
}