/**
 * Disruptia LMS — embed de actividades ([dsr_activity]).
 *
 * Mismo sistema que la ruta: superficie propia, tokens --dsr-*, radios
 * amplios y sombras suaves. El iframe es el protagonista; el marco solo
 * aparece cuando hay algo que decir (guardado, error, sin sesión).
 */

.dsr-activity,
.dsr-activity * { box-sizing: border-box; }

.dsr-activity {
	position: relative;
	width: 100%;
	margin: clamp(18px, 2.4vw, 28px) 0;
	border-radius: clamp(18px, 2vw, 26px);
	overflow: hidden;
	background: linear-gradient(140deg, var(--dsr-surface-hi, #0B3A72), var(--dsr-surface-lo, #041020));
	border: 1px solid var(--dsr-hairline, rgba(255, 255, 255, .13));
	box-shadow: var(--dsr-shadow, 0 18px 50px rgba(0, 0, 0, .32));
}

/* ---------- Marco de lección (U2, 0.6.3) ----------
   [dsr_lesson]: la página de lección es la protagonista — sin margen
   extra, sin gradiente de tarjeta detrás (la lección pinta su propio
   fondo) y a ras del marco del temario. */
.dsr-activity--lesson {
	margin: 0;
	background: none;
	border: 0;
	box-shadow: none;
}

/* ---------- Encabezado: qué es y qué cuenta ---------- */
.dsr-activity-head {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 18px;
	border-bottom: 1px solid var(--dsr-hairline, rgba(255, 255, 255, .1));
	background: var(--dsr-veil, rgba(2, 8, 23, .35));
}

.dsr-activity-chip {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	padding: 6px 11px;
	border-radius: 999px;
	background: var(--dsr-primary-soft, rgba(118, 213, 255, .12));
	border: 1px solid var(--dsr-border, rgba(118, 213, 255, .3));
	color: var(--dsr-primary-2, #76D5FF);
	font-size: 11px;
	font-weight: 950;
	line-height: 1;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.dsr-activity-title {
	min-width: 0;
	color: var(--dsr-heading, #fff);
	font-size: 15px;
	font-weight: 900;
	line-height: 1.3;
	letter-spacing: -.01em;
}

.dsr-activity iframe {
	display: block;
	width: 100%;
	border: 0;
	background: transparent;
	/* SIN transition de height (0.6.5): una CSSTransition puede quedarse
	   congelada en "running" y clavar el iframe en su altura inicial para
	   siempre — le gana hasta al inline !important (cascada de transición).
	   Visto en vivo el 16-ago: iframe en 900px con contenido de 1502, scroll
	   interno y estudiante cayendo al fondo en cada cambio de secuencia.
	   El resize instantáneo es correcto; la animación era solo cosmética. */
}

/* Sin adornos mientras carga: la actividad es la protagonista y trae su
   propia paleta — nada de velos ni animaciones encima (feedback 4-ago). */

/* ---------- Barra de estado ----------
   Doble selector a propósito: el estado es un <p> dentro del contenido de
   la lección, y reglas como `.dtv-lesson-content p { color: #24384A }`
   (WPCode) lo pintaban oscuro sobre oscuro — invisible (bug 11-ago). */
.dsr-activity .dsr-activity-status {
	margin: 0;
	padding: 12px 18px;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.45;
	letter-spacing: -.005em;
	color: var(--dsr-text, #D9E7F2);
	border-top: 1px solid var(--dsr-hairline, rgba(255, 255, 255, .13));
	background: var(--dsr-veil, rgba(2, 8, 23, .35));
}

.dsr-activity[data-dsr-state="saved"] .dsr-activity-status {
	color: var(--dsr-ok, #7CE3A8);
}

.dsr-activity[data-dsr-state="error"] .dsr-activity-status,
.dsr-activity[data-dsr-state="anonymous"] .dsr-activity-status {
	color: var(--dsr-accent, #F4D891);
	background: var(--dsr-accent-soft, rgba(216, 180, 106, .08));
	border-top-color: var(--dsr-accent-border, rgba(216, 180, 106, .36));
}

/* ---------- Verificación de identidad bio-data (0.5.75) ----------
   Sustituye al iframe del examen hasta confirmar. Mismo lenguaje del
   marco: superficie oscura, tokens, radios amplios, pesos altos. */
.dsr-bio-panel {
	padding: clamp(22px, 3vw, 34px);
	max-width: 560px;
}

.dsr-bio-title {
	margin: 0 0 10px;
	color: var(--dsr-heading, #fff);
	font-size: clamp(19px, 1.6vw, 24px);
	font-weight: 950;
	letter-spacing: -.02em;
	line-height: 1.2;
}

.dsr-bio-text {
	margin: 0 0 20px;
	color: var(--dsr-text, #D9E7F2);
	font-size: 14.5px;
	font-weight: 650;
	line-height: 1.55;
}

.dsr-bio-field {
	display: block;
	margin: 0 0 16px;
}

.dsr-bio-field span {
	display: block;
	margin-bottom: 7px;
	color: var(--dsr-muted, #AFC7DC);
	font-size: 12.5px;
	font-weight: 850;
	letter-spacing: .03em;
	text-transform: uppercase;
}

.dsr-bio-field input {
	width: 100%;
	min-height: 50px;
	padding: 12px 16px;
	border-radius: 14px;
	border: 1px solid var(--dsr-border, rgba(118, 213, 255, .25));
	background: var(--dsr-veil, rgba(2, 8, 23, .35));
	color: var(--dsr-heading, #fff);
	font-size: 15px;
	font-weight: 700;
}

.dsr-bio-field input:focus {
	outline: none;
	border-color: var(--dsr-primary-2, #76D5FF);
	box-shadow: 0 0 0 3px var(--dsr-primary-soft, rgba(118, 213, 255, .18));
}

.dsr-bio-actions {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	margin: 4px 0 0;
}

.dsr-bio-submit {
	padding: 14px 26px;
	border: 0;
	border-radius: 999px;
	background: linear-gradient(120deg, var(--dsr-primary, #0F65FF), var(--dsr-primary-2, #76D5FF) 170%);
	color: var(--dsr-on-primary, #fff);
	font-size: 13px;
	font-weight: 950;
	letter-spacing: .05em;
	text-transform: uppercase;
	cursor: pointer;
	transition: filter .2s ease, transform .2s ease;
}

.dsr-bio-submit:hover { filter: brightness(1.12); }
.dsr-bio-submit:disabled { opacity: .6; cursor: wait; }

.dsr-bio-status {
	color: var(--dsr-accent, #F4D891);
	font-size: 13.5px;
	font-weight: 750;
}

/* ---------- Aviso de actividad sin registrar (solo admins) ---------- */
.dsr-activity-missing {
	padding: 18px 22px;
	border-style: dashed;
	border-color: var(--dsr-accent-border, rgba(216, 180, 106, .36));
}

.dsr-activity-missing p {
	margin: 0;
	color: var(--dsr-accent, #F4D891);
	font-size: 14px;
	font-weight: 700;
}

.dsr-activity-missing code {
	padding: 2px 7px;
	border-radius: 8px;
	background: var(--dsr-veil, rgba(2, 8, 23, .35));
	font-size: 13px;
}
