/* Área de inscripción. Mobile-first. */
.inscripcion { padding-top: 16px; padding-bottom: 32px; }
.inscripcion h2 { margin-top: 8px; }
.nota { color: var(--color-texto-suave); font-size: 0.9rem; }

.estado { display: flex; flex-direction: column; gap: 4px; margin: 12px 0; padding: 14px 16px; border-radius: var(--radio); background: var(--color-superficie-2); border-left: 6px solid var(--color-acento); }
.estado-pendiente { border-left-color: var(--color-primario); }
.estado-aprobada { border-left-color: var(--color-ok); }
.estado-rechazada { border-left-color: var(--color-error); }

.bloque { margin-top: 24px; padding: 16px; border-radius: var(--radio); background: var(--color-superficie); border: 1px solid var(--color-borde); }
.bloque h3 { margin-bottom: 4px; }
.responsable { display: flex; flex-direction: column; gap: 8px; }

.casilleros { display: grid; grid-template-columns: 1fr; gap: 14px; margin-top: 12px; }
.casillero { display: flex; flex-direction: column; gap: 8px; padding: 12px; border-radius: 12px; background: var(--color-superficie-2); }
.casillero h4 { margin: 0; }
.vista-previa { display: grid; place-items: center; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 10px; background: rgba(0, 0, 0, 0.3); }
.vista-previa img, .vista-previa video { width: 100%; height: 100%; object-fit: cover; }
.vista-previa .vacio { color: var(--color-texto-suave); }
.casillero label.boton { position: relative; }
.casillero progress { width: 100%; height: 8px; accent-color: var(--color-primario); }
.mensaje { min-height: 1.2em; margin: 0; font-size: 0.9rem; }
.mensaje.error { color: var(--color-error); }
.mensaje.ok { color: var(--color-ok); }

.tarjeta-login form + form { margin-top: 10px; }

@media (min-width: 768px) {
  .casilleros { grid-template-columns: repeat(2, 1fr); }
  .responsable { flex-direction: row; align-items: flex-end; }
  .responsable .campo { flex: 1; margin-bottom: 0; }
}

@media (min-width: 1100px) {
  .casilleros { grid-template-columns: repeat(4, 1fr); }
}