/**
 * Bloques de contenido de las lecciones (objetivo, temario, recordatorios,
 * recursos y avisos).
 *
 * REGLA: aquí NO se define ni un solo color propio.
 *
 * Todo se hereda de los design tokens de Tutor (--tutor-text-primary,
 * --tutor-surface-l1, --tutor-border-idle…), que ya cambian solos según el modo
 * en que esté el sitio: claro, oscuro o automático. Donde no hay token
 * disponible se usa `currentColor` con transparencia, que también sigue al
 * texto del contexto.
 *
 * Así estos bloques nunca chocan con el tema: si el sitio se pone en oscuro,
 * ellos se ponen en oscuro; si mañana se cambia la paleta de Tutor, la siguen
 * sin tocar este archivo. Solo se define ESTRUCTURA (espaciado, bordes, radios).
 */

/* ---------- Objetivo de la lección ---------- */
.acad-obj {
	border-inline-start: 4px solid currentColor;
	background: color-mix(in srgb, currentColor 6%, transparent);
	padding: 14px 18px;
	border-radius: 0 8px 8px 0;
	margin: 0 0 20px;
}

.acad-obj__label {
	margin: 0 0 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	opacity: .75;
}

.acad-obj__txt {
	margin: 0;
	font-weight: 600;
}

/* ---------- Subtítulos y listas del cuerpo ---------- */
.acad-lec__sub {
	margin: 22px 0 8px;
	font-weight: 700;
}

.acad-lec__lista {
	margin: 0 0 8px;
	padding-inline-start: 20px;
}

.acad-lec__lista li {
	margin: 5px 0;
}

/* ---------- Caja "Para recordar" ---------- */
.acad-clave {
	border: 1px solid var(--tutor-border-idle, color-mix(in srgb, currentColor 18%, transparent));
	border-radius: 10px;
	padding: 16px 20px;
	margin: 22px 0;
	background: color-mix(in srgb, currentColor 4%, transparent);
}

.acad-clave__titulo {
	margin: 0 0 8px;
	font-weight: 700;
}

/* ---------- Caja de recursos externos ---------- */
.acad-recursos {
	border: 1px solid var(--tutor-border-idle, color-mix(in srgb, currentColor 18%, transparent));
	border-radius: 10px;
	padding: 18px 20px;
	margin: 22px 0;
	background: color-mix(in srgb, currentColor 4%, transparent);
}

.acad-recursos__titulo {
	margin: 0 0 4px;
	font-weight: 700;
}

.acad-recursos__nota {
	margin: 0 0 10px;
	font-size: 13.5px;
	opacity: .75;
}

.acad-recursos__lista {
	list-style: none;
	margin: 0;
	padding: 0;
}

.acad-recursos__lista li {
	margin: 6px 0;
}

.acad-recursos__lista a {
	font-weight: 600;
	text-decoration: none;
}

.acad-recursos__lista a:hover,
.acad-recursos__lista a:focus-visible {
	text-decoration: underline;
}

/* Etiqueta del tipo de recurso: contorno, sin color propio. */
.acad-badge {
	display: inline-block;
	min-width: 46px;
	text-align: center;
	border: 1px solid currentColor;
	border-radius: 4px;
	font-size: 11px;
	font-weight: 700;
	padding: 1px 6px;
	margin-inline-end: 8px;
	vertical-align: middle;
	opacity: .8;
}

/* ---------- Avisos ----------
 * Un aviso necesita leerse COMO aviso, así que aquí sí se distingue del texto
 * normal — pero con los tokens semánticos del propio Tutor
 * (--tutor-text-warning / --tutor-border-warning), no con colores nuestros.
 * Si el sitio cambia de modo o de paleta, el aviso cambia con él; y si el token
 * no existiera, cae en `currentColor` y sigue siendo legible.
 */
.acad-aviso {
	border-inline-start: 4px solid var(--tutor-border-warning, currentColor);
	background: color-mix(in srgb, var(--tutor-text-warning, currentColor) 8%, transparent);
	padding: 10px 14px;
	border-radius: 0 8px 8px 0;
	margin: 0 0 18px;
	font-size: 14px;
}

/* Variante informativa: mismo criterio, token de marca de Tutor. */
.acad-aviso--info {
	border-inline-start-color: var(--tutor-border-brand, currentColor);
	background: color-mix(in srgb, var(--tutor-text-brand, currentColor) 8%, transparent);
	padding: 12px 16px;
}